/* VijAI homepage stylesheet · loads AFTER vijai-chrome.css.
   Built 9 Sep 2026 from _build/page.css. Rebuild with _build/assemble.py. */

/* ================= VijAI homepage v5 · page CSS ================= */
.mo{font-family:"IBM Plex Mono",ui-monospace,monospace;font-variant-numeric:tabular-nums}
.w{max-width:1280px;margin:0 auto;padding:0 28px}
img{max-width:100%;height:auto;display:block}
::selection{background:rgba(0,185,242,.28)}

/* grain overlay used on dark grounds */
.grain::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}

.prog{position:fixed;top:0;left:0;height:2px;width:0;z-index:70;
  background:linear-gradient(90deg,#0074A6,#00B9F2,#B7ECFB);box-shadow:0 0 14px rgba(0,185,242,.75)}

/* ---------------- HERO · isometric plant ---------------- */
.hero{position:relative;min-height:100svh;background:radial-gradient(120% 90% at 62% 42%,#0A1A28 0%,#050B12 62%);
  overflow:hidden;display:flex;align-items:center}
#feed{position:absolute;inset:0;width:100%;height:100%}
.scrim{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(97deg,rgba(5,11,18,.97) 0%,rgba(5,11,18,.88) 26%,rgba(5,11,18,.18) 56%,rgba(5,11,18,.55) 100%)}
.scan{position:absolute;inset:0;pointer-events:none;opacity:.4;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,185,242,.04) 3px 4px)}
.vig{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 240px 90px rgba(5,11,18,.9)}

.hgrid{position:relative;z-index:4;width:100%;max-width:1280px;margin:0 auto;padding:120px 28px 128px;
  display:grid;grid-template-columns:minmax(0,486px) 1fr;gap:40px;align-items:center}
@media(max-width:1120px){.hgrid{grid-template-columns:1fr;padding:112px 24px 190px}}
.hcopy{display:flex;flex-direction:column}

.tel{order:4;display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-family:"IBM Plex Mono",monospace;
  font-size:10.5px;letter-spacing:.17em;text-transform:uppercase;color:var(--cy);margin:0 0 20px}
.tel .lv{display:inline-flex;align-items:center;gap:7px;color:var(--red)}
.tel .lv i{width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red);animation:bl 1.5s infinite}
@keyframes bl{0%,100%{opacity:1}50%{opacity:.18}}
.tel span{color:var(--dtx3)}
.eyeb{order:2;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.08em;color:var(--cy);
  margin:0 0 20px;font-weight:500;display:flex;align-items:center;gap:11px;white-space:nowrap}
