/* =====================================================================
   The ASIC Network: "signal" theme
   Same bones as the Stone Arch Silicon site (the founding chapter), its
   own look: blue-black night and cool whites, Archivo (semi-expanded for
   display) with IBM Plex Mono, rounded capsules and cards, blueprint
   grids, live numbers, and a globe film of the real network in the hero.
   Each section picks a theme (dark / light / paper) that sets the
   colour variables below; components only ever use the variables.
   ===================================================================== */
@font-face{font-family:"Archivo";src:url("Archivo-Variable.woff2") format("woff2-variations"),url("Archivo-Variable.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Mono";src:url("IBMPlexMono-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"IBM Plex Mono";src:url("IBMPlexMono-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}

:root{
  --accent:#2f6fd6;          /* the network's signal blue: fills and buttons (white text on it) */
  --accent-dk:#2864c6;       /* hover for filled buttons */
  --accent-hi:#7aa7ff;       /* text, lines and glows on night backgrounds */
  --night:#05070c; --night-2:#0a0f1a; --night-3:#111a2c;
  --ice:#f6f8fc; --frost:#eaf0f8; --white:#ffffff;
  --sans:"Archivo",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --wide:112%;               /* Archivo's width axis for display type */
  --maxw:1440px;
  --gut:clamp(16px,4vw,48px);
  --nav-h:62px;
  --r:20px; --r-lg:30px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --ease-io:cubic-bezier(.7,0,.2,1);
}
.theme-dark{--bg:var(--night);--fg:#e9eefb;--muted:rgba(222,231,252,.66);--faint:rgba(222,231,252,.45);--line:rgba(122,167,255,.13);--line-2:rgba(122,167,255,.27);--card:rgba(17,26,44,.55);--card-bd:rgba(122,167,255,.16);--hl:var(--accent-hi);background:var(--bg);color:var(--fg);}
.theme-light{--bg:var(--ice);--fg:#0a1220;--muted:#526079;--faint:#77839a;--line:rgba(10,18,32,.09);--line-2:rgba(10,18,32,.18);--card:#ffffff;--card-bd:rgba(10,18,32,.08);--hl:var(--accent);background:var(--bg);color:var(--fg);}
.theme-paper{--bg:var(--frost);--fg:#0a1220;--muted:#526079;--faint:#77839a;--line:rgba(10,18,32,.09);--line-2:rgba(10,18,32,.18);--card:#ffffff;--card-bd:rgba(10,18,32,.08);--hl:var(--accent);background:var(--bg);color:var(--fg);}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;background:var(--night);}
body{margin:0;background:var(--night);color:#e9eefb;font-family:var(--sans);font-size:17px;line-height:1.6;font-weight:400;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;}
img,video,canvas,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;}
h1,h2,h3,h4,p,dl,dt,dd,figure{margin:0;overflow-wrap:break-word;}
ul,ol{margin:0;padding:0;list-style:none;}
::selection{background:var(--accent);color:#fff;}
:focus-visible{outline:2px solid var(--hl,var(--accent));outline-offset:3px;}
.nowrap{white-space:nowrap;}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gut);}
.skip-link{position:fixed;top:10px;left:10px;z-index:200;padding:12px 18px;border-radius:999px;background:#fff;color:#000;font-weight:500;transform:translateY(-200%);}
.skip-link:focus{transform:none;}

/* ---------- type ---------- */
.tag{display:inline-flex;align-items:center;gap:10px;height:32px;padding:0 14px 0 5px;border:1px solid var(--line-2);border-radius:999px;font-family:var(--mono);font-size:11.5px;font-weight:500;line-height:1;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.tag .ix{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--accent);color:#fff;letter-spacing:.04em;}
.node{position:relative;width:8px;height:8px;flex:none;margin-left:7px;border-radius:50%;background:var(--accent-hi);box-shadow:0 0 12px rgba(122,167,255,.9);}
.node::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid rgba(122,167,255,.6);animation:ping 2.4s var(--ease) infinite;}
@keyframes ping{0%{transform:scale(.5);opacity:1;}80%,100%{transform:scale(1.6);opacity:0;}}
.h2{font-size:clamp(38px,4.9vw,76px);font-weight:500;font-stretch:var(--wide);line-height:1.02;letter-spacing:-.035em;}
.lead{font-size:clamp(17px,1.3vw,20px);line-height:1.55;color:var(--muted);max-width:52ch;}
.idx{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--faint);}
.link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-color:var(--line-2);transition:text-decoration-color .2s;}
.link:hover{text-decoration-color:var(--hl);}

/* ---------- buttons: pills with the arrow in its own disc ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;height:52px;padding:0 7px 0 24px;border:1px solid transparent;border-radius:999px;font-size:15.5px;font-weight:500;line-height:1;white-space:nowrap;transition:background-color .25s var(--ease),border-color .25s var(--ease),color .25s var(--ease),box-shadow .35s var(--ease);}
.btn-ic{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:50%;transition:transform .35s var(--ease);}
.btn-ic svg{width:14px;height:14px;}
.btn:hover .btn-ic{transform:translateX(3px);}
.btn.ne:hover .btn-ic{transform:translate(2px,-2px);}
.btn-primary{background:var(--accent);color:#fff;box-shadow:0 12px 30px -14px rgba(47,111,214,.9);}
.btn-primary .btn-ic{background:rgba(255,255,255,.16);}
.btn-primary:hover{background:var(--accent-dk);box-shadow:0 16px 40px -12px rgba(61,127,240,.95);}
.btn-ghost{border-color:var(--line-2);color:var(--fg);}
.btn-ghost .btn-ic{background:var(--line);}
.btn-ghost:hover{border-color:var(--fg);}

/* ---------- reveal on scroll (only when JS runs) ---------- */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease);}
.js .reveal.in{opacity:1;transform:none;}
.js .reveal[data-d="1"]{transition-delay:.08s;} .js .reveal[data-d="2"]{transition-delay:.16s;} .js .reveal[data-d="3"]{transition-delay:.24s;}

/* =====================================================================
   Header: a floating capsule that takes the colours of the section under it
   ===================================================================== */
.progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:80;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--accent),var(--accent-hi));pointer-events:none;}
.site-header{position:fixed;top:14px;left:0;right:0;z-index:60;padding:0 var(--gut);color:#fff;pointer-events:none;}
.nav{pointer-events:auto;max-width:var(--maxw);height:var(--nav-h);margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:0 9px 0 14px;border:1px solid rgba(122,167,255,.12);border-radius:999px;transition:background-color .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);}
.nav.on-dark{background:rgba(10,15,26,.7);-webkit-backdrop-filter:saturate(1.4) blur(16px);backdrop-filter:saturate(1.4) blur(16px);border-color:rgba(122,167,255,.16);box-shadow:0 18px 40px -24px rgba(0,0,0,.85);}
.nav.on-light{background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(1.4) blur(16px);backdrop-filter:saturate(1.4) blur(16px);color:#0a1220;border-color:rgba(10,18,32,.08);box-shadow:0 18px 40px -26px rgba(10,30,70,.35);}
.brand{display:flex;align-items:center;gap:10px;min-width:0;justify-self:start;}
.brand img{width:32px;height:32px;object-fit:contain;flex:none;}
.brand-name{font-size:16.5px;font-weight:600;font-stretch:var(--wide);letter-spacing:-.02em;white-space:nowrap;}
.nav-links{display:flex;align-items:center;gap:2px;}
.nav-link{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 13px;border-radius:999px;font-size:15px;opacity:.84;transition:opacity .2s,background-color .2s;}
.nav-link:hover{opacity:1;background:rgba(122,167,255,.12);}
.nav.on-light .nav-link:hover{background:rgba(10,18,32,.06);}
.nav-link svg{width:11px;height:11px;}
.nav-actions{display:flex;align-items:center;gap:8px;justify-self:end;}
.nav-cta{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:999px;background:var(--accent);color:#fff;font-size:15px;font-weight:500;white-space:nowrap;box-shadow:0 8px 24px -10px rgba(47,111,214,.9);transition:background-color .25s,box-shadow .25s;}
.nav-cta:hover{background:var(--accent-dk);box-shadow:0 10px 30px -8px rgba(61,127,240,.95);}
.nav-menu{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;transition:border-color .25s;}
.nav.on-light .nav-menu{border-color:rgba(10,18,32,.2);}
.nav-menu:hover{border-color:currentColor;}
.nav-menu span{display:block;width:16px;height:1.5px;box-shadow:0 -3.5px 0 currentColor,0 3.5px 0 currentColor;}

/* full-screen menu */
.menu{position:fixed;inset:0;z-index:90;display:flex;flex-direction:column;background:var(--night);color:#e9eefb;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility 0s linear .35s;}
.menu::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 60% at 85% 10%,rgba(47,111,214,.22),transparent 70%),linear-gradient(rgba(122,167,255,.07) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,rgba(122,167,255,.07) 1px,transparent 1px) 0 0/56px 56px;-webkit-mask-image:radial-gradient(90% 80% at 70% 20%,#000,transparent);mask-image:radial-gradient(90% 80% at 70% 20%,#000,transparent);}
.menu.is-open{opacity:1;visibility:visible;transition:opacity .35s var(--ease),visibility 0s;}
.menu-top{position:relative;flex:none;height:calc(var(--nav-h) + 28px);display:flex;align-items:center;justify-content:space-between;padding:0 calc(var(--gut) + 14px);}
.menu-close{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;}
.menu-close svg{width:14px;height:14px;}
.menu-body{position:relative;flex:1;overflow:auto;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:var(--gut);padding:clamp(16px,4vh,48px) calc(var(--gut) + 14px) 40px;}
.menu-main li{border-bottom:1px solid rgba(122,167,255,.14);}
.menu-main a{display:flex;align-items:baseline;gap:22px;padding:12px 0;font-size:clamp(30px,min(4.6vw,6.2vh),64px);font-weight:500;font-stretch:var(--wide);line-height:1.08;letter-spacing:-.035em;transition:color .2s,padding-left .35s var(--ease);}
.menu-main a:hover{color:var(--accent-hi);padding-left:10px;}
.menu-main .idx{min-width:3ch;font-size:12px;color:var(--accent-hi);}
.menu-side{display:flex;flex-direction:column;gap:36px;padding-top:12px;}
.menu-side h3{margin-bottom:12px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(222,231,252,.45);}
.menu-side a{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid rgba(122,167,255,.1);font-size:17px;color:rgba(233,238,251,.84);}
.menu-side a:hover{color:#fff;}
.menu-side p{max-width:36ch;font-size:15px;color:rgba(222,231,252,.6);}
.js .menu .menu-main li{opacity:0;transform:translateY(18px);transition:opacity .5s var(--ease),transform .6s var(--ease);}
.js .menu.is-open .menu-main li{opacity:1;transform:none;}
.menu.is-open .menu-main li:nth-child(2){transition-delay:.03s;} .menu.is-open .menu-main li:nth-child(3){transition-delay:.06s;} .menu.is-open .menu-main li:nth-child(4){transition-delay:.09s;} .menu.is-open .menu-main li:nth-child(5){transition-delay:.12s;}
body.menu-open{overflow:hidden;}

/* =====================================================================
   Hero: the globe film on the right, a blueprint grid behind the words,
   live numbers in a glass strip along the bottom
   ===================================================================== */
.hero{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;padding:calc(var(--nav-h) + 110px) 0 28px;}
.hero-media{position:absolute;inset:0;z-index:-1;background:var(--night) url("hero-poster.jpg") 50% 50%/cover no-repeat;}
.hero-video{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;opacity:0;transition:opacity 1.4s var(--ease);}
.hero-video.is-playing{opacity:1;}
.hero-shade{position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(5,7,12,.5) 0%,rgba(5,7,12,0) 20%,rgba(5,7,12,0) 62%,rgba(5,7,12,.72) 88%,var(--night) 100%),
  linear-gradient(90deg,rgba(5,7,12,.82) 0%,rgba(5,7,12,.5) 36%,rgba(5,7,12,0) 62%);}
.hero-grid{position:absolute;inset:0;opacity:.75;background:linear-gradient(rgba(122,167,255,.08) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,rgba(122,167,255,.08) 1px,transparent 1px) 0 0/64px 64px;-webkit-mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.55) 32%,transparent 56%);mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.55) 32%,transparent 56%);}
.hero-inner{position:relative;}
.hero-title{margin-top:26px;font-size:clamp(40px,7vw,120px);font-weight:500;font-stretch:var(--wide);line-height:1;letter-spacing:-.04em;text-shadow:0 2px 30px rgba(0,0,0,.45);}
.ht-line{display:block;white-space:nowrap;}
.decode{color:var(--accent-hi);}
.caret{display:inline-block;width:.07em;height:.74em;margin-left:.07em;vertical-align:-.04em;background:var(--accent-hi);box-shadow:0 0 18px rgba(122,167,255,.85);animation:caret 1.1s steps(1) infinite;}
@keyframes caret{50%{opacity:0;}}
.hero-lead{margin-top:28px;max-width:46ch;font-size:clamp(17px,1.35vw,20px);line-height:1.55;color:rgba(233,238,251,.8);}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px;}
.hero .btn-ghost{border-color:rgba(233,238,251,.32);color:#fff;background:rgba(5,7,12,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
.hero .btn-ghost:hover{border-color:#fff;}
.telemetry{position:relative;display:flex;margin-top:clamp(44px,8vh,88px);border:1px solid rgba(122,167,255,.2);border-radius:var(--r);background:rgba(10,15,26,.5);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);}
.tm-live{position:absolute;top:0;left:18px;transform:translateY(-50%);display:inline-flex;align-items:center;gap:9px;height:24px;padding:0 12px 0 4px;border:1px solid rgba(122,167,255,.24);border-radius:999px;background:var(--night);font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(222,231,252,.72);}
.tm-grid{flex:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));}
.tm{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:8px;padding:22px 22px 18px;}
.tm + .tm{border-left:1px solid rgba(122,167,255,.13);}
.tm dd{font-family:var(--mono);font-size:clamp(26px,2.5vw,38px);font-weight:500;line-height:1;letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums;}
.tm:first-child dd{color:var(--accent-hi);text-shadow:0 0 24px rgba(122,167,255,.55);}
.tm dt{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(222,231,252,.56);}
.motion-btn{display:inline-flex;align-items:center;gap:10px;flex:none;padding:0 22px;border-left:1px solid rgba(122,167,255,.13);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:rgba(222,231,252,.72);transition:color .2s;}
.motion-btn:hover{color:#fff;}
.motion-btn i{width:24px;height:24px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;}
.motion-btn svg{width:8px;height:8px;}
.motion-btn .ic-play{display:none;}
.motion-off .motion-btn .ic-play{display:block;} .motion-off .motion-btn .ic-pause{display:none;}

/* =====================================================================
   Sections
   ===================================================================== */
.sec{position:relative;padding:clamp(88px,12vh,150px) 0;}
.sec-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:28px var(--gut);align-items:end;}
.sec-head .tag{grid-column:1/-1;justify-self:start;}
.sec-head .lead{justify-self:end;}
.sec-grid{position:absolute;inset:0;pointer-events:none;opacity:.8;background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/64px 64px;-webkit-mask-image:radial-gradient(75% 55% at 50% 0%,#000,transparent 80%);mask-image:radial-gradient(75% 55% at 50% 0%,#000,transparent 80%);}
.sec > .wrap{position:relative;}

/* about: the statement lights up word by word as you scroll, the newest word in blue */
.statement-text{margin-top:36px;max-width:21ch;font-size:clamp(34px,4.8vw,78px);font-weight:500;font-stretch:var(--wide);line-height:1.06;letter-spacing:-.035em;}
.statement-text .w{color:rgba(10,18,32,.15);transition:color .35s linear;}
.statement-text .w.on{color:var(--fg);}
.statement-text .w.head{color:var(--accent);}
.no-js .statement-text .w,.motion-off .statement-text .w{color:var(--fg);}
.statement-text .accent,.statement-text .accent .w{color:var(--accent)!important;}
.cards4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:clamp(64px,10vh,120px);}
.card{display:flex;flex-direction:column;min-width:0;min-height:270px;padding:22px 22px 26px;background:var(--card);border:1px solid var(--card-bd);border-radius:var(--r);box-shadow:0 1px 0 rgba(10,18,32,.03),0 24px 50px -40px rgba(10,30,70,.5);}
.js .card.reveal{transition:opacity .9s var(--ease),transform .9s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);}
.card:hover{border-color:rgba(47,111,214,.45);box-shadow:0 1px 0 rgba(10,18,32,.03),0 30px 60px -36px rgba(47,111,214,.55);}
.card-top{display:flex;align-items:center;justify-content:space-between;}
.ic{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(47,111,214,.09);color:var(--accent);transition:background-color .35s var(--ease),color .35s var(--ease);}
.ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.card:hover .ic{background:var(--accent);color:#fff;}
.card h3{margin-top:56px;font-size:clamp(21px,1.6vw,25px);font-weight:500;font-stretch:var(--wide);line-height:1.15;letter-spacing:-.02em;}
.card p{margin-top:10px;font-size:15.5px;color:var(--muted);}
.about-foot{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px var(--gut);align-items:start;margin-top:clamp(48px,8vh,88px);padding-top:28px;border-top:1px solid var(--line);}
.about-foot .lead{max-width:44ch;color:var(--fg);}
.about-foot .founder{justify-self:end;max-width:46ch;font-size:15.5px;color:var(--muted);}

/* network map, on night blue. Its data and behaviour live in index.html. */
.net-card{margin-top:clamp(48px,8vh,88px);overflow:hidden;border:1px solid var(--line-2);border-radius:var(--r-lg);background:var(--night-2);box-shadow:0 40px 90px -50px rgba(47,111,214,.45);}
.net-bar{display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid var(--line);}
.live-dot{width:8px;height:8px;flex:none;border-radius:50%;background:var(--accent-hi);animation:livepulse 2.4s ease-out infinite;}
@keyframes livepulse{0%{box-shadow:0 0 0 0 rgba(122,167,255,.5);}70%,100%{box-shadow:0 0 0 9px rgba(122,167,255,0);}}
.net-stats{font-size:15px;line-height:1.4;color:var(--muted);}
.net-stats b{color:var(--fg);font-weight:600;}
#netmesh{position:relative;height:clamp(420px,64vh,660px);overflow:hidden;background:#070b14;cursor:grab;user-select:none;-webkit-user-select:none;}
#netmesh.panning{cursor:grabbing;}
#netmesh svg{position:absolute;inset:0;width:100%;height:100%;max-width:none;display:block;touch-action:none;}
#netmesh .ocean{fill:#070b14;}
#netmesh .land{fill:#131b2d;stroke:#1d2842;stroke-width:.35;}
#netmesh .graticule{fill:none;stroke:rgba(122,167,255,.08);stroke-width:.3;}
#netmesh .conn-line{stroke:var(--accent-hi);opacity:.5;}
#netmesh .prog-line{stroke:rgba(222,231,252,.45);opacity:.55;stroke-dasharray:4 5;}
#netmesh .uni-node{cursor:pointer;}
#netmesh .uni-node .ring{fill:var(--night);stroke:rgba(233,238,251,.8);stroke-width:1.6;transition:r .12s ease;}
#netmesh .uni-node.conn .ring{fill:var(--accent-hi);stroke:var(--night);stroke-width:1.4;filter:drop-shadow(0 0 5px rgba(122,167,255,.85));}
#netmesh .uni-node:hover .ring,#netmesh .uni-node.active .ring{stroke-width:2.4;}
#netmesh .uni-node.conn:hover .ring,#netmesh .uni-node.conn.active .ring{stroke:#fff;}
#netmesh .uni-node .lbl{font-family:var(--mono);letter-spacing:.04em;fill:rgba(222,231,252,.62);text-anchor:middle;pointer-events:none;dominant-baseline:hanging;opacity:0;transition:opacity .25s ease;}
#netmesh .uni-node.show-lbl .lbl{opacity:1;}
#netmesh .uni-node:hover .lbl,#netmesh .uni-node.active .lbl{fill:#fff;font-weight:500;opacity:1;}
#netmesh .uni-cluster{cursor:pointer;}
#netmesh .uni-cluster .cring{fill:var(--accent);stroke:var(--night);stroke-width:2;filter:drop-shadow(0 0 7px rgba(47,111,214,.8));transition:r .12s ease,stroke .12s ease;}
#netmesh .uni-cluster:hover .cring{stroke:#fff;}
#netmesh .uni-cluster .ctxt{fill:#fff;font-family:var(--mono);font-weight:500;text-anchor:middle;dominant-baseline:central;pointer-events:none;}
.net-tooltip{position:absolute;z-index:10;display:none;max-width:250px;padding:12px 14px;border:1px solid rgba(122,167,255,.2);border-radius:14px;background:rgba(12,18,32,.94);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 18px 40px -20px rgba(0,0,0,.85);color:#e9eefb;pointer-events:none;}
.net-tooltip.show{display:block;}
.net-tooltip.interactive{pointer-events:auto;max-width:270px;}
.net-tooltip .nm{margin-bottom:8px;font-size:15px;font-weight:600;line-height:1.3;}
.net-tooltip .status{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(222,231,252,.75);}
.net-tooltip .status::before{content:"";width:7px;height:7px;flex:none;border-radius:50%;}
.net-tooltip .status.conn::before{background:var(--accent-hi);box-shadow:0 0 8px rgba(122,167,255,.9);}
.net-tooltip .status.prog::before{box-shadow:inset 0 0 0 1.5px rgba(233,238,251,.8);}
.net-tooltip .prow{margin-top:8px;font-size:13px;line-height:1.5;color:rgba(222,231,252,.66);}
.net-tooltip .prow b{color:#e9eefb;font-weight:600;}
.net-tooltip .clist{display:flex;flex-direction:column;max-height:220px;overflow-y:auto;border-top:1px solid rgba(122,167,255,.12);}
.net-tooltip .citem{display:flex;align-items:center;gap:10px;width:100%;padding:9px 2px;text-align:left;font-size:14px;color:rgba(233,238,251,.86);border-bottom:1px solid rgba(122,167,255,.08);transition:color .15s,padding-left .2s var(--ease);}
.net-tooltip .citem:hover{color:#fff;padding-left:6px;}
.net-tooltip .citem .dot{width:8px;height:8px;flex:none;border-radius:50%;}
.net-tooltip .citem .dot.conn{background:var(--accent-hi);}
.net-tooltip .citem .dot.prog{box-shadow:inset 0 0 0 1.5px rgba(233,238,251,.8);}
.net-tooltip .cback{display:inline-flex;align-items:center;gap:6px;padding:0 0 10px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-hi);}
.net-tooltip .cback:hover{color:#fff;}
.net-fallback{display:flex;align-items:center;justify-content:center;height:100%;padding:28px;text-align:center;font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:rgba(222,231,252,.55);}
.map-controls{position:absolute;top:14px;right:14px;z-index:6;display:flex;flex-direction:column;gap:6px;}
.map-btn{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(122,167,255,.24);border-radius:50%;background:rgba(10,15,26,.85);color:#e9eefb;font-family:var(--mono);font-size:17px;line-height:1;transition:border-color .2s,background-color .2s;}
.map-btn:hover{border-color:var(--accent-hi);background:rgba(47,111,214,.25);}
.map-reset{margin-top:4px;font-size:15px;}
.net-legend{display:flex;flex-wrap:wrap;gap:10px 26px;padding:15px 20px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);}
.net-legend span{display:inline-flex;align-items:center;gap:9px;}
.net-legend i{flex:none;width:10px;height:10px;border-radius:50%;}
.net-legend i.conn{background:var(--accent-hi);box-shadow:0 0 6px rgba(122,167,255,.8);}
.net-legend i.prog{box-shadow:inset 0 0 0 1.6px rgba(233,238,251,.8);}
.net-legend i.clus{width:14px;height:14px;background:var(--accent);}
.net-legend i.link{width:22px;height:1px;border-radius:0;background:var(--accent-hi);}

/* tutorials: one card per track with its schematic drawn in the corner */
.tracks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto clamp(150px,16vw,236px) auto auto auto;gap:0 16px;margin-top:clamp(56px,9vh,104px);}
.track{position:relative;display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0;min-width:0;padding:26px 28px 30px;overflow:hidden;background:var(--card);border:1px solid var(--card-bd);border-radius:var(--r-lg);box-shadow:0 30px 60px -48px rgba(10,30,70,.5);}
.js .track.reveal{transition:opacity .9s var(--ease),transform .9s var(--ease),background-color .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease),box-shadow .45s var(--ease);}
.track-art{position:absolute;top:26px;right:22px;width:min(52%,320px);height:auto;color:rgba(47,111,214,.5);transition:color .45s var(--ease),filter .45s var(--ease);}
.track-art path,.track-art line,.track-art circle,.track-art rect,.track-art polyline{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.track-art .fill{fill:currentColor;stroke:none;}
.track-art text{fill:currentColor;stroke:none;font-family:var(--mono);font-size:12px;}
.track .idx{position:relative;grid-row:1;}
.track h3{position:relative;grid-row:3;font-size:clamp(48px,5.4vw,90px);font-weight:500;font-stretch:var(--wide);line-height:1;letter-spacing:-.045em;}
.track p{position:relative;grid-row:4;margin-top:16px;max-width:44ch;color:var(--muted);}
.track .go{position:relative;grid-row:5;justify-self:start;display:inline-flex;align-items:center;gap:10px;margin-top:22px;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);transition:color .45s var(--ease);}
.track:hover{background:var(--night-2);color:#e9eefb;border-color:rgba(122,167,255,.3);--muted:rgba(222,231,252,.66);--faint:rgba(222,231,252,.45);box-shadow:0 40px 80px -40px rgba(47,111,214,.6);}
.track:hover .track-art{color:var(--accent-hi);filter:drop-shadow(0 0 7px rgba(122,167,255,.65));}
.track:hover .go{color:var(--accent-hi);}

/* sponsors: three partner cards; five shared rows (label, title, text, enable, earn) line up across them */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:clamp(56px,9vh,104px);}
.tier{display:grid;grid-row:span 5;grid-template-rows:subgrid;row-gap:0;align-content:start;min-width:0;padding:24px 26px 10px;background:var(--card);border:1px solid var(--card-bd);border-radius:var(--r);box-shadow:0 1px 0 rgba(10,18,32,.03),0 24px 50px -40px rgba(10,30,70,.5);}
.tier .idx{display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;}
.tier .idx b{font-weight:500;color:var(--accent);}
.tier h3{margin:44px 0 12px;font-size:clamp(25px,2.2vw,34px);font-weight:500;font-stretch:var(--wide);line-height:1.08;letter-spacing:-.03em;}
.tier > p{font-size:15.5px;color:var(--muted);}
.give-get{display:grid;grid-row:span 2;grid-template-rows:subgrid;row-gap:0;}
.give-get div{padding:14px 0 16px;border-top:1px solid var(--line);}
.give-get div:first-child{margin-top:26px;}
.give-get dt{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);}
.give-get dd{margin-top:6px;font-size:15px;line-height:1.45;}
.pitch{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:28px 56px;margin-top:16px;padding:clamp(28px,4vw,52px);border:1px solid var(--line-2);border-radius:var(--r-lg);}
.pitch::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(55% 140% at 100% 0%,rgba(47,111,214,.42),transparent 62%),linear-gradient(var(--line) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/48px 48px;-webkit-mask-image:linear-gradient(90deg,rgba(0,0,0,.25),#000 75%);mask-image:linear-gradient(90deg,rgba(0,0,0,.25),#000 75%);}
.pitch > *{position:relative;}
.pitch h3{font-size:clamp(28px,3vw,46px);font-weight:500;font-stretch:var(--wide);line-height:1.05;letter-spacing:-.035em;}
.pitch p{margin-top:14px;max-width:62ch;color:var(--muted);}
.pitch .btn{flex:none;}

/* register: the Google Form beside the steps, drawn as a signal path */
.reg-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(28px,4vw,72px);align-items:start;margin-top:clamp(48px,8vh,88px);}
.form-card{overflow:hidden;background:#fff;border:1px solid var(--card-bd);border-radius:var(--r-lg);box-shadow:0 30px 70px -50px rgba(10,30,70,.55);}
.form-bar{display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.form-bar .live-dot{background:var(--accent);}
.form-card iframe{display:block;width:100%;height:1180px;border:0;background:#fff;}
.reg-side{position:sticky;top:calc(var(--nav-h) + 48px);}
.side-h{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.steps{margin-top:24px;}
.steps li{position:relative;display:grid;grid-template-columns:36px 1fr;gap:16px;padding-bottom:26px;font-size:16px;}
.steps li:last-child{padding-bottom:0;}
.steps li::after{content:"";position:absolute;left:17px;top:38px;bottom:2px;width:2px;border-radius:2px;background:linear-gradient(var(--accent),rgba(47,111,214,.12));}
.steps li:last-child::after{display:none;}
.step-n{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(47,111,214,.35);border-radius:50%;background:#fff;box-shadow:0 0 0 5px rgba(47,111,214,.07);font-family:var(--mono);font-size:12px;font-weight:500;color:var(--accent);}
.steps p{padding-top:6px;}
.steps b{font-weight:600;}
.reg-side .btn{margin-top:32px;}
.fine{margin-top:16px;max-width:44ch;font-size:14px;color:var(--faint);}

/* closing panel */
.launch{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.25fr) auto;align-items:end;gap:32px 56px;margin-top:clamp(64px,10vh,120px);padding:clamp(32px,5vw,72px);border:1px solid var(--line-2);border-radius:var(--r-lg);}
.launch::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(50% 90% at 88% 100%,rgba(47,111,214,.5),transparent 70%),linear-gradient(var(--line) 1px,transparent 1px) 0 0/56px 56px,linear-gradient(90deg,var(--line) 1px,transparent 1px) 0 0/56px 56px;}
.launch > *{position:relative;}
.launch h2{font-size:clamp(40px,6vw,96px);font-weight:500;font-stretch:var(--wide);line-height:.98;letter-spacing:-.045em;}
.launch h2 em{font-style:normal;color:var(--accent-hi);}
.launch p{margin-top:18px;max-width:48ch;color:var(--muted);}
.launch-cta{display:flex;flex-wrap:wrap;gap:10px;}

/* footer */
.footer{position:relative;overflow:hidden;padding:clamp(72px,11vh,120px) 0 26px;}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px var(--gut);}
.footer .brand img{width:40px;height:40px;}
.footer .blurb{margin-top:20px;max-width:32ch;font-size:15px;color:var(--muted);}
.f-h{margin-bottom:16px;font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);}
.f-links a{display:block;padding:5px 0;font-size:15.5px;color:var(--muted);transition:color .2s;}
.f-links a:hover{color:var(--fg);}
.pills{display:flex;flex-wrap:wrap;gap:8px;}
.pill{display:inline-flex;align-items:center;height:38px;padding:0 16px;border:1px solid var(--line-2);border-radius:999px;font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.11em;text-transform:uppercase;transition:border-color .2s,background-color .2s,color .2s;}
.pill:hover{background:var(--accent);border-color:var(--accent);color:#fff;}
.wordmark{margin-top:clamp(56px,10vh,110px);font-size:10vw;font-weight:700;font-stretch:125%;line-height:.86;letter-spacing:-.02em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(122,167,255,.42);background:linear-gradient(180deg,rgba(122,167,255,.24),rgba(122,167,255,0) 88%);-webkit-background-clip:text;background-clip:text;user-select:none;}
.wordmark span{display:inline-block;}
.footer-bottom{display:flex;justify-content:space-between;gap:12px 28px;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--faint);}
.footer-bottom a{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--line-2);}
.footer-bottom a:hover{color:var(--fg);}

/* =====================================================================
   Motion off: honour the toggle and the OS setting
   ===================================================================== */
.motion-off .hero-video{display:none;}
.motion-off .caret,.motion-off .node::after,.motion-off .live-dot{animation:none;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .js .reveal{transform:none;transition:opacity .4s linear;}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;}
}

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-aspect-ratio:3/4){
  .hero-media{background-image:url("hero-poster-mobile.jpg");}
}
@media (max-width:1180px){
  .cards4{grid-template-columns:repeat(2,minmax(0,1fr));}
  .footer-grid{grid-template-columns:1fr 1fr 1fr;}
  .footer-grid > div:first-child{grid-column:1/-1;}
}
/* the capsule drops its section links before it runs out of room (the menu has them all) */
@media (max-width:1100px){
  .nav{grid-template-columns:1fr auto;}
  .nav-links{display:none;}
}
@media (max-width:1023px){
  .tiers{grid-template-columns:1fr;}
  .tier{display:block;}
  .tier h3{margin-top:28px;}
  .give-get{grid-template-columns:1fr 1fr;grid-template-rows:none;gap:0 var(--gut);margin-top:24px;}
  .give-get div:first-child{margin-top:0;}
}
@media (max-width:900px){
  :root{--nav-h:58px;}
  .tm-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .tm:nth-child(3){border-left:0;}
  .tm:nth-child(n+3){border-top:1px solid rgba(122,167,255,.13);}
  .sec-head,.about-foot{grid-template-columns:1fr;}
  .sec-head .lead,.about-foot .founder{justify-self:start;}
  .tracks{grid-template-columns:1fr;grid-template-rows:none;gap:16px;}
  .track{display:flex;flex-direction:column;min-height:400px;}
  .track h3{margin-top:auto;}
  .pitch{flex-direction:column;align-items:flex-start;}
  .reg-grid,.launch{grid-template-columns:1fr;}
  .reg-side{position:static;}
  .form-card iframe{height:1320px;}
  .menu-body{grid-template-columns:1fr;}
}
@media (max-width:640px){
  body{font-size:16px;}
  .site-header{top:10px;}
  .hero{padding-top:calc(var(--nav-h) + 92px);padding-bottom:18px;}
  .hero-title{font-size:clamp(30px,9.1vw,60px);}
  .hero-lead{margin-top:22px;}
  .hero-cta{margin-top:26px;}
  .hero-cta .btn{height:48px;font-size:15px;}
  .telemetry{flex-direction:column;margin-top:44px;}
  .tm{padding:18px 16px 14px;}
  .tm dd{font-size:28px;}
  .tm dt{font-size:10px;}
  .motion-btn{justify-content:flex-start;padding:12px 16px;border-left:0;border-top:1px solid rgba(122,167,255,.13);}
  .cards4{grid-template-columns:1fr;}
  .card{min-height:0;}
  .card h3{margin-top:28px;}
  .track{min-height:380px;padding:22px 20px 24px;}
  .track-art{width:62%;top:22px;right:14px;}
  .give-get{grid-template-columns:1fr;}
  #netmesh{height:330px;}   /* the world is width-bound on a phone, so a taller box is just empty ocean */
  .net-bar{padding:12px 14px;}
  .net-stats{font-size:14px;}
  .net-legend{gap:8px 18px;padding:12px 14px;font-size:10px;}
  .cta-long{display:none;}
  .footer-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:380px){
  .nav-cta{padding:0 14px;font-size:14px;}
  .brand-name{font-size:15px;}
}
@media (hover:none){
  .map-controls{top:auto;bottom:14px;}
}
