:root{
  --bg:#00060b;
  --bg2:#000208;
  --panel:rgba(6,18,30,.55);
  --panel2:rgba(6,18,30,.25);
  --text:#e9f3ff;
  --muted:rgba(233,243,255,.62);
  --muted2:rgba(233,243,255,.46);

  --gold:#FFD700;
  --gold2:#ffb700;
  --blue:#00C2FF;
  --blue2:#007BFF;

  --serif:'Cormorant Garamond',serif;
  --sans:'Rajdhani',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;

  --radius:14px;
  --radius2:18px;
  --shadow: 0 0 46px rgba(0,194,255,.08);
  --shadow2: 0 0 64px rgba(0,194,255,.14), 0 0 46px rgba(255,215,0,.10);
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:
    radial-gradient(1200px 800px at 50% -10%, rgba(0,194,255,.10), transparent 65%),
    radial-gradient(900px 700px at 20% 30%, rgba(255,215,0,.10), transparent 60%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg) 55%, var(--bg2) 100%);
  color:var(--text);
  font-family:var(--sans);
  overflow-x:hidden;
  min-height:100vh;
}

a{color:inherit;}
img{max-width:100%;display:block;}
.container{width:min(1160px, 92vw); margin:0 auto;}
.spacer{height:1px;}

.float-free{
  display:inline-block;
  transform-origin:center;
  animation: floatPulse 6.2s ease-in-out infinite alternate;
  filter: drop-shadow(0 0 18px rgba(0,194,255,.35)) drop-shadow(0 0 22px rgba(255,215,0,.20));
}
@keyframes floatPulse{0%{transform:translateY(0) scale(1);}100%{transform:translateY(-6px) scale(1.04);}}

.reveal{opacity:1; transform:none; transition: opacity .9s cubic-bezier(.23,1,.32,1), transform .9s cubic-bezier(.23,1,.32,1);}
.reveal.in{opacity:1; transform:none;}
.reveal-delay-1{transition-delay:.10s;}
.reveal-delay-2{transition-delay:.20s;}
.reveal-delay-3{transition-delay:.30s;}

nav{
  position:fixed; inset:0 0 auto 0; z-index:1000;
  display:flex; align-items:center; gap:1.2rem;
  padding:1.05rem 3rem;
  background: linear-gradient(to bottom, rgba(0,6,11,.92), rgba(0,6,11,.55), transparent);
  transition: background .35s, border-color .35s;
}
nav.scrolled{
  background: rgba(0,6,11,.92);
  backdrop-filter: blur(18px);
  border-bottom:1px solid rgba(0,194,255,.16);
}
.nav-brand{display:flex; align-items:center; gap:.9rem; text-decoration:none;}
.nav-logo{height:38px; cursor:pointer;}
.nav-wordmark{line-height:1;}
.nav-wordmark b{display:block; font-family:var(--mono); font-size:.70rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(233,243,255,.86);}
.nav-wordmark span{display:block; margin-top:.15rem; font-family:var(--mono); font-size:.60rem; letter-spacing:.22em; text-transform:uppercase; color:rgba(0,194,255,.72);}

.nav-links{display:flex; gap:2.0rem; margin-left:1.6rem; flex-wrap:wrap;}
.nav-links a{
  font-family:var(--mono);
  font-size:.70rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(233,243,255,.58);
  text-decoration:none;
  transition:color .2s, text-shadow .2s;
}
.nav-links a:hover{color:var(--blue); text-shadow:0 0 16px rgba(0,194,255,.35);}

