body{
margin:0;
font-family:'Inter',sans-serif;
color:#0f172a;
}

/* HERO */
.hero{
height:70vh;
background:url("hero.jpg") center/cover no-repeat;
}
.overlay{
height:100%;
background:linear-gradient(to right,rgba(2,6,23,0.85),rgba(2,6,23,0.5));
display:flex;
align-items:center;
}
.hero-content{
margin-left:8%;
max-width:600px;
color:white;
}
h1{
font-size:42px;
}
.sub{
color:#cbd5e1;
margin-bottom:20px;
}
.btn{
background:white;
color:black;
padding:12px 20px;
text-decoration:none;
border-radius:6px;
}

/* SECTIONS */
.section{
padding:100px 10%;
}
.light{
background:white;
}
.dark{
background:#020617;
color:white;
}
.container{
max-width:1000px;
margin:auto;
}
.narrow{
max-width:700px;
margin:auto;
}
.center{
text-align:center;
}
.split{
display:flex;
gap:60px;
align-items:center;
}
.highlight{
font-weight:500;
}
.muted{
color:#64748b;
}

/* CARD */
.card{
background:white;
color:#0f172a;
padding:30px;
border-radius:10px;
}

/* IMAGE */
img{
width:100%;
border-radius:10px;
}

/* FORM */
.form{
display:flex;
flex-direction:column;
gap:15px;
margin-top:30px;
}
.form input,.form textarea{
padding:14px;
border-radius:6px;
border:1px solid rgba(255,255,255,0.2);
background:#020617;
color:white;
}
.form button{
padding:14px;
background:white;
color:black;
border:none;
border-radius:6px;
display:flex;
justify-content:center;
gap:10px;
cursor:pointer;
}
.form button:disabled{
opacity:0.7;
}

/* LOADER */
.loader{
width:16px;
height:16px;
border:2px solid rgba(0,0,0,0.2);
border-top:2px solid black;
border-radius:50%;
animation:spin 0.8s linear infinite;
}
.hidden{display:none;}
@keyframes spin{
0%{transform:rotate(0)}
100%{transform:rotate(360deg)}
}

/* SUCCESS */
.success{
padding:30px;
border:1px solid rgba(255,255,255,0.2);
border-radius:10px;
}

/* MAIL */
.mail{
margin-top:20px;
color:#cbd5e1;
}

/* RESPONSIVE */
@media(max-width:900px){
.split{
flex-direction:column;
}
}