@media(max-width:560px){.eyeb{white-space:normal;align-items:flex-start}.eyeb::before{margin-top:8px}}
.eyeb::before{content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--cy));flex:none}
.hcopy h1{order:3;font-size:clamp(34px,4.6vw,62px);line-height:.96;letter-spacing:-.042em;margin:0 0 22px;
  color:#fff;font-weight:700;max-width:15ch}
.hcopy h1 em.wd{display:block}
.hcopy h1 em{font-style:normal;display:block;
  background:linear-gradient(96deg,#00B9F2 0%,#B7ECFB 48%,#0074A6 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.wd{display:inline-block;will-change:transform,opacity}
.js .wd{opacity:0;transform:translateY(.42em) rotate(1.5deg)}
.js .wd.in{opacity:1;transform:none;transition:opacity .6s cubic-bezier(.2,.8,.3,1),transform .7s cubic-bezier(.2,.8,.3,1)}
.lede{order:5;font-size:clamp(15.5px,1.5vw,18px);line-height:1.56;color:var(--dtx2);max-width:50ch;margin:0 0 18px}
.prod{order:6;font-size:clamp(15px,1.45vw,16.5px);line-height:1.6;color:var(--dtx);max-width:48ch;margin:0 0 28px}
.prod b{color:#fff;font-weight:600}
.hb{order:7;display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:6px 0 0}
.btn{background:linear-gradient(180deg,#22C8F7,#00A6DC);color:#04212E;font-weight:700;font-size:15.5px;
  padding:16px 30px;border-radius:10px;border:0;cursor:pointer;text-decoration:none;display:inline-block;
  box-shadow:0 10px 30px rgba(0,185,242,.30), inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .2s cubic-bezier(.2,.8,.3,1),box-shadow .2s}
.btn:hover{transform:translateY(-3px);box-shadow:0 20px 46px rgba(0,185,242,.5), inset 0 1px 0 rgba(255,255,255,.6)}
.btn2{border:1px solid rgba(255,255,255,.18);color:#fff;background:rgba(255,255,255,.04);font-weight:600;
  font-size:15px;padding:15px 24px;border-radius:10px;text-decoration:none;backdrop-filter:blur(8px);
  transition:border-color .22s,background .22s,transform .22s}
.btn2:hover{border-color:var(--cy);background:rgba(0,185,242,.10);transform:translateY(-2px)}
.ans{order:7;max-width:60ch;padding:15px 0 15px 20px;position:relative}
.ans::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,var(--cy),rgba(0,185,242,0))}
.ans p{margin:0;font-size:14px;line-height:1.62;color:var(--dtx2)}
.ans .k{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--dtx3);margin:0 0 8px}

/* Rakshak, standing in front of the plant */
.hchar{position:absolute;right:2.5vw;bottom:0;z-index:5;width:clamp(190px,17vw,300px);margin:0;pointer-events:none}
@media(max-width:1280px){.hchar{right:1vw;width:clamp(170px,15vw,240px)}}
@media(max-width:1120px){.hchar{display:none}}
.hchar::before{content:"";position:absolute;left:50%;bottom:6%;transform:translateX(-50%);
  width:150%;height:38%;border-radius:50%;
  background:radial-gradient(ellipse,rgba(0,185,242,.26),transparent 66%);filter:blur(10px);
  animation:pulseG 6s ease-in-out infinite}
@keyframes pulseG{0%,100%{opacity:.7}50%{opacity:1}}
.hchar img{position:relative;width:100%;height:auto;filter:drop-shadow(0 30px 46px rgba(0,0,0,.7));
  animation:floaty 7s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.hchar figcaption{display:none}

/* legend + live event log */
.hbot{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:0 28px 22px;pointer-events:none}
.hbot .in{max-width:1280px;margin:0 auto;display:flex;gap:18px;align-items:flex-end;flex-wrap:wrap}
@media(min-width:1121px){.hbot .in{padding-right:clamp(210px,19vw,330px);padding-left:min(540px,40vw)}}
.legend{display:flex;gap:16px;flex-wrap:wrap;align-items:center;background:rgba(6,14,22,.6);
  backdrop-filter:blur(14px);border:1px solid rgba(0,185,242,.16);border-radius:12px;padding:11px 16px}
.legend b{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dtx3);font-weight:600}
.legend span{display:inline-flex;align-items:center;gap:8px;font-family:"IBM Plex Mono",monospace;
  font-size:10px;letter-spacing:.11em;text-transform:uppercase;color:var(--dtx2)}
.legend i{width:9px;height:9px;border-radius:50%;flex:none}
.legend .ok i{background:#3DDC84;box-shadow:0 0 10px rgba(61,220,132,.8)}
.legend .no i{background:#FF5E5E;box-shadow:0 0 10px rgba(255,94,94,.8)}
.legend .wt i{background:#F0A500;box-shadow:0 0 10px rgba(240,165,0,.7)}
.evlog{margin-left:auto;width:min(360px,44vw);background:rgba(6,14,22,.6);backdrop-filter:blur(14px);
  border:1px solid rgba(0,185,242,.16);border-radius:12px;padding:12px 15px;font-family:"IBM Plex Mono",monospace}
@media(max-width:860px){.evlog{display:none}}
.evlog .h{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--dtx3);
  display:flex;justify-content:space-between;margin-bottom:9px}
.evlog ul{list-style:none;margin:0;padding:0;min-height:74px}
.evlog li{display:flex;gap:9px;align-items:baseline;font-size:10.5px;line-height:1.9;color:var(--dtx2);
  animation:evin .4s cubic-bezier(.2,.8,.3,1)}
@keyframes evin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.evlog li u{text-decoration:none;color:var(--dtx3);font-size:9.5px;flex:none}
.evlog li b{font-weight:600;flex:none}
.evlog li.ok b{color:#3DDC84}
.evlog li.no b{color:#FF5E5E}
.evlog li em{font-style:normal;color:var(--dtx3);margin-left:auto;font-size:9.5px}
.sdown{display:none}

.ansband{background:linear-gradient(180deg,#08131E,#050B12);border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);padding:30px 0}
.ansband{padding:46px 0}
.ansband .w{display:grid;grid-template-columns:180px minmax(0,1fr);gap:34px;align-items:start}
@media(max-width:760px){.ansband .w{grid-template-columns:1fr;gap:12px}}
.ansband .k{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cy);margin:4px 0 0;font-weight:600}
.ansband .lead{margin:0 0 20px;font-size:clamp(18px,2.05vw,25px);line-height:1.42;letter-spacing:-.02em;
  color:var(--dtx);max-width:62ch;font-weight:500}
.ansband .lead b{color:#fff;font-weight:700}
.ansband .a{margin:0;font-size:clamp(16.5px,1.55vw,19px);line-height:1.6;
  font-size:clamp(14.5px,1.4vw,16px);line-height:1.65;color:var(--dtx2);max-width:92ch}

/* ---------------- module ticker ---------------- */
.tick{background:var(--ink2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  overflow:hidden;padding:16px 0;position:relative}
.tick::before,.tick::after{content:"";position:absolute;top:0;bottom:0;width:140px;z-index:2;pointer-events:none}
.tick::before{left:0;background:linear-gradient(90deg,var(--ink2),transparent)}
.tick::after{right:0;background:linear-gradient(270deg,var(--ink2),transparent)}
.tkrun{display:flex;gap:0;width:max-content;animation:marq 38s linear infinite}
.tkrun span{font-family:"IBM Plex Mono",monospace;font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--dtx3);padding:0 26px;display:inline-flex;align-items:center;gap:26px;white-space:nowrap}
.tkrun span b{color:var(--cy);font-weight:600}
.tkrun span::after{content:"";width:5px;height:5px;border-radius:50%;background:rgba(0,185,242,.35)}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------------- section furniture ---------------- */
section.lt{background:var(--pg);padding:120px 0;position:relative;overflow:hidden}
section.lt::before{content:"";position:absolute;left:-10%;top:-30%;width:60%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(0,185,242,.10),transparent 62%);pointer-events:none}
section.pn{background:var(--pn);padding:120px 0;border-top:1px solid var(--rl);border-bottom:1px solid var(--rl);position:relative;overflow:hidden}
section.dk{background:var(--ink);color:var(--dtx);padding:120px 0;position:relative;overflow:hidden;border-top:1px solid var(--line)}
section.dk .glowa{position:absolute;right:-14%;top:-24%;width:56%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(0,116,166,.30),transparent 64%);pointer-events:none}
section.dk .glowb{position:absolute;left:-16%;bottom:-30%;width:52%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(0,185,242,.16),transparent 64%);pointer-events:none}
section .w{position:relative;z-index:2}
.kick{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cyd);font-weight:600;margin:0 0 16px;display:flex;align-items:center;gap:12px}
.kick::before{content:"";width:30px;height:1px;background:currentColor;flex:none}
.kick i{font-style:normal;opacity:.55}
section.dk .kick{color:var(--cy)}
h2{font-size:clamp(30px,4.6vw,56px);line-height:1.02;letter-spacing:-.038em;margin:0 0 20px;font-weight:700;
  max-width:20ch;text-wrap:balance}
section.dk h2{color:#fff}
.sub{color:var(--tx2);font-size:18px;max-width:60ch;margin:0 0 48px;line-height:1.62}
section.dk .sub{color:var(--dtx2)}

.rv{transition:opacity .8s cubic-bezier(.2,.8,.3,1),transform .8s cubic-bezier(.2,.8,.3,1)}
.js .rv{opacity:0;transform:translateY(30px)}
.js .rv.in{opacity:1;transform:none}

/* ---------------- client ribbon ---------------- */
.ribbon{background:var(--ink2);padding:34px 0;border-bottom:1px solid var(--line)}
.ribbon .lbl{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;
  color:var(--dtx3);text-align:center;margin:0 0 22px;font-weight:600}
.logomask{position:relative;overflow:hidden;width:100%}
.logomask::before,.logomask::after{content:"";position:absolute;top:0;bottom:0;width:120px;z-index:2;pointer-events:none}
.logomask::before{left:0;background:linear-gradient(90deg,#060F19,rgba(6,15,25,0))}
.logomask::after{right:0;background:linear-gradient(270deg,#060F19,rgba(6,15,25,0))}
.logotrack{display:flex;gap:14px;width:max-content;align-items:center;
  animation:logoflow 52s linear infinite;will-change:transform}
.logomask:hover .logotrack{animation-play-state:paused}
@keyframes logoflow{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.lgo{flex:0 0 auto;width:150px;height:60px;border-radius:11px;display:grid;place-items:center;padding:9px 15px;
  background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.12);
  transition:transform .28s cubic-bezier(.2,.8,.3,1),box-shadow .28s,background .28s}
.lgo:hover{transform:translateY(-3px);background:#fff;box-shadow:0 14px 32px rgba(0,0,0,.45)}
.lgo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;
  filter:grayscale(1) contrast(1.05);opacity:.78;transition:filter .3s,opacity .3s}
.lgo:hover img{filter:none;opacity:1}
@media(max-width:640px){.lgo{width:124px;height:50px;padding:7px 12px}
  .logomask::before,.logomask::after{width:56px}}
@media (prefers-reduced-motion:reduce){.logotrack{animation:none;flex-wrap:wrap;width:auto;justify-content:center}}

/* ---------------- nine moments · horizontal rail ---------------- */
.rail{position:relative;background:var(--ink);color:var(--dtx)}
.railstick{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:240px 0 116px}
.railhead{position:absolute;top:0;left:0;right:0;z-index:6;padding:88px 0 30px;
  background:linear-gradient(180deg,#050B12 62%,rgba(5,11,18,.85) 84%,transparent)}
.railhead .w{display:flex;align-items:flex-end;gap:36px;flex-wrap:wrap}
@media(max-width:900px){.railside{margin-left:0;text-align:left}}
.railhead h2{margin:0;font-size:clamp(24px,3.1vw,40px);max-width:22ch}
.railside{margin-left:auto;max-width:460px;text-align:right}
.railintro{font-size:clamp(14.5px,1.35vw,16.5px);line-height:1.55;color:var(--dtx2);margin:0 0 14px;text-align:left}
.railcount{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--dtx3)}
.railcount b{color:var(--cy);font-size:24px;font-weight:600;letter-spacing:-.02em}
.track{display:flex;gap:26px;padding:0 max(28px,calc((100vw - 1280px)/2));will-change:transform}
.panel{flex:0 0 min(660px,84vw);background:linear-gradient(160deg,#0B1926 0%,#070F18 100%);
  border:1px solid var(--line);border-radius:20px;overflow:hidden;display:grid;grid-template-rows:auto 1fr;
  box-shadow:0 40px 90px rgba(0,0,0,.5);position:relative}
.panel::after{content:"";position:absolute;inset:0;border-radius:20px;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,185,242,.06),transparent 40%)}
.pscreen{position:relative;height:clamp(170px,23svh,240px);background:#040A11;border-bottom:1px solid var(--line)}
.pscreen canvas{position:absolute;inset:0;width:100%;height:100%}
.pscreen .ov{position:absolute;inset:0;opacity:.5;pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,185,242,.05) 3px 4px)}
.pscreen .tg{position:absolute;left:14px;top:12px;font-family:"IBM Plex Mono",monospace;font-size:9.5px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--cy);display:flex;align-items:center;gap:8px;z-index:2}
.pscreen .tg i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 9px var(--red);animation:bl 1.5s infinite}
.pscreen .rr{position:absolute;right:14px;top:12px;font-family:"IBM Plex Mono",monospace;font-size:9.5px;
  letter-spacing:.13em;color:var(--dtx3);z-index:2}
.pbody{padding:30px 32px 34px;display:flex;flex-direction:column}
.pnum{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.2em;color:var(--dtx3);margin-bottom:12px;
  display:flex;align-items:center;gap:12px}
.pnum .chip{border:1px solid rgba(0,185,242,.32);color:var(--cy);border-radius:99px;padding:4px 12px;
  font-size:9.5px;letter-spacing:.15em}
.pplace{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cy);margin:0 0 12px}
.pline{font-size:clamp(19px,1.95vw,26px);line-height:1.24;letter-spacing:-.026em;color:#fff;font-weight:700;
  margin:0 0 14px;text-wrap:balance}
.pwhy{font-size:15.5px;color:var(--dtx2);margin:0 0 18px;line-height:1.6}
.pdoes{margin-top:auto;border-top:1px solid var(--line);padding-top:16px;font-size:15px;color:var(--dtx);line-height:1.55}
.pdoes a{color:var(--cy);text-decoration:none;font-weight:600}
.pdoes a:hover{text-decoration:underline}
.railbar{position:absolute;left:0;right:0;bottom:44px;z-index:6}
.railbar .w{display:flex;gap:6px;align-items:center}
.rdot{flex:1;height:3px;border-radius:2px;background:rgba(0,185,242,.14);overflow:hidden}
.rdot i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyd),var(--cy))}

/* the rail's CTA band · its own section so it can never collide with the
   absolutely positioned .railbar inside the sticky 100svh rail. It was placed
   inside .railstick at first and landed on top of the progress ticks. */
.railcta{background:var(--ink);padding:0 0 84px;text-align:center}
.railcta .ctarow{margin:0}
@media(max-width:900px){.railcta{padding:26px 0 46px}}

/* ── CR-26 · the rail head no longer floats over the camera screen ──────────
   .railhead was position:absolute over the top 284px at z-index 6, while
   .railstick reserved only 240px of padding and then CENTRED the track in what
   was left. On every desktop under about 1000px tall the panel was taller than
   that box, so centring pushed the panel's top UP UNDER the head and the
   headline was painted straight over the camera animation.

   Measured before the fix · share of the camera screen covered by the head:
     1920 x 1080   21%      1440 x 900   60%
     1512 x  860   71%      1440 x 760   99%
   It was correct at 1920 x 1080 and nowhere else, which is why it survived.

   The head is now a flex item in the same column as the track, so the two
   cannot overlap at ANY viewport height. The height queries below recover the
   vertical room a short desktop needs. No copy is changed or hidden. */
@media(min-width:901px){
  .railstick{padding:96px 0 72px;justify-content:flex-start}
  .railhead{position:static;background:none;padding:0 0 24px;flex:0 0 auto;width:100%}
  .track{flex:0 0 auto}
}
@media(min-width:901px) and (max-height:980px){
  .railhead{padding:0 0 16px}
  .railhead h2{font-size:clamp(22px,2.6vw,32px)}
  .railintro{font-size:14.5px;line-height:1.5;margin:0 0 10px}
  .railcount b{font-size:20px}
  .pbody{padding:24px 30px 26px}
  .pline{font-size:clamp(18px,1.7vw,23px);margin:0 0 11px}
  .pwhy{font-size:14.5px;line-height:1.55;margin:0 0 14px}
  .pdoes{padding-top:13px;font-size:14.5px}
  .railstick{padding:92px 0 46px}
  .railbar{bottom:22px}
}
@media(min-width:901px) and (max-height:850px){
  .railbar{bottom:16px}
  .railhead{padding:0 0 10px}
  .railhead h2{font-size:clamp(21px,2.25vw,28px)}
  .railintro{font-size:13.5px;line-height:1.48;margin:0 0 8px}
  .railcount b{font-size:18px}
  .pscreen{height:clamp(146px,19.5svh,196px)}
  .pbody{padding:19px 28px 21px}
  .pnum{margin-bottom:9px}
  .pplace{margin:0 0 9px}
  .pline{font-size:clamp(17px,1.5vw,21px);margin:0 0 9px}
  .pwhy{font-size:13.8px;line-height:1.5;margin:0 0 11px}
  .pdoes{padding-top:10px;font-size:13.8px}
  .railstick{padding:88px 0 34px}
  .railbar{bottom:22px}
}
@media(max-width:900px){
  .railstick{position:static;height:auto;padding:70px 0 0}
  .railhead{background:none;padding:0}
  .railhead{position:static;margin-bottom:30px}
  .track{flex-direction:column;padding:0 22px;gap:18px;transform:none!important}
  .panel{flex:1 1 auto}
  .railbar{display:none}
}

/* ---------------- product proof ---------------- */
.proof{display:grid;grid-template-columns:1.35fr 1fr;gap:22px;align-items:start;margin-top:12px}
@media(max-width:980px){.proof{grid-template-columns:1fr}}
.screenwrap{position:relative;border-radius:18px;overflow:hidden;border:1px solid var(--line);
  background:#04090F;box-shadow:0 50px 110px rgba(0,0,0,.55)}
.screenwrap .bar{display:flex;align-items:center;gap:7px;padding:11px 14px;border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.02)}
.screenwrap .bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.14)}
.screenwrap .bar span{margin-left:10px;font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dtx3)}
.screenwrap img{width:100%;height:auto}
.screenwrap .sweep{position:absolute;left:0;right:0;height:180px;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(0,185,242,.13));animation:sweepy 6s ease-in-out infinite}
@keyframes sweepy{0%{top:-180px}100%{top:100%}}
.detpair{display:grid;gap:22px}
.detcard{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#04090F;position:relative;
  box-shadow:0 30px 70px rgba(0,0,0,.45)}
