<!DOCTYPE html>
<html lang=”it”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Lux Reality – Nuove Realtà</title>
<style>
body {
font-family: ‘Arial’, sans-serif;
margin: 0;
padding: 0;
background-color: #3d0043; /* Colore di sfondo più scuro */
color: #ffffff;
}
header {
background-color: rgba(61, 0, 67, 0.9); /* Header leggermente trasparente */
padding: 1rem;
position: fixed;
width: 100%;
top: 0;
z-index: 1000;
}
.logo {
max-width: 150px;
}
nav ul {
list-style-type: none;
display: flex;
justify-content: flex-end;
}
nav ul li {
margin-left: 20px;
}
nav ul li a {
color: #ffffff;
text-decoration: none;
font-size: 0.9em;
}
.hero {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
padding: 0 5%;
background-image: linear-gradient(to bottom right, #3d0043, #690079); /* Sfumatura di viola */
background-size: cover;
background-position: center;
}
.hero h1 {
font-size: 4.5em;
font-weight: 300; /* Font più leggero */
line-height: 1.2;
margin-bottom: 20px;
}
.hero h1 span {
display: block;
}
.vivile {
font-size: 1.8em;
font-weight: bold;
color: #ffffff; /* Bianco pieno */
}
.content {
padding: 5%;
background-color: #3d0043; /* Mantenere lo sfondo coerente */
}
.approach {
display: flex;
align-items: flex-start;
}
.approach h2 {
font-size: 3em;
margin-right: 50px;
flex-shrink: 0;
font-weight: 300; /* Font più leggero */
}
.approach-content {
flex-grow: 1;
}
.cta-button {
display: inline-block;
padding: 10px 20px;
background-color: #5a0060; /* Colore del pulsante leggermente più chiaro */
color: #ffffff;
text-decoration: none;
border-radius: 25px;
margin-top: 20px;
font-size: 0.9em;
}
</style>
</head>
<body>
<header>
<img src=”path-to-your-logo.png” alt=”Lux Reality Logo” class=”logo”>
<nav>
<ul>
<li><a href=”#servizi”>SERVIZI</a></li>
<li><a href=”#musei-online”>MUSEI ON LINE</a></li>
<li><a href=”#fiere-eventi”>FIERE ED EVENTI</a></li>
<li><a href=”#casi-studio”>CASI STUDIO</a></li> <!– Modificato da DEMO a CASI STUDIO –>
<li><a href=”#chi-siamo”>CHI SIAMO</a></li>
<li><a href=”#blog”>BLOG</a></li>
<li><a href=”#contatti”>CONTATTI</a></li>
<li><a href=”#language”>🇮🇹</a></li>
</ul>
</nav>
</header>
<section class=”hero”>
<h1>
<span>Non</span>
<span>immaginare</span>
<span>nuove realtà</span>
</h1>
<p class=”vivile”>Vivile</p>
</section>
<section class=”content”>
<div class=”approach”>
<h2>Il Nostro Approccio</h2>
<div class=”approach-content”>
<p>Lux Reality dà forma alle idee e le trasforma in splendide opportunità, grazie all’utilizzo mirato di tecnologie di ultima generazione.</p>
<p>Progettiamo e realizziamo soluzioni innovative per rendere la tua attività un’esperienza da vivere grazie alla realtà virtuale, aumentata e ibrida per aziende, istituti e privati.</p>
<a href=”#scopri-di-piu” class=”cta-button”>SCOPRI DI PIÙ</a>
</div>
</div>
</section>
</body>
</html>