.nav-right{margin-left:auto; display:flex; align-items:center; gap:.8rem;}
.btn{
  border-radius:8px;
  border:1px solid rgba(0,194,255,.22);
  background: rgba(0,6,11,.20);
  color:var(--text);
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  cursor:pointer;
  font-weight:650;
  padding:.72rem 1.25rem;
  transition: transform .2s, box-shadow .2s, border-color .2s, color .2s;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn:hover{
  transform: translateY(-2px);
  border-color: rgba(255,215,0,.30);
  color: var(--blue);
  box-shadow: 0 0 34px rgba(0,194,255,.16);
}
.btn-primary{
  border:1px solid rgba(255,215,0,.28);
  background: linear-gradient(135deg, rgba(255,215,0,.88), rgba(0,194,255,.22));
  color:#001018;
  font-weight:800;
  box-shadow: 0 0 36px rgba(255,215,0,.22), 0 0 40px rgba(0,194,255,.16);
}
.btn-primary:hover{border-color: rgba(0,194,255,.32); box-shadow: 0 0 58px rgba(255,215,0,.30), 0 0 60px rgba(0,194,255,.22); color:#001018;}

.nav-toggle{
  display:none;
  width:40px;height:40px;
  border-radius:10px;
  border:1px solid rgba(0,194,255,.20);
  background: rgba(0,6,11,.24);
  cursor:pointer;
}
.nav-toggle svg{width:20px;height:20px;margin:0 auto; fill:rgba(233,243,255,.75);}
.drawer{
  position:fixed; top:0; right:-380px; width:min(380px, 92vw); height:100vh; z-index:1100;
  background: rgba(0,6,11,.96);
  border-left:1px solid rgba(0,194,255,.18);
  box-shadow: -30px 0 80px rgba(0,0,0,.55);
  transition:right .28s cubic-bezier(.22,1,.36,1);
  padding:1.15rem 1.15rem 2rem;
}
.drawer.open{right:0;}
.drawer-header{display:flex; align-items:center; justify-content:space-between; gap:1rem;}
.drawer a{display:block; padding:1rem .75rem; text-decoration:none; border-radius:10px; font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(233,243,255,.72); border:1px solid transparent;}
.drawer a:hover{border-color: rgba(0,194,255,.18); background: rgba(6,18,30,.22); color: var(--blue);}
.backdrop{position:fixed; inset:0; z-index:1050; background: rgba(0,0,0,.55); opacity:0; pointer-events:none; transition: opacity .2s ease;}
.backdrop.open{opacity:1; pointer-events:auto;}

main{padding-top:6.2rem;}
.hero{
  position:relative;
  min-height:92vh;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.hero canvas{position:absolute; inset:0; width:100%; height:100%;}
.hero::after{
  content:'';
  position:absolute; inset:0;
  background: radial-gradient(ellipse at center, transparent 40%, rgba(0,6,11,.82) 100%);
  pointer-events:none;
}
.hero-inner{position:relative; z-index:2; text-align:center; padding:0 2rem; width:min(980px, 92vw);}
.eyebrow{font-family:var(--mono); font-size:.72rem; letter-spacing:.35em; text-transform:uppercase; color:rgba(0,194,255,.85); margin-bottom:1.1rem;}
.h1{font-family:var(--serif); font-size:clamp(2.9rem,7vw,5.8rem); font-weight:300; line-height:1.05; letter-spacing:.045em; margin-bottom:1.15rem;}
.h1 em{font-style:italic; color:var(--gold); text-shadow:0 0 26px rgba(255,215,0,.34), 0 0 26px rgba(0,194,255,.18);}
.sub{font-size:1.08rem; color:var(--muted); letter-spacing:.08em; line-height:1.75; max-width:760px; margin:0 auto 2.1rem;}
.hero-logo{width:min(430px, 74vw); margin:0 auto 1.4rem;}
.hero-actions{display:flex; gap:.9rem; justify-content:center; flex-wrap:wrap;}
.scroll-hint{position:absolute; bottom:2.0rem; left:50%; transform:translateX(-50%); z-index:2; font-family:var(--mono); font-size:.62rem; letter-spacing:.2em; color:rgba(233,243,255,.52); animation:bounce 2s infinite;}
@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}

section{padding:7.5rem 0; position:relative; overflow:hidden;}
.section-label{font-family:var(--mono); font-size:.65rem; letter-spacing:.3em; text-transform:uppercase; color:rgba(0,194,255,.80); margin-bottom:1rem; display:block;}
.h2{font-family:var(--serif); font-size:clamp(2rem,4vw,3.4rem); font-weight:300; line-height:1.1; letter-spacing:.05em; margin-bottom:1.1rem;}
.h2 em{font-style:italic; color:var(--gold); text-shadow:0 0 18px rgba(255,215,0,.25);}
.p{font-size:1.03rem; color:var(--muted); line-height:1.85; max-width:840px;}

.grid3{display:grid; grid-template-columns:repeat(3, 1fr); gap:1.6rem; margin-top:3.3rem;}
.grid2{display:grid; grid-template-columns:repeat(2, 1fr); gap:1.8rem; margin-top:3.1rem;}
.card{
  padding:2.35rem 2.1rem;
  border-radius:var(--radius);
  border:1px solid rgba(0,194,255,.15);
  background: linear-gradient(135deg, rgba(6,18,30,.55), rgba(6,18,30,.22));
  box-shadow: var(--shadow);
  position:relative;
  overflow:hidden;
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.card::before{
  content:'';
  position:absolute; inset:-40%;
  background:
    radial-gradient(circle at 30% 30%, rgba(0,194,255,.16), transparent 55%),
    radial-gradient(circle at 70% 70%, rgba(255,215,0,.14), transparent 58%);
  opacity:.35;
  transform: rotate(18deg);
}
.card:hover{transform: translateY(-6px); border-color: rgba(255,215,0,.22); box-shadow: var(--shadow2);}
.card > *{position:relative;}
.badge{display:inline-block; padding:.25rem .7rem; border:1px solid rgba(0,194,255,.22); border-radius:999px; font-family:var(--mono); font-size:.58rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(233,243,255,.62); margin-bottom:1rem;}
.price{font-family:var(--serif); font-size:2.10rem; font-weight:300; color:var(--gold); text-shadow: 0 0 22px rgba(255,215,0,.25); line-height:1.05; margin:.15rem 0 .85rem;}
.card-title{font-family:var(--serif); font-size:1.55rem; font-weight:300; letter-spacing:.05em; margin-bottom:.55rem;}
.card-desc{font-size:.95rem; color:rgba(233,243,255,.62); line-height:1.7;}
.list{margin-top:1.05rem; display:flex; flex-direction:column; gap:.55rem;}
.list span{font-size:.86rem; color:rgba(233,243,255,.60); line-height:1.35;}
.note{margin-top:2.2rem; border:1px solid rgba(0,194,255,.14); border-radius:var(--radius); padding:1.75rem; background: rgba(6,18,30,.25);}

.leader{display:flex; gap:1.5rem; align-items:flex-start;}
.leader img{width:200px; border-radius:var(--radius2);}
.leader h3{font-family:var(--serif); font-size:2.0rem; font-weight:300; letter-spacing:.04em;}
.leader .role{font-family:var(--mono); font-size:.68rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(0,194,255,.80); margin-top:.55rem;}
.leader .bio{margin-top:.9rem; color:var(--muted); line-height:1.8; font-size:1.0rem; max-width:620px;}
.leader .links{margin-top:1.0rem; display:flex; gap:.7rem; flex-wrap:wrap;}

.kpi-row{margin-top:2.1rem; display:flex; flex-wrap:wrap; gap:2.8rem;}
.kpi{display:flex; flex-direction:column; gap:.3rem;}
.kpi b{font-family:var(--serif); font-size:2.75rem; font-weight:300; color:var(--gold); text-shadow:0 0 20px rgba(255,215,0,.24); line-height:1;}
.kpi span{font-family:var(--mono); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(233,243,255,.55);}

.split{display:grid; grid-template-columns:1.1fr .9fr; gap:4rem; align-items:center; margin-top:3rem;}
.frame{border:1px solid rgba(0,194,255,.16); border-radius:var(--radius); overflow:hidden; background: linear-gradient(135deg, rgba(6,18,30,.55), rgba(6,18,30,.22)); box-shadow:0 0 54px rgba(0,194,255,.10); height:440px; position:relative;}
.frame canvas{position:absolute; inset:0; width:100%; height:100%;}

footer{
  padding:3.1rem 0;
  border-top:1px solid rgba(0,194,255,.12);
}
.footer-row{display:flex; align-items:center; gap:1.5rem;}
.footer-logo{height:28px; opacity:.75;}
.footer-text{font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(233,243,255,.55);}
.footer-links{margin-left:auto; display:flex; gap:1.6rem; flex-wrap:wrap;}
.footer-links a{font-family:var(--mono); font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(233,243,255,.55); text-decoration:none; transition:color .2s, text-shadow .2s;}
.footer-links a:hover{color:var(--blue); text-shadow:0 0 14px rgba(0,194,255,.30);}

.page-hero{
  padding:7.25rem 0 3.5rem;
}
.page-hero .h1{font-size:clamp(2.5rem,5vw,4.6rem);}
.breadcrumb{margin-top:1.0rem; font-family:var(--mono); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(233,243,255,.52);}
.breadcrumb a{color:rgba(0,194,255,.78); text-decoration:none;}
.breadcrumb a:hover{color:var(--gold);}

/* Forms */
form{margin-top:2.2rem;}
.field-grid{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;}
.field{display:flex; flex-direction:column; gap:.5rem;}
label{font-family:var(--mono); font-size:.62rem; letter-spacing:.18em; text-transform:uppercase; color:rgba(233,243,255,.68);}
input, select, textarea{
  padding: .9rem 1rem;
  border-radius: 12px;
  border:1px solid rgba(0,194,255,.18);
  background: rgba(6,18,30,.22);
  color: var(--text);
  font-family: var(--sans);
  font-size: 1rem;
  outline: none;
}
textarea{min-height:140px; resize:vertical;}
input:focus, select:focus, textarea:focus{border-color: rgba(255,215,0,.32); box-shadow: 0 0 0 4px rgba(0,194,255,.10);}

.helper{margin-top:.5rem; color:var(--muted2); font-size:.95rem; line-height:1.65;}
.form-actions{display:flex; gap:.9rem; flex-wrap:wrap; margin-top:1.1rem; align-items:center;}
.smallprint{margin-top:1.1rem; font-family:var(--mono); font-size:.60rem; letter-spacing:.14em; text-transform:uppercase; color:rgba(233,243,255,.46); line-height:1.8;}

.blog-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:1.6rem; margin-top:3.1rem;}
.post-meta{font-family:var(--mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:rgba(233,243,255,.52); margin-top:.8rem;}
.post-title{font-family:var(--serif); font-size:1.65rem; font-weight:300; letter-spacing:.04em; margin-top:.55rem;}
.post-excerpt{margin-top:.8rem; color:var(--muted); line-height:1.8;}
.post-body{margin-top:2.2rem; color:rgba(233,243,255,.70); line-height:1.9; font-size:1.02rem;}
.post-body h2{font-family:var(--serif); font-weight:300; letter-spacing:.05em; margin:2.3rem 0 .8rem; font-size:2.0rem;}
.post-body h3{font-family:var(--mono); font-weight:600; letter-spacing:.12em; text-transform:uppercase; margin:1.8rem 0 .6rem; font-size:.86rem; color:rgba(0,194,255,.85);}
.post-body ul{margin: .6rem 0 0 1.2rem;}
.post-body li{margin:.35rem 0;}

hr.sep{border:none; border-top:1px solid rgba(0,194,255,.12); margin:2.2rem 0;}

/* Intro overlay */
#ns-intro{position:fixed;inset:0;z-index:9999;background:#02040a;transition:opacity 1.2s ease-in-out;}
#ns-intro.ns-done{opacity:0;pointer-events:none;}
#ns-skip{position:absolute;bottom:2rem;right:2rem;font-family:var(--mono);font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(0,194,255,.55);background:none;border:1px solid rgba(0,194,255,.22);border-radius:8px;padding:.55rem 1.1rem;cursor:pointer;transition:color .2s,border-color .2s;}
#ns-skip:hover{color:rgba(0,194,255,.95);border-color:rgba(0,194,255,.55);}
@keyframes nsEmerge{0%{opacity:0;filter:blur(30px) brightness(0);transform:scale(.8) translateY(50px)}50%{opacity:.8;filter:blur(5px) brightness(2)}100%{opacity:1;filter:blur(0);transform:scale(1) translateY(0)}}
@keyframes nsFloat{0%{transform:translateY(10px) scale(.98);filter:drop-shadow(0px 0px 0px rgba(0,200,255,0))}50%{transform:translateY(-15px) scale(1.02);filter:drop-shadow(0px 20px 45px rgba(100,220,255,.4)) drop-shadow(0px 0px 15px rgba(255,255,255,.2))}100%{transform:translateY(10px) scale(.98)}}
@keyframes nsTitleReveal{0%{opacity:0;filter:blur(12px);transform:translateY(20px);letter-spacing:.1em}100%{opacity:1;filter:blur(0);transform:translateY(0);letter-spacing:.3em}}
@keyframes nsSubReveal{0%{opacity:0;filter:blur(5px);transform:translateY(10px)}100%{opacity:1;filter:blur(0);transform:translateY(0)}}
.ns-logo-emerge{animation:nsEmerge 2.6s cubic-bezier(0.16,1,0.3,1) forwards,nsFloat 7s ease-in-out 2.6s infinite;}

/* Responsive */
@media (max-width: 1050px){
  nav{padding:1rem 1.1rem;}
  .nav-links{display:none;}
  .nav-toggle{display:block;}
  .btn{padding:.72rem 1.05rem;}
  section{padding:6.25rem 0;}
  .grid3{grid-template-columns:1fr;}
  .grid2{grid-template-columns:1fr;}
  .split{grid-template-columns:1fr; gap:2.4rem;}
  .frame{height:340px;}
  .leader{flex-direction:column;}
  .leader img{width:min(320px, 80vw);}
  .blog-grid{grid-template-columns:1fr;}
  .footer-row{flex-direction:column; align-items:flex-start;}
  .footer-links{margin-left:0;}
  .field-grid{grid-template-columns:1fr;}
}