:root{
  --bg:#0f1720;
  --card:#0b1220;
  --muted:#94a3b8;
  --accent:#0ea5a4;
  --accent-dark:#0b7f7e;
  --text:#e6eef6;
  --max-width:1100px;
  --radius:10px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:linear-gradient(180deg,#021018 0%,#07131a 100%);color:var(--text);line-height:1.6}
.container{max-width:var(--max-width);margin:0 auto;padding:2rem}
.site-header{background:transparent;padding:1rem 0;position:sticky;top:0;z-index:40}
.nav-wrap{display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:700;color:var(--text);text-decoration:none;font-size:1.1rem}
.site-nav{display:flex;gap:1rem;align-items:center}
.nav-link{color:var(--muted);text-decoration:none;padding:.4rem .6rem;border-radius:6px}
.nav-link:hover{color:var(--text);background:rgba(255,255,255,0.03)}
.nav-link.active{color:var(--accent);background:linear-gradient(90deg,rgba(14,165,164,0.08),transparent)}
.nav-toggle{display:none;background:none;border:1px solid rgba(255,255,255,0.04);color:var(--text);padding:.4rem .6rem;border-radius:6px}
.hero{min-height:54vh;background-size:cover;background-position:center;display:flex;align-items:center;color:var(--text);position:relative}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(2,6,23,0.45),rgba(2,6,23,0.6))}
.hero-inner{position:relative;padding:6rem 2rem}
.hero h1{margin:0;font-size:2.2rem}
.hero p{margin-top:1rem;color:var(--muted);max-width:60ch}
.btn-primary{display:inline-block;background:var(--accent);color:#043033;padding:.8rem 1.1rem;border-radius:8px;text-decoration:none;font-weight:600}
.intro{padding:2rem}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.4rem;padding:2rem}
.features article{background:rgba(255,255,255,0.02);padding:1.2rem;border-radius:8px}
.content{padding:2rem;background:rgba(255,255,255,0.01);border-radius:8px}
.site-footer{padding:2rem 0;color:var(--muted)}
.contact-wrap .contact-grid{display:grid;grid-template-columns:1fr 320px;gap:2rem}
form label{display:block;margin-bottom:1rem}
input,textarea{width:100%;padding:.6rem;border-radius:6px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:var(--text)}
.hidden{position:absolute;left:-9999px}

/* Transitions */
main{transition:opacity .45s ease,transform .45s ease}
.fade-out{opacity:0;transform:translateY(8px)}

/* Responsive */
@media(max-width:800px){
  .site-nav{display:none;position:absolute;right:1rem;top:64px;background:rgba(2,6,23,0.9);padding:1rem;border-radius:8px;flex-direction:column;width:220px}
  .nav-toggle{display:inline-block}
  .contact-wrap .contact-grid{grid-template-columns:1fr}
  .hero-inner{padding:4rem 1rem}
}
