:root { --ink:#f7f4ff; --muted:#9b98ac; --violet:#9b66ff; --cyan:#51d9ff; --bg:#05030b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--bg); }
body { margin:0; background:var(--bg); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }

.hero { --mx:0px; --my:0px; position:relative; min-height:100svh; height:980px; max-height:1100px; overflow:hidden; isolation:isolate; background:radial-gradient(circle at 76% 44%,rgba(113,41,255,.14),transparent 35%),radial-gradient(circle at 39% 88%,rgba(45,189,255,.06),transparent 30%),linear-gradient(135deg,#07040e 0%,#030208 58%,#070313 100%); }
.hero::before { content:""; position:absolute; inset:0; z-index:0; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:86px 86px; mask-image:linear-gradient(to bottom,black,transparent 88%); }
.particle-canvas { position:absolute; inset:0; z-index:1; pointer-events:none; filter:saturate(1.16) contrast(1.05); }
.particle-canvas.webgl-fallback { left:38%; top:18%; width:56%; height:62%; border-radius:50%; background:radial-gradient(circle at 38% 34%,rgba(94,237,255,.95) 0 1%,rgba(157,96,255,.72) 13%,rgba(66,25,142,.38) 44%,transparent 70%); filter:blur(1px) drop-shadow(0 0 80px rgba(126,67,255,.34)); }
.noise { position:absolute; inset:0; z-index:5; opacity:.13; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }

.nav { position:absolute; top:0; left:0; right:0; z-index:10; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:30px 4vw; border-bottom:1px solid rgba(255,255,255,.08); }
.brand { display:inline-flex; width:fit-content; align-items:center; gap:11px; font-size:13px; font-weight:700; letter-spacing:.24em; }
.brand-mark { position:relative; display:inline-block; width:24px; height:24px; transform:rotate(30deg); }
.brand-mark i { position:absolute; inset:4px; border:1px solid rgba(255,255,255,.78); border-radius:50%; }
.brand-mark i:nth-child(2) { transform:translateX(5px); border-color:var(--violet); }
.brand-mark i:nth-child(3) { transform:translateY(5px); border-color:var(--cyan); }
.nav-links { display:flex; gap:36px; color:#a9a5b5; font-size:12px; text-transform:uppercase; letter-spacing:.16em; }
.nav-links a,.text-button { transition:color .25s ease; }
.nav-links a:hover,.text-button:hover { color:white; }
.nav-cta { justify-self:end; display:inline-flex; align-items:center; gap:10px; padding:12px 17px; border:1px solid rgba(255,255,255,.18); border-radius:999px; font-size:12px; text-transform:uppercase; letter-spacing:.13em; background:rgba(255,255,255,.04); backdrop-filter:blur(16px); transition:.25s ease; }
.nav-cta:hover { border-color:rgba(255,255,255,.55); background:rgba(255,255,255,.09); }

.hero-content { position:relative; z-index:4; width:min(780px,62vw); padding:240px 0 0 7.5vw; pointer-events:none; }
.eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 28px; color:#a7a3b5; font-size:11px; font-weight:700; letter-spacing:.24em; text-transform:uppercase; opacity:0; animation:rise .8s .1s forwards; }
.eyebrow span { width:28px; height:1px; background:linear-gradient(90deg,var(--violet),var(--cyan)); box-shadow:0 0 12px var(--violet); }
h1 { margin:0; font-size:clamp(68px,8.8vw,148px); font-weight:600; line-height:.79; letter-spacing:-.075em; text-transform:uppercase; }
h1 .line { display:block; white-space:nowrap; opacity:0; transform:translateY(50px); animation:rise 1.05s cubic-bezier(.16,1,.3,1) forwards; }
h1 .line-one { animation-delay:.2s; }
h1 .line-two { position:relative; margin-left:9vw; animation-delay:.34s; color:transparent; -webkit-text-stroke:1px rgba(247,244,255,.78); text-shadow:0 0 80px rgba(155,102,255,.12); }
.accent-dot { color:var(--violet); -webkit-text-stroke:0; text-shadow:0 0 24px var(--violet); }
.lede { width:min(470px,80%); margin:38px 0 0; color:#aaa6b5; font-size:17px; line-height:1.7; letter-spacing:-.01em; opacity:0; animation:rise .9s .52s forwards; }
.hero-actions { display:flex; align-items:center; gap:34px; margin-top:32px; pointer-events:auto; opacity:0; animation:rise .9s .64s forwards; }
.primary-button { display:inline-flex; align-items:center; gap:20px; min-height:54px; padding:0 24px; border-radius:999px; background:linear-gradient(120deg,#7d42ff,#ae78ff); box-shadow:0 12px 45px rgba(126,66,255,.28); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; transition:transform .25s ease,box-shadow .25s ease; }
.primary-button:hover { transform:translateY(-3px); box-shadow:0 18px 55px rgba(126,66,255,.42); }
.primary-button svg,.protocol-copy a svg { width:17px; fill:none; stroke:currentColor; stroke-width:1.4; }
.text-button { color:#b6b2c2; font-size:12px; letter-spacing:.11em; text-transform:uppercase; }
.text-button span { margin-left:8px; color:var(--cyan); }

.orbital { position:absolute; z-index:2; left:66%; top:50%; border:1px solid rgba(150,115,255,.18); border-radius:50%; pointer-events:none; transform:translate(calc(-50% + var(--mx)),calc(-50% + var(--my))) rotate(-17deg); }
.orbital-one { width:min(48vw,730px); aspect-ratio:1.8; box-shadow:inset 0 0 50px rgba(112,70,255,.04); animation:breathe 5s ease-in-out infinite; }
.orbital-two { width:min(39vw,600px); aspect-ratio:1.25; border-color:rgba(74,215,255,.12); transform:translate(calc(-50% - var(--mx)),calc(-50% - var(--my))) rotate(58deg); }
.core-label { position:absolute; z-index:4; left:calc(66% + 170px); top:calc(50% - 130px); display:flex; flex-direction:column; gap:4px; transform:translate(var(--mx),var(--my)); color:#8f8a9f; font-size:8px; letter-spacing:.24em; }
.core-label::before { content:""; position:absolute; right:calc(100% + 10px); top:8px; width:50px; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.35)); }
.core-label strong { color:var(--cyan); font-size:10px; font-weight:500; }

.hero-meta { position:absolute; z-index:4; left:7.5vw; right:7.5vw; bottom:52px; display:flex; gap:70px; }
.hero-meta div { display:flex; flex-direction:column; gap:7px; }
.hero-meta small { color:#696575; font-size:9px; letter-spacing:.18em; text-transform:uppercase; }
.hero-meta strong { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:500; letter-spacing:.08em; }
.hero-meta strong i { width:6px; height:6px; border-radius:50%; background:#6effba; box-shadow:0 0 10px #6effba; }
.scroll-cue { position:absolute; right:4vw; bottom:45px; z-index:6; display:flex; align-items:center; gap:14px; color:#777383; font-size:9px; letter-spacing:.18em; text-transform:uppercase; transform:rotate(90deg) translateX(-100%); transform-origin:right bottom; }
.scroll-cue i { display:block; width:64px; height:1px; background:rgba(255,255,255,.25); overflow:hidden; }
.scroll-cue i::after { content:""; display:block; width:50%; height:100%; background:white; animation:scan 2.2s ease-in-out infinite; }

.protocol { position:relative; min-height:100vh; padding:120px 7.5vw 130px; background:#eeecf5; color:#100d17; overflow:hidden; }
.protocol::after { content:"AETHER"; position:absolute; right:-2vw; top:12px; color:rgba(36,25,55,.035); font-size:18vw; font-weight:800; letter-spacing:-.08em; pointer-events:none; }
.section-kicker { position:relative; z-index:1; display:flex; align-items:center; gap:22px; color:#5d5865; font-size:10px; font-weight:700; letter-spacing:.22em; }
.section-kicker span { display:grid; place-items:center; width:34px; height:34px; border:1px solid rgba(16,13,23,.2); border-radius:50%; }
.protocol-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.65fr); gap:8vw; align-items:end; margin-top:70px; }
.protocol h2 { max-width:850px; margin:0; font-size:clamp(54px,6.8vw,105px); line-height:.94; letter-spacing:-.065em; font-weight:500; }
.protocol-copy p { margin:0 0 30px; color:#625d69; font-size:16px; line-height:1.7; }
.protocol-copy a { display:inline-flex; align-items:center; gap:17px; padding-bottom:9px; border-bottom:1px solid #211b2d; font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
.feature-row { position:relative; z-index:1; display:grid; grid-template-columns:repeat(3,1fr); gap:1px; margin-top:110px; border-top:1px solid rgba(16,13,23,.15); }
.feature-row article { padding:32px 4vw 0 0; border-right:1px solid rgba(16,13,23,.15); }
.feature-row article+article { padding-left:4vw; }
.feature-row article:last-child { border-right:0; }
.feature-row span { color:#8b48ff; font-size:10px; letter-spacing:.15em; }
.feature-row h3 { margin:30px 0 16px; font-size:25px; font-weight:500; letter-spacing:-.03em; }
.feature-row p { max-width:300px; margin:0; color:#6d6872; font-size:14px; line-height:1.65; }

.launch { min-height:72vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:100px 5vw; text-align:center; background:radial-gradient(circle at 50% 60%,rgba(129,55,255,.27),transparent 35%),#05030b; }
.launch p { color:var(--cyan); font-size:10px; letter-spacing:.28em; }
.launch h2 { margin:20px 0 42px; font-size:clamp(56px,8vw,126px); line-height:.9; letter-spacing:-.065em; font-weight:500; }
.primary-button.light { background:#f6f3ff; color:#100d17; box-shadow:0 18px 65px rgba(172,115,255,.2); }

@keyframes rise { to { opacity:1; transform:translateY(0); } }
@keyframes breathe { 50% { opacity:.45; filter:blur(.3px); } }
@keyframes scan { 0% { transform:translateX(-120%); } 65%,100% { transform:translateX(240%); } }

@media (max-width:900px) {
  .hero { height:900px; }
  .nav { grid-template-columns:1fr auto; padding:24px 22px; }
  .nav-links { display:none; }
  .hero-content { width:100%; padding:190px 22px 0; }
  h1 { font-size:clamp(57px,16vw,95px); line-height:.83; }
  h1 .line-two { margin-left:0; }
  .lede { width:min(390px,88%); margin-top:32px; font-size:15px; }
  .orbital,.particle-canvas { opacity:.7; }
  .orbital { left:52%; top:61%; }
  .core-label { display:none; }
  .hero-meta { left:22px; right:22px; bottom:30px; gap:26px; justify-content:space-between; }
  .hero-meta div:nth-child(2) { display:none; }
  .scroll-cue { display:none; }
  .protocol { padding:90px 22px; }
  .protocol-grid { grid-template-columns:1fr; gap:40px; margin-top:52px; }
  .protocol h2 { font-size:clamp(50px,13vw,76px); }
  .protocol-copy { max-width:480px; }
  .feature-row { grid-template-columns:1fr; margin-top:75px; border-top:0; }
  .feature-row article,.feature-row article+article { padding:28px 0 32px; border-top:1px solid rgba(16,13,23,.15); border-right:0; }
}

@media (max-width:540px) {
  .nav-cta { padding:11px 14px; font-size:10px; }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:20px; }
  .primary-button { min-height:50px; }
  .hero-meta strong { font-size:10px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}