{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'Inter', sans-serif;
background:#0e0e11;
color:#e6e6e6;
line-height:1.6;
}

a {
    text-decoration: none;
    color: inherit;
}

/* HERO */

.hero{
position:relative;
height:100vh;
background-image:url('hero.png');
background-size:cover;
background-position:center;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
}

.overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(10,10,12,0.8);
}

.hero-content{
position:relative;
max-width:800px;
padding:40px;
}

.hero h1{
font-size:64px;
font-weight:800;
letter-spacing:1px;
margin-bottom:10px;
}

.hero h2{
font-size:36px;
font-weight:300;
margin-bottom:25px;
opacity:0.9;
}

.tagline{
font-size:18px;
margin-bottom:30px;
color:#cccccc;
}

.construction{
font-size:14px;
letter-spacing:2px;
text-transform:uppercase;
opacity:0.7;
}


/* SECTIONS */

.section{
max-width:900px;
margin:auto;
padding:80px 40px;
}

.section h3{
font-size:26px;
margin-bottom:20px;
font-weight:400;
}

.section p{
margin-bottom:20px;
color:#cfcfcf;
}

.section ul{
list-style:none;
margin-top:20px;
}

.section li{
margin-bottom:10px;
opacity:0.9;
}

.dark{
background:#141418;
}


/* FOOTER */

footer{
text-align:center;
padding:60px 20px;
background:#0b0b0d;
font-size:14px;
opacity:0.8;
}

/* FADE IN HERO */

.fade-in{
opacity:0;
transform:translateY(20px);
animation:fadeUp 1.2s forwards;
}

.delay1{
animation-delay:0.4s;
}

.delay2{
animation-delay:0.8s;
}

.delay3{
animation-delay:1.2s;
}

@keyframes fadeUp{

to{
opacity:1;
transform:translateY(0);
}

}



/* SCROLL REVEAL */

.reveal{

opacity:0;
transform:translateY(40px);
transition:all 1s ease;

}

.reveal.active{

opacity:1;
transform:translateY(0);

}