.detcard img{width:100%;height:auto}
.detcard .cap{padding:14px 16px;border-top:1px solid var(--line);font-family:"IBM Plex Mono",monospace;
  font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--dtx3);line-height:1.7}
.detcard .cap b{color:var(--cy);display:block;font-weight:600;margin-bottom:3px}
.devrow{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:22px;align-items:center}
@media(max-width:700px){.devrow{grid-template-columns:1fr}}
.devshot{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#000;position:relative}
.devshot img{width:100%;height:auto}
.devtxt h3{font-size:22px;margin:0 0 10px;color:#fff;font-weight:700;letter-spacing:-.02em}
.devtxt p{margin:0;color:var(--dtx2);font-size:15.5px;line-height:1.62}

/* ---------------- odometer counters ---------------- */
.igrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin-top:40px}
.icell{background:linear-gradient(160deg,#0B1926,#070F18);padding:36px 26px;position:relative;overflow:hidden;
  transition:background .35s}
.icell:hover{background:linear-gradient(160deg,#102437,#08131F)}
.icell::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--cy),transparent);opacity:0;transition:opacity .4s}
.icell:hover::before{opacity:1}
.odo{display:flex;align-items:baseline;font-family:"IBM Plex Mono",monospace;
  font-size:clamp(38px,5.2vw,62px);font-weight:600;letter-spacing:-.04em;color:#fff;line-height:1}
.odo em{font-style:normal;color:var(--cy);font-size:.55em;margin-left:3px}
.dgt{display:inline-block;height:1em;overflow:hidden;position:relative;width:1ch;vertical-align:top}
.dgt u{display:block;text-decoration:none;line-height:1;transition:transform 1.6s cubic-bezier(.2,.85,.25,1)}
.odo .plain{display:inline}
.icell .k{font-size:13.5px;color:var(--dtx2);margin-top:15px;line-height:1.5}
.isrc{margin-top:26px;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--dtx3);line-height:1.8}

/* ---------------- C14 recognition band ---------------- */
.recog{background:linear-gradient(180deg,#070F18,#04090F);color:var(--dtx);padding:118px 0;position:relative;
  overflow:hidden;border-top:1px solid var(--line)}
.rgrid{display:grid;grid-template-columns:250px minmax(0,1fr) 250px;gap:44px;align-items:start;margin-top:10px}
@media(max-width:1080px){.rgrid{grid-template-columns:1fr}}
.rchar{position:sticky;top:110px;text-align:center}
.rchar img{width:100%;height:auto;filter:drop-shadow(0 30px 44px rgba(0,0,0,.6))}
@media(max-width:1080px){
  .rchar{position:static;display:flex;gap:20px;align-items:flex-end;justify-content:center;flex-wrap:wrap}
  .rchar img{width:auto;height:220px;max-width:46%;object-fit:contain;flex:0 0 auto}
  .rchar .rname{align-self:flex-end;text-align:left;margin:0 0 6px}
}
@media(max-width:560px){
  /* let width drive on small screens so the box ratio always matches the artwork */
  .rchar img{width:42%;height:auto;max-width:42%}
}
.rchar .rname{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--dtx3);margin:14px 0 0;line-height:1.8}
.rchar .rname b{display:block;color:var(--cy);font-weight:600;margin-bottom:3px;font-size:11px}
.ritem{padding:30px 0;border-bottom:1px solid var(--line)}
.ritem:first-child{padding-top:0}
.ritem:last-child{border-bottom:0}
.rq{font-size:clamp(20px,2.4vw,28px);line-height:1.26;letter-spacing:-.026em;color:#fff;font-weight:700;
  margin:0 0 14px;text-wrap:balance}
.rq::before{content:"“";color:var(--cy)}
.rq::after{content:"”";color:var(--cy)}
.rwhy{font-size:16px;color:var(--dtx2);margin:0 0 16px;line-height:1.64;max-width:56ch}
.rfix{display:block;font-size:15.5px;color:#fff;font-weight:500;border-left:3px solid var(--cy);
  padding-left:15px;line-height:1.55;max-width:52ch}
.rfoot{margin-top:30px;font-size:14px;color:var(--dtx3);line-height:1.7;max-width:64ch;font-style:italic}

/* ---------------- uptime ---------------- */
.units{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:1px;background:var(--rl);
  border:1px solid var(--rl);border-radius:18px;overflow:hidden;box-shadow:0 24px 60px rgba(5,11,18,.07)}
.unit{background:var(--pn);padding:30px 26px;transition:background .3s}
.unit:hover{background:var(--sk)}
.unit .u{font-family:"IBM Plex Mono",monospace;font-size:clamp(26px,3vw,36px);font-weight:600;letter-spacing:-.035em;
  line-height:1;background:linear-gradient(140deg,#0074A6,#00B9F2);-webkit-background-clip:text;background-clip:text;color:transparent}
.unit .l{font-size:14.5px;color:var(--tx2);margin-top:13px;line-height:1.5}
.updo{margin-top:36px;font-size:17.5px;color:var(--tx2);max-width:64ch;line-height:1.65}
.updo b{color:var(--tx);font-weight:600}

/* ---------------- record timeline ---------------- */
.tl{position:relative;margin-top:52px}
.tlline{position:absolute;left:0;right:0;top:26px;height:2px;background:rgba(0,185,242,.16);overflow:hidden;border-radius:2px}
.tlline i{display:block;height:100%;width:0;background:linear-gradient(90deg,#0074A6,#00B9F2,#B7ECFB);box-shadow:0 0 14px rgba(0,185,242,.55)}
.tlrow{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media(max-width:820px){.tlrow{grid-template-columns:1fr;gap:30px}}
.tlnode .dot{width:14px;height:14px;border-radius:50%;background:var(--cy);box-shadow:0 0 0 6px rgba(0,185,242,.14);
  margin-bottom:26px;position:relative;z-index:2}
.tlnode .w1{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cy);margin-bottom:10px}
.tlnode h3{font-size:20px;margin:0 0 10px;color:#fff;font-weight:700;letter-spacing:-.02em}
.tlnode p{margin:0;font-size:15px;color:var(--dtx2);line-height:1.62}
.cite{margin-top:34px;font-size:14px;color:var(--dtx3);line-height:1.8;max-width:72ch}
.cite a{color:var(--cy);text-decoration:none;border-bottom:1px solid rgba(0,185,242,.35)}

/* ---------------- industries ---------------- */
.ind{display:flex;flex-wrap:wrap;gap:11px}
.ind a{background:var(--pn);border:1px solid var(--rl);border-radius:99px;padding:12px 22px;font-size:14.5px;
  text-decoration:none;color:var(--tx);font-weight:500;transition:all .24s cubic-bezier(.2,.8,.3,1)}
.ind a:hover{border-color:transparent;color:#04212E;transform:translateY(-3px);
  background:linear-gradient(180deg,#22C8F7,#00A6DC);box-shadow:0 14px 30px rgba(0,185,242,.34)}
.ind span{background:var(--pn);border:1px solid var(--rl);border-radius:99px;padding:12px 22px;font-size:14.5px;
  font-weight:600;color:var(--tx2);display:inline-block;opacity:.8;cursor:default}

/* ---------------- three signatures ---------------- */
.sigwrap{display:grid;grid-template-columns:270px minmax(0,1fr);gap:44px;align-items:start}
@media(max-width:1000px){.sigwrap{grid-template-columns:1fr}.sigchar{display:none}}
.sigchar{position:sticky;top:110px;text-align:center}
.sigchar img{width:100%;height:auto;filter:drop-shadow(0 30px 44px rgba(5,11,18,.22))}
.sigchar p{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--tx3);margin:14px 0 0;line-height:1.8}
.sigchar p b{display:block;color:var(--cyd);font-weight:600;font-size:11px;margin-bottom:3px}
.sig{display:grid;gap:14px}
.sc{background:var(--pn);border:1px solid var(--rl);border-radius:18px;padding:30px 30px;position:relative;
  overflow:hidden;transition:transform .3s,box-shadow .3s,border-color .3s}
.sc:hover{transform:translateY(-4px);box-shadow:0 26px 58px rgba(5,11,18,.12);border-color:var(--cys)}
.sc::after{content:"";position:absolute;left:0;top:0;width:100%;height:3px;
  background:linear-gradient(90deg,var(--cy),var(--cyd));transform:scaleX(0);transform-origin:left;transition:transform .5s}
.sc:hover::after{transform:scaleX(1)}
.sc .who{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--cyd);font-weight:600;margin-bottom:14px}
.sc h3{font-size:21px;margin:0 0 10px;font-weight:700;letter-spacing:-.022em;line-height:1.26}
.sc p{margin:0;font-size:15.5px;color:var(--tx2);line-height:1.6}
.res{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
@media(max-width:760px){.res{grid-template-columns:1fr}}
.rc{display:flex;flex-direction:column;background:linear-gradient(160deg,#0B1926,#070F18);border:1px solid var(--line);
  border-radius:18px;padding:28px;text-decoration:none;color:var(--dtx);
  transition:transform .3s,box-shadow .3s,border-color .3s}
.rc:hover{transform:translateY(-5px);box-shadow:0 28px 60px rgba(5,11,18,.3);border-color:rgba(0,185,242,.4)}
.rc .t{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--cy);font-weight:600;margin-bottom:14px}
.rc h3{font-size:20px;margin:0 0 10px;font-weight:700;letter-spacing:-.02em;line-height:1.26;color:#fff}
.rc p{font-size:14.5px;color:var(--dtx2);margin:0 0 18px;flex:1;line-height:1.58}
.rc .go{font-size:14.5px;color:var(--cy);font-weight:600}

/* ---------------- FAQ ---------------- */
.faq{max-width:82ch}
.fq{border-bottom:1px solid var(--rl);padding:28px 0;transition:padding-left .3s}
.fq:first-child{border-top:1px solid var(--rl)}
.fq:hover{padding-left:10px}
.fq h3{font-size:21px;margin:0 0 10px;font-weight:700;letter-spacing:-.02em}
.fq p{margin:0;color:var(--tx2);font-size:16.5px;line-height:1.64}

/* ---------------- ground photo slots ---------------- */
.shots{display:grid;grid-template-columns:1.7fr 1fr 1fr;gap:14px;margin-top:40px}
@media(max-width:860px){.shots{grid-template-columns:1fr 1fr}}
.shot{background:#04090F;border:1px dashed rgba(0,185,242,.24);border-radius:16px;min-height:210px;position:relative;
  overflow:hidden;display:flex;align-items:flex-end;padding:20px}
.shot:first-child{grid-row:span 2}
@media(max-width:860px){.shot:first-child{grid-row:auto}}
.shot::before{content:"";position:absolute;inset:0;opacity:.4;
  background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,185,242,.05) 3px 4px)}
.shot .cap{position:relative;font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--cy);line-height:1.7}
.shot .cap b{display:block;color:var(--dtx3);font-weight:500;margin-top:5px;letter-spacing:.04em;text-transform:none;font-size:11px}
.shot .cnr{position:absolute;width:16px;height:16px;border:1.5px solid rgba(0,185,242,.42)}
.shot .c1{top:14px;left:14px;border-right:0;border-bottom:0}
.shot .c2{top:14px;right:14px;border-left:0;border-bottom:0}
.shot .c3{bottom:14px;left:14px;border-right:0;border-top:0}
.shot .c4{bottom:14px;right:14px;border-left:0;border-top:0}

/* ---------------- CTA ---------------- */
.ctab{background:linear-gradient(150deg,#0B1926 0%,#04090F 100%);border-radius:26px;position:relative;
  overflow:hidden;border:1px solid var(--line);box-shadow:0 50px 120px rgba(5,11,18,.28)}
.ctab .g1{position:absolute;right:-160px;top:-190px;width:560px;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(0,185,242,.26),transparent 62%);pointer-events:none}
.ctin{position:relative;display:grid;grid-template-columns:1.1fr 220px 1fr;gap:0;z-index:2}
@media(max-width:1080px){.ctin{grid-template-columns:1fr}.ctchar{display:none}}
.ctl{padding:60px 52px;border-right:1px solid var(--line)}
@media(max-width:1080px){.ctl{border-right:0;border-bottom:1px solid var(--line);padding:44px 28px}}
.ctl h2{color:#fff;margin:0 0 14px;max-width:15ch}
.ctl .pl{color:var(--dtx2);margin:0 0 32px;max-width:44ch;font-size:17px;line-height:1.62}
.steps{list-style:none;counter-reset:s;margin:0 0 32px;padding:0}
.steps li{counter-increment:s;position:relative;padding:0 0 22px 50px;color:var(--dtx);font-size:15.5px;line-height:1.56}
.steps li:last-child{padding-bottom:0}
.steps li::before{content:counter(s);position:absolute;left:0;top:-3px;width:32px;height:32px;border-radius:10px;
  border:1px solid rgba(0,185,242,.3);background:rgba(0,185,242,.09);color:var(--cy);display:grid;place-items:center;
  font-family:"IBM Plex Mono",monospace;font-size:13px;font-weight:600}
.steps li b{color:#fff;font-weight:600}
.ctchar{align-self:end;padding:0 0 0 10px}
.ctchar img{width:100%;height:auto;filter:drop-shadow(0 26px 40px rgba(0,0,0,.55))}
.ctr{padding:60px 46px;border-left:1px solid var(--line)}
@media(max-width:1080px){.ctr{padding:44px 28px;border-left:0}}
.ctr .fh{font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.19em;text-transform:uppercase;
  color:var(--dtx3);margin:0 0 20px}
.fallback{margin-top:26px;border-top:1px solid var(--line);padding-top:22px;font-size:14.5px;color:var(--dtx2);line-height:1.75}
.fallback a{color:var(--cy);text-decoration:none}
.fallback a:hover{text-decoration:underline}
.fallback .lbl{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--dtx3);display:block;margin-bottom:9px}

@media (prefers-reduced-motion:reduce){
  .js .rv,.js .wd{opacity:1!important;transform:none!important}
  .sdown i,.tel .lv i,.hchar img,.hchar::before,.hchar .ring,.tkrun,.screenwrap .sweep,.pscreen .tg i{animation:none!important}
  .track{transform:none!important}
}
@media(max-width:1040px){.hnav{display:none}}
@media(max-width:860px){.ftg{grid-template-columns:1fr 1fr}}
@media(max-width:640px){
  section.lt,section.pn,section.dk,.recog{padding:80px 0}
  .ctl,.ctr{padding:34px 22px}
  .w{padding:0 22px}
}

/* ================= dark-dominant override · one continuous surface ================= */
section.lt{background:radial-gradient(90% 70% at 18% 0%,#0A1826 0%,#050B12 58%)}
section.lt::before{background:radial-gradient(circle,rgba(0,185,242,.13),transparent 62%)}
section.pn{background:linear-gradient(180deg,#07131F 0%,#050D16 100%);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
section.lt h2,section.pn h2{color:#fff}
section.lt .sub,section.pn .sub{color:var(--dtx2)}
section.lt .kick,section.pn .kick{color:var(--cy)}

.units{background:var(--line);border-color:var(--line);box-shadow:0 30px 70px rgba(0,0,0,.45)}
.unit{background:linear-gradient(160deg,#0C1B29,#081420)}
.unit:hover{background:linear-gradient(160deg,#122839,#0A1A28)}
.unit .u{background:linear-gradient(140deg,#00B9F2,#B7ECFB);-webkit-background-clip:text;background-clip:text;color:transparent}
.unit .l{color:var(--dtx2)}
.updo{color:var(--dtx2)}
.updo b{color:#fff}

.ind a{background:rgba(255,255,255,.03);border-color:rgba(0,185,242,.20);color:var(--dtx)}
.ind a:hover{color:#04212E;border-color:transparent}
.ind span{background:rgba(255,255,255,.03);border-color:rgba(0,185,242,.20);color:var(--dtx2);opacity:.75}

.sc{background:linear-gradient(160deg,#0C1B29,#081420);border-color:var(--line)}
.sc:hover{border-color:rgba(0,185,242,.45);box-shadow:0 26px 58px rgba(0,0,0,.5)}
.sc h3{color:#fff}
.sc p{color:var(--dtx2)}
.sc .who{color:var(--cy)}
.sigchar figcaption{color:var(--dtx3)}
.sigchar figcaption b{color:var(--cy)}
.sigchar img{filter:drop-shadow(0 30px 46px rgba(0,0,0,.7))}

.fq{border-bottom-color:var(--line)}
.fq:first-child{border-top-color:var(--line)}
.fq h3{color:#fff}
.fq p{color:var(--dtx2)}
.fq:hover{background:linear-gradient(90deg,rgba(0,185,242,.05),transparent);border-radius:10px}

.ribbon{background:#060F19}
.ribbon .lbl{color:var(--cy);opacity:.8}
.lgo{color:var(--dtx3)}
.ctab{box-shadow:0 50px 120px rgba(0,0,0,.6)}

/* FAQ side panel */
.faqwrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:46px;align-items:start}
@media(max-width:1000px){.faqwrap{grid-template-columns:1fr;gap:34px}}
.faq{max-width:none}
.faqside{position:sticky;top:110px;background:linear-gradient(160deg,#0C1B29,#081420);
  border:1px solid var(--line);border-radius:20px;padding:0 28px 30px;text-align:left;
  box-shadow:0 34px 76px rgba(0,0,0,.5);overflow:hidden}
.faqside img{width:172px;height:auto;margin:-6px auto 6px;display:block;filter:drop-shadow(0 18px 26px rgba(0,0,0,.6))}
.faqside .t{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cy);margin:0 0 10px;font-weight:600}
.faqside h3{font-size:21px;line-height:1.24;letter-spacing:-.022em;color:#fff;margin:0 0 12px;font-weight:700}
.faqside .d{font-size:14.5px;color:var(--dtx2);line-height:1.6;margin:0 0 22px}
.faqside .btn{font-size:14.5px;padding:13px 24px}
.faqside .n{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.11em;text-transform:uppercase;
  color:var(--dtx3);margin:20px 0 0;line-height:1.8}
.ctchar{overflow:hidden}
.ctchar img{max-height:430px;width:auto;margin:0 auto}

/* ============ STANDARD BAND · deployment models + turnkey · Rule Book 4.2.14 and 4.2.15 ============ */
/* CR-46 · 5 October 2026 · minmax(0,...) on the standard band tracks. A plain fr track has a
   minimum of its content's min-content, and table.dep is min-width 640px, so on a phone the
   column grew to 640px and the section's overflow:hidden cut 23 lines of text off the right
   edge. minmax(0,...) lets the column shrink and .depwrap scroll the table instead. */
.stdgrid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:56px;align-items:start}
@media(max-width:960px){.stdgrid{grid-template-columns:minmax(0,1fr);gap:50px}}
.stdgrid h2{font-size:clamp(25px,3.3vw,37px);margin:0 0 18px}
.stdgrid .sub{margin:0 0 28px;font-size:16.5px;max-width:52ch}
.depwrap{overflow-x:auto;border:1px solid var(--line);background:rgba(255,255,255,.02)}
table.dep{border-collapse:collapse;width:100%;min-width:640px;font-size:14.5px;table-layout:fixed}
table.dep td:first-child,table.dep th:first-child{width:23%;min-width:150px}
table.dep td:nth-child(2),table.dep th:nth-child(2){width:40%}
table.dep th{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dtx3);font-weight:600;text-align:left;padding:14px 18px;border-bottom:1px solid var(--line);
  background:rgba(255,255,255,.03);white-space:nowrap}
table.dep td{padding:16px 18px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--dtx2);line-height:1.55}
table.dep tr:last-child td{border-bottom:0}
table.dep td b{color:#fff;font-size:15.5px;display:block;margin-bottom:3px}
table.dep tr.pick td{background:rgba(0,185,242,.07)}
table.dep tr.pick td:first-child{box-shadow:inset 3px 0 0 var(--cy)}
.pill{display:inline-block;font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;font-weight:600;color:#04212E;background:var(--cy);padding:3px 8px;border-radius:3px;margin-top:4px}
.depnote{font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.04em;color:var(--dtx3);margin:15px 0 0}
ol.tksteps{list-style:none;counter-reset:st;margin:0;padding:0;border-top:1px solid var(--line)}
ol.tksteps li{counter-increment:st;position:relative;padding:15px 0 15px 46px;border-bottom:1px solid var(--line);
  color:var(--dtx2);font-size:14.5px;line-height:1.55}
ol.tksteps li::before{content:counter(st,decimal-leading-zero);position:absolute;left:0;top:17px;
  font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;color:var(--cy);font-weight:600}
ol.tksteps li b{color:#fff;display:block;margin-bottom:2px;font-size:15px}

.ansband .tk{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--line);
  font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.06em;color:var(--dtx3);line-height:1.8}
.ansband .tk a{color:var(--cy);text-decoration:none;border-bottom:1px solid rgba(0,185,242,.35)}
.ansband .tk a:hover{border-bottom-color:var(--cy)}
/* ============ HOW VIJAI HELPS · the close ============ */
.chg{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:1px;background:var(--line);
  border:1px solid var(--line)}
.cg{background:linear-gradient(160deg,#0C1B29,#081420);padding:24px 24px 26px}
.cg .lab{font-family:"IBM Plex Mono",monospace;font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:600;color:var(--dtx3);margin:0 0 8px}
.cg .lab.on{color:var(--cy);margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.cg .was{margin:0;color:var(--dtx3);font-size:14.5px;line-height:1.55}
.cg .now{margin:0;color:#fff;font-size:15.5px;line-height:1.5;font-weight:600;letter-spacing:-.012em}

/* r7 · the two resource cards whose pages are not built yet. Card stays, link comes off. */
.rc.rcp{cursor:default}
.rc.rcp:hover{transform:none;box-shadow:none;border-color:var(--line)}
.go.soon{color:var(--dtx3);font-weight:600}