:root{
  --bg:#02070b;
  --panel:#08131a;
  --panel2:#0a1821;
  --line:rgba(81,217,255,.22);
  --cyan:#19d9ff;
  --cyan2:#00a8d4;
  --text:#f5fbff;
  --muted:#a8b8c2;
  --shadow:0 0 24px rgba(25,217,255,.15);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:
  radial-gradient(circle at 50% -10%,rgba(0,170,212,.17),transparent 30%),
  linear-gradient(180deg,#010407 0%,#03090d 45%,#020609 100%);
  color:var(--text);font-family:Inter,system-ui,-apple-system,sans-serif;overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
.grid-bg{
  position:fixed;inset:0;pointer-events:none;opacity:.22;z-index:-3;
  background-image:linear-gradient(rgba(20,130,160,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(20,130,160,.12) 1px,transparent 1px);
  background-size:42px 42px;mask-image:linear-gradient(to bottom,transparent,black 25%,black 75%,transparent)
}
.ambient{position:fixed;width:420px;height:420px;border-radius:50%;filter:blur(100px);opacity:.08;z-index:-2}
.ambient-a{background:#00d9ff;top:15%;left:-140px}.ambient-b{background:#047ea3;right:-160px;top:50%}
.site-header{
  position:sticky;top:0;z-index:50;display:grid;grid-template-columns:210px 1fr 220px;align-items:center;
  gap:24px;padding:14px clamp(20px,4vw,70px);background:rgba(1,6,9,.8);backdrop-filter:blur(18px);border-bottom:1px solid rgba(51,214,255,.08)
}
.brand img{display:block;width:175px}.main-nav{display:flex;justify-content:center;gap:34px}
.main-nav a{font-size:14px;color:#cbd7dd;transition:.2s}.main-nav a:hover,.main-nav a.active{color:var(--cyan)}
.menu-toggle{display:none}
.btn{
  display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(25,217,255,.75);
  padding:13px 22px;border-radius:8px;text-transform:uppercase;letter-spacing:.06em;font-size:13px;font-weight:800;transition:.2s;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 24px rgba(25,217,255,.24)}
.btn-outline{box-shadow:0 0 14px rgba(25,217,255,.15),inset 0 0 12px rgba(25,217,255,.06)}
.btn-primary{background:linear-gradient(180deg,#21ddff,#07aed4);color:#001018;border-color:#27e4ff;box-shadow:0 0 24px rgba(25,217,255,.24)}
.btn-ghost{border-color:rgba(255,255,255,.18);color:#d9e5ea}
.hero{
  min-height:720px;max-width:1600px;margin:0 auto;padding:70px clamp(24px,4vw,70px) 25px;
  display:grid;grid-template-columns:1.02fr .92fr .82fr;align-items:center;gap:20px;position:relative
}
.hero:after{
  content:"";position:absolute;left:10%;right:10%;bottom:6%;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:.35
}
.eyebrow{color:var(--cyan);font-weight:800;letter-spacing:.11em;font-size:13px}
.hero h1,.section-heading h2,.about h2,.rebellion h2,.join h2,.contact h2,.brain-card h2{
  font-family:Oswald,Inter,sans-serif;margin:.15em 0;line-height:.98;text-transform:uppercase
}
.hero h1{font-size:clamp(58px,6vw,96px);letter-spacing:-.03em}.hero h1 span{color:var(--cyan)}
.hero-kicker{font-size:19px;color:#26ddff;font-weight:600}.lead{color:#cbd4d9;line-height:1.6;font-size:17px;max-width:660px}
.hero-actions{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.hero-mascot{position:relative;align-self:end;display:flex;justify-content:center;min-height:610px}
.hero-mascot img{width:min(100%,470px);object-fit:contain;align-self:end;position:relative;z-index:2;filter:drop-shadow(0 24px 50px rgba(0,0,0,.55))}
.platform{position:absolute;width:85%;height:90px;border:2px solid rgba(31,212,255,.7);border-radius:50%;bottom:33px;box-shadow:0 0 45px rgba(20,210,255,.32),inset 0 0 40px rgba(20,210,255,.17);transform:perspective(400px) rotateX(62deg)}
.data-ring{position:absolute;border:1px solid rgba(28,213,255,.28);border-radius:50%;bottom:30px;transform:perspective(380px) rotateX(62deg)}
.ring-one{width:110%;height:120px}.ring-two{width:70%;height:75px}
.brain-card{background:linear-gradient(180deg,rgba(7,22,30,.78),rgba(4,12,17,.65));border:1px solid var(--line);padding:28px;border-radius:18px;box-shadow:var(--shadow)}
.brain-card h2{font-size:40px}.brain-card p{color:#b9c7ce;line-height:1.55}
.check-list{padding:0;margin:22px 0 0;list-style:none}.check-list li{margin:13px 0;padding-left:32px;position:relative;color:#e2edf1}
.check-list li:before{content:"✓";position:absolute;left:0;width:22px;height:22px;border:1px solid var(--cyan);border-radius:50%;display:grid;place-items:center;color:var(--cyan);font-weight:900;font-size:12px}
.section-shell{max-width:1500px;margin:0 auto;padding:88px clamp(24px,4vw,70px)}
.section-heading{text-align:center;max-width:760px;margin:0 auto 34px}.section-heading h2,.about h2,.rebellion h2,.join h2,.contact h2{font-size:clamp(38px,4vw,58px)}
.section-heading p:last-child,.contact p,.about p,.rebellion p,.join p{color:var(--muted);line-height:1.65}
.card-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.vertical-card{
  background:linear-gradient(180deg,rgba(9,25,34,.97),rgba(5,14,20,.97));border:1px solid rgba(101,214,244,.28);border-radius:14px;
  padding:26px 22px;min-height:340px;text-align:center;display:flex;flex-direction:column;align-items:center;box-shadow:inset 0 0 20px rgba(21,206,255,.02);transition:.22s
}
.vertical-card:hover{transform:translateY(-6px);border-color:rgba(43,220,255,.7);box-shadow:0 12px 38px rgba(0,0,0,.35),0 0 24px rgba(25,217,255,.1)}
.icon-wrap{width:84px;height:84px;display:grid;place-items:center;margin:0 auto 14px}
.icon-wrap svg{width:72px;height:72px;fill:none;stroke:var(--cyan);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 7px rgba(25,217,255,.7))}
.vertical-card h3{color:var(--cyan);text-transform:uppercase;font-size:17px;letter-spacing:.05em}
.vertical-card p{color:#bcc8ce;line-height:1.55;font-size:14px;flex:1}
.vertical-card a{border:1px solid var(--cyan);border-radius:7px;padding:10px 18px;color:var(--cyan);font-weight:800;font-size:12px;text-transform:uppercase}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.stat-panel{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.stat-panel div{padding:28px;background:rgba(8,22,29,.8);border:1px solid var(--line);border-radius:12px}
.stat-panel strong{display:block;color:var(--cyan);font-family:Oswald;font-size:46px}.stat-panel span{color:#b5c3ca;font-size:13px;text-transform:uppercase;letter-spacing:.08em}
.rebellion{text-align:center}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:36px}
.steps div{padding:26px 18px;background:rgba(5,16,22,.8);border-top:1px solid rgba(25,217,255,.45)}
.steps span{color:var(--cyan);font-family:Oswald;font-size:36px}.steps h3{text-transform:uppercase}.steps p{font-size:14px}
.join{padding-top:40px}.join-inner{text-align:center;border:1px solid rgba(25,217,255,.6);border-radius:18px;padding:55px 24px;background:radial-gradient(circle at 50% 20%,rgba(20,195,240,.12),transparent 45%),rgba(4,14,19,.75);box-shadow:0 0 28px rgba(25,217,255,.1)}
.join h2{color:var(--cyan);text-shadow:0 0 18px rgba(25,217,255,.4)}.join small{display:block;color:#748891;margin-top:16px}.btn-large{padding:16px 30px;font-size:15px}
button.btn{cursor:pointer;background-color:transparent;font-family:inherit}
button.btn:disabled{opacity:.6;cursor:not-allowed;transform:none!important}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:14px;background:rgba(6,18,25,.82);border:1px solid var(--line);padding:24px;border-radius:14px}
.contact-form label{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:#9eb0ba}
.contact-form input,.contact-form select{width:100%;margin-top:7px;background:#030a0f;border:1px solid rgba(121,200,222,.25);color:#eef9fd;padding:13px;border-radius:7px;outline:none}
.contact-form input:focus,.contact-form select:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(25,217,255,.08)}
.contact-form .btn{grid-column:1/-1}.form-msg{grid-column:1/-1;margin:0;color:var(--cyan)!important;min-height:1.4em}
.name-row{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-msg.form-error{color:#ff6b6b!important}
.form-hint{grid-column:1/-1;color:#748891;font-size:12px;line-height:1.5;text-transform:none;letter-spacing:normal;margin:-4px 0 4px}
footer{border-top:1px solid rgba(25,217,255,.12);padding:38px clamp(24px,4vw,70px);display:flex;align-items:center;gap:28px;justify-content:space-between;color:#7f919a;font-size:12px}
footer img{width:150px}footer p{color:#c1d0d7;letter-spacing:.12em}
@media(max-width:1100px){
  .site-header{grid-template-columns:180px 1fr}.header-cta{display:none}.main-nav{justify-content:flex-end}
  .hero{grid-template-columns:1fr 1fr}.brain-card{grid-column:1/-1}.card-grid{grid-template-columns:repeat(3,1fr)}.steps{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
  .site-header{display:flex;justify-content:space-between;padding:12px 18px}.brand img{width:150px}
  .menu-toggle{display:block;background:none;border:1px solid rgba(25,217,255,.45);color:var(--cyan);border-radius:6px;font-size:22px;padding:6px 10px}
  .main-nav{display:none;position:absolute;left:0;right:0;top:70px;flex-direction:column;background:#02090d;padding:22px;border-bottom:1px solid rgba(25,217,255,.2)}
  .main-nav.open{display:flex}.hero{grid-template-columns:1fr;padding-top:44px}.hero-mascot{min-height:480px}.hero h1{font-size:58px}
  .brain-card{grid-column:auto}.card-grid,.steps,.two-col,.contact-form{grid-template-columns:1fr}.two-col{gap:20px}.card-grid{gap:12px}.vertical-card{min-height:300px}
  footer{flex-direction:column;text-align:center}.contact-form .btn,.form-msg{grid-column:auto}.name-row{grid-template-columns:1fr}
  .section-shell{padding-top:40px}
}