/* ═══════════════════════════════════════════════════════════════════════
   GW EDITORIAL-PRODUCT — public funnel design system (Wave B skin)
   Spec: GW_FUNNEL_OVERHAUL_SPEC_2026-07-14.md §3 + Brandon 07-15 direction:
   differentiate from RecentBreaches as the security PRODUCT brand.
   Rules enforced here (the polish delta):
     · Space Grotesk display capped at 44px/700 (h1–h3, kicker, stat numerals);
       body stays Inter — Source Serif 4 is gone
     · cool slate paper (page stays light); CARDS are dark brutalist panels:
       #14171c, 2px ink border, hard 5px/5px offset shadow, NO blur
     · zero gradients on UI surfaces (gradients live in image assets)
     · motion = opacity/transform, 120–300ms, standard easing, reduced-motion safe
     · lime appears ONLY on primary CTAs + confirmed ticks;
       cyan ONLY as a small data accent where a second accent already exists
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --gw-paper:#f4f5f6; --gw-card:#ffffff; --gw-ink:#16181d; --gw-body:#3f4450;
  --gw-mut:#6b7080; --gw-faint:#9a9fad; --gw-hair:#dfe3e8; --gw-hair2:#ccd2d9;
  --gw-green-ink:#3f6212; --gw-lime:#84cc16; --gw-lime-d:#65a30d;
  --gw-cyan:#22d3ee;
  --gw-danger:#b91c1c; --gw-danger-bg:#fdf0ef; --gw-ok-bg:#f2f8e8;
  --gw-panel:#14171c; --gw-panel-2:#1a1f2a; --gw-edge:#0b0d10; --gw-edge-d:#05060a;
  --gw-ptxt:#e8eaee; --gw-pmut:#a7adb8;
  --gw-off:5px 5px 0 var(--gw-edge);
  --gw-disp:'Space Grotesk','Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --gw-sans:'Inter',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --gw-sh1:0 1px 4px rgba(10,12,16,.05);
  --gw-sh2:0 4px 16px rgba(10,12,16,.10);
  --gw-sh3:0 10px 28px rgba(10,12,16,.18);
  --gw-r:8px; --gw-rs:7px;
  --gw-t:180ms; --gw-ease:cubic-bezier(.16,1,.3,1);
  --gw-max:1120px;
}

*,*::before,*::after{box-sizing:border-box;}
.gwe{background:var(--gw-paper);color:var(--gw-body);font-family:var(--gw-sans);
  font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased;margin:0;}
.gwe h1,.gwe h2,.gwe h3{font-family:var(--gw-disp);color:var(--gw-ink);font-weight:700;
  letter-spacing:-.012em;margin:0;}
.gwe h1{font-size:clamp(30px,4.2vw,44px);line-height:1.12;}
.gwe h2{font-size:clamp(22px,2.6vw,29px);line-height:1.2;margin:0 0 .5rem;}
.gwe h3{font-size:18px;line-height:1.3;}
.gwe p{margin:.4rem 0;}
.gwe a{color:var(--gw-green-ink);text-decoration:none;}
.gwe a:hover{text-decoration:underline;text-underline-offset:3px;}
.gwe img{max-width:100%;height:auto;display:block;}
.gwe :focus-visible{outline:3px solid var(--gw-lime);outline-offset:2px;border-radius:4px;}

.gwe .wrap{max-width:var(--gw-max);margin:0 auto;padding:0 22px;}
.gwe .sec{padding:clamp(36px,5.5vw,64px) 0;}
.gwe .sec.tight{padding:clamp(22px,3.5vw,36px) 0;}
.gwe .kicker{font-family:var(--gw-disp);font-size:.68rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gw-green-ink);display:block;margin-bottom:.55rem;}
.gwe .lede{font-size:clamp(15.5px,1.5vw,17.5px);color:var(--gw-body);max-width:640px;}
.gwe .fine{font-size:.72rem;color:var(--gw-faint);line-height:1.55;}

/* ── masthead + ticker ─────────────────────────────────────────────── */
.gwe .ticker{background:var(--gw-ink);color:#e7e9ee;font-size:.74rem;overflow:hidden;white-space:nowrap;}
.gwe .ticker .tk{display:inline-block;padding:7px 0;animation:gweTick 46s linear infinite;}
.gwe .ticker a{color:#e7e9ee;margin-right:2.2rem;}
.gwe .ticker .sev{color:#fca5a5;font-weight:700;margin-right:.35rem;}
.gwe .ticker .dt{color:var(--gw-cyan);margin-left:.4rem;}
@keyframes gweTick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.gwe .masthead{background:rgba(255,255,255,.86);backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--gw-hair);
  position:sticky;top:0;z-index:50;}
.gwe .masthead .row{display:flex;align-items:center;gap:1.4rem;height:60px;}
.gwe .brand{display:flex;align-items:center;gap:.6rem;font-family:var(--gw-sans);
  font-weight:800;font-size:1.13rem;color:var(--gw-ink);letter-spacing:-.022em;}
.gwe .brand b{font-weight:800;color:var(--gw-green-ink);}
/* app-icon tile: the mark on an ink rounded-square — product identity,
   clearly kin to (but distinct from) RB's serif newspaper masthead */
.gwe .brand .btile{width:32px;height:32px;border-radius:9px;background:#0b0d14;
  border:1px solid rgba(132,204,22,.55);display:grid;place-items:center;
  box-shadow:0 2px 8px rgba(10,12,16,.25);}
.gwe .brand .btile img{width:19px;height:19px;}
.gwe .mnav{display:flex;gap:1.15rem;font-size:.86rem;font-weight:600;color:var(--gw-mut);
  margin-left:auto;}
.gwe .mnav a{color:var(--gw-mut);}
.gwe .mnav a:hover{color:var(--gw-ink);text-decoration:none;}
.gwe .mcta{background:var(--gw-lime);color:var(--gw-ink);font-weight:700;font-size:.85rem;
  padding:.5rem .95rem;border-radius:var(--gw-rs);border:2px solid var(--gw-edge);
  box-shadow:2px 2px 0 var(--gw-edge);transition:background var(--gw-t) var(--gw-ease);}
.gwe .mcta:hover{background:var(--gw-lime-d);text-decoration:none;}
@media(max-width:760px){.gwe .mnav{display:none;}}

/* ── hero: a BRAND ENVIRONMENT, not a layout (product-site pass) ──────
   The Incogni lesson applied with GW's own world: full-bleed ink canvas,
   layered lime glows + grain (background = artwork), the dark scan panels
   floating on it. The page then hands off to light content sections —
   dark environment → light proof, dark panels carrying the product. */
.gwe .herodark{position:relative;overflow:hidden;background:#0b0d14;}
.gwe .herodark::before{content:"";position:absolute;inset:0;
  background:
    radial-gradient(1000px 480px at 8% -12%, rgba(132,204,22,.16), transparent 58%),
    radial-gradient(820px 460px at 96% 108%, rgba(101,163,13,.14), transparent 60%),
    radial-gradient(520px 300px at 78% -6%, rgba(132,204,22,.08), transparent 55%);}
.gwe .herodark::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.06;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");}
.gwe .herodark > *{position:relative;z-index:1;}
.gwe .herodark h1{color:#f4f5f7;}
.gwe .herodark .lede{color:#b9bec9;}
.gwe .herodark .lede a{color:#bef264;}
.gwe .herodark .kicker{color:#a3e635;}
.gwe .herodark .uln svg path{stroke:#a3e635;}

/* the real product, replicated live: the DoxxScan scanning card —
   dark-band variant: lighter charcoal + hard offset (near-black edge) */
.gwe .scanpanel{background:#141926;
  border:2px solid var(--gw-edge-d);border-radius:var(--gw-r);
  box-shadow:6px 6px 0 var(--gw-edge-d);padding:1.15rem 1.15rem 1rem;
  font-family:var(--gw-sans);min-width:0;max-width:100%;overflow:hidden;}
.gwe .scanpanel .sp-pill{display:flex;align-items:center;gap:.5rem;background:#161927;
  border:1px solid rgba(251,146,60,.35);border-radius:10px;padding:.5rem .8rem;
  font-size:.76rem;font-weight:700;letter-spacing:.06em;color:#fdba74;}
.gwe .scanpanel .sp-pill i{width:8px;height:8px;border-radius:50%;background:#fb923c;
  animation:gwePulse 1.4s ease-in-out infinite;}
@keyframes gwePulse{0%,100%{opacity:1}50%{opacity:.35}}
.gwe .scanpanel .sp-h{color:#f1f5f9;font-weight:800;font-size:1.06rem;text-align:center;
  margin:.85rem 0 .1rem;}
.gwe .scanpanel .sp-h em{font-style:normal;color:#a3e635;}
.gwe .scanpanel .sp-s{color:#8a90a0;font-size:.74rem;text-align:center;margin:0 0 .8rem;}
.gwe .scanpanel .sstep{display:flex;align-items:center;gap:.6rem;background:#0e1120;
  border:1px solid #1c2133;border-radius:10px;padding:.55rem .75rem;margin:.42rem 0;
  font-size:.8rem;color:#6b7080;transition:border-color .3s var(--gw-ease),color .3s var(--gw-ease);}
.gwe .scanpanel .sstep .n{flex:0 0 auto;width:20px;height:20px;border-radius:50%;
  background:#1c2133;color:#8a90a0;display:grid;place-items:center;font-size:.66rem;font-weight:800;
  transition:background .3s,color .3s;}
.gwe .scanpanel .sstep.on{border-color:rgba(132,204,22,.5);color:#d9f99d;}
.gwe .scanpanel .sstep.on .n{background:#84cc16;color:#0b0d14;}
.gwe .scanpanel .sstep.done{color:#9ca3af;}
.gwe .scanpanel .sstep.done .n{background:#2c3247;color:#a3e635;}
.gwe .scanpanel .sp-chips{display:flex;gap:.4rem;overflow:hidden;margin-top:.7rem;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.gwe .scanpanel .sp-chips span{flex:0 0 auto;background:#131728;border:1px solid #222842;
  color:#aab0c0;font-size:.66rem;font-weight:700;border-radius:7px;padding:.3rem .55rem;}
.gwe .scanpanel .sp-track{display:flex;gap:.4rem;animation:gweChips 22s linear infinite;}
@keyframes gweChips{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* two-column section split with brand art */
.gwe .split2{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px,3.5vw,48px);
  align-items:center;}
@media(max-width:820px){.gwe .split2{grid-template-columns:1fr;}}
.gwe .artimg{width:100%;max-width:360px;height:auto;border-radius:14px;
  box-shadow:var(--gw-sh2);justify-self:center;}
.gwe .artimg.dark{box-shadow:0 18px 44px rgba(0,0,0,.5);}

/* full-bleed tinted band for section alternation (cool slate tint) */
.gwe .band-tint{background:#e9edf1;border-top:1px solid #dbe0e6;border-bottom:1px solid #dbe0e6;}
/* dark trust footer — product sites end in the brand world */
.gwe .tfoot.dark{background:#0b0d14;border-top:0;color:#b9bec9;}
.gwe .tfoot.dark .brand{color:#f4f5f7;}
.gwe .tfoot.dark h4{color:#6b7080;}
.gwe .tfoot.dark a{color:#8a90a0;}
.gwe .tfoot.dark a:hover{color:#d9f99d;}
.gwe .tfoot.dark .fine{color:#6b7080;}
.gwe .hero{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);
  align-items:center;}
.gwe .hero > *{min-width:0;}  /* streaming chips must not inflate the column */
@media(max-width:880px){.gwe .hero{grid-template-columns:1fr;}}
.gwe .hero .sub{margin:.9rem 0 1.2rem;}
/* editorial ink underline on the money phrase */
.gwe .uln{position:relative;white-space:nowrap;}
.gwe .uln svg{position:absolute;left:0;right:0;bottom:-.14em;width:100%;height:.34em;
  overflow:visible;}
.gwe .uln svg path{fill:none;stroke:var(--gw-lime);stroke-width:3;stroke-linecap:round;
  opacity:.9;vector-effect:non-scaling-stroke;
  stroke-dasharray:1;stroke-dashoffset:1;animation:gweInk .9s var(--gw-ease) .5s forwards;}
@keyframes gweInk{to{stroke-dashoffset:0;}}

/* ── scroll reveal + motion craft (the WOW layer) ─────────────────────
   Opacity/transform only, 480ms, standard ease, staggered via --d. */
.gwe .rise{opacity:0;transform:translateY(14px);
  transition:opacity .48s var(--gw-ease),transform .48s var(--gw-ease);
  transition-delay:var(--d,0ms);}
.gwe .rise.in{opacity:1;transform:none;}
.gwe .no-io .rise{opacity:1;transform:none;}  /* JS-less fallback */
/* hover lifts — brutalist pattern: card slides up-left, offset shadow grows */
.gwe .pcell,.gwe .tstep,.gwe .rev,.gwe .ocard{
  transition:transform .2s var(--gw-ease),box-shadow .2s var(--gw-ease),
             opacity .48s var(--gw-ease);}
.gwe .pcell:hover,.gwe .tstep:hover,.gwe .rev:hover{transform:translate(-2px,-2px);
  box-shadow:7px 7px 0 var(--gw-edge);}
.gwe .ocard:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--gw-edge);}
.gwe .btn{will-change:transform;}
.gwe .btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--gw-edge);}
.gwe .btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--gw-edge);}
/* live report theater: rows type themselves in, then the scan line sweeps */
.gwe .pframe .rrow{opacity:0;transform:translateY(6px);}
.gwe .pframe.play .rrow{animation:gweRow .4s var(--gw-ease) forwards;}
.gwe .pframe.play .rrow:nth-child(1){animation-delay:.15s}
.gwe .pframe.play .rrow:nth-child(2){animation-delay:.55s}
.gwe .pframe.play .rrow:nth-child(3){animation-delay:.95s}
.gwe .pframe.play .rrow:nth-child(4){animation-delay:1.35s}
.gwe .pframe.play .rrow:nth-child(5){animation-delay:1.75s}
.gwe .pframe.play .rrow:nth-child(6){animation-delay:2.15s}
@keyframes gweRow{to{opacity:1;transform:none;}}
.gwe .pf-scan{position:relative;height:3px;background:var(--gw-hair);border-radius:2px;
  overflow:hidden;margin:.65rem .1rem .15rem;}
.gwe .pf-scan i{position:absolute;top:0;bottom:0;left:-30%;width:30%;border-radius:2px;
  background:var(--gw-lime);animation:gweScan 2.4s var(--gw-ease) infinite;}
@keyframes gweScan{0%{left:-30%}60%{left:100%}100%{left:100%}}
.gwe .pf-cap{font-size:.66rem;color:var(--gw-faint);padding:0 .1rem .2rem;}

/* scanbox — the hero product, now a dark scanner terminal:
   dark panel + hard offset, the email input stays white for contrast */
.gwe .scanbox{background:var(--gw-panel);border:2px solid var(--gw-edge);border-radius:var(--gw-r);
  box-shadow:var(--gw-off);padding:1.15rem 1.15rem 1rem;max-width:520px;}
.gwe .scanbox .sb-l{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gw-pmut);margin-bottom:.6rem;}
.gwe .scanbox form{display:flex;gap:.55rem;flex-wrap:wrap;}
.gwe .scanbox input{flex:1 1 220px;border:2px solid var(--gw-edge);border-radius:var(--gw-rs);
  padding:.78rem .9rem;font-size:.95rem;font-family:inherit;color:var(--gw-ink);background:#fff;}
.gwe .scanbox input::placeholder{color:var(--gw-faint);}
.gwe .btn{border:2px solid var(--gw-edge);cursor:pointer;background:var(--gw-lime);
  color:var(--gw-ink);font-weight:800;
  font-size:.95rem;font-family:inherit;padding:.78rem 1.15rem;border-radius:var(--gw-rs);
  box-shadow:3px 3px 0 var(--gw-edge);
  transition:background var(--gw-t) var(--gw-ease),transform 120ms var(--gw-ease),
             box-shadow 120ms var(--gw-ease);}
.gwe .btn:hover{background:var(--gw-lime-d);}
.gwe .btn[disabled]{opacity:.65;cursor:default;}
/* ghost buttons live on dark cards: light border, light text, flat */
.gwe .btn.ghost{background:transparent;border:2px solid var(--gw-pmut);color:var(--gw-ptxt);
  font-weight:600;box-shadow:none;}
.gwe .btn.ghost:hover{background:rgba(255,255,255,.07);border-color:var(--gw-ptxt);
  box-shadow:none;transform:none;}
.gwe .scanbox .sb-fine{margin:.65rem 0 0;}
.gwe .scanbox .sb-err{display:none;color:#fca5a5;font-size:.82rem;margin-top:.5rem;}

/* product frame (screenshot chrome) — light, sits on light sections only */
.gwe .pframe{background:var(--gw-card);border:1px solid var(--gw-hair);border-radius:12px;
  box-shadow:var(--gw-sh3);overflow:hidden;}
.gwe .pframe .pf-bar{display:flex;align-items:center;gap:.35rem;background:#eceff2;
  border-bottom:1px solid var(--gw-hair);padding:.5rem .75rem;}
.gwe .pframe .pf-bar i{width:9px;height:9px;border-radius:50%;background:var(--gw-hair2);}
.gwe .pframe .pf-bar span{font-size:.68rem;color:var(--gw-faint);margin-left:.4rem;}
.gwe .pframe .pf-body{padding:1rem;}
.gwe .rrow{display:flex;justify-content:space-between;align-items:center;gap:.6rem;
  border-bottom:1px solid var(--gw-hair);padding:.5rem .1rem;font-size:.84rem;}
.gwe .rrow:last-child{border-bottom:0;}
.gwe .rrow .k{color:var(--gw-body);font-weight:600;}
.gwe .badge{font-size:.66rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  padding:.18rem .5rem;border-radius:999px;}
.gwe .badge.ok{background:var(--gw-ok-bg);color:var(--gw-green-ink);}
.gwe .badge.sent{background:#eef1f6;color:#42506b;}
.gwe .badge.risk{background:var(--gw-danger-bg);color:var(--gw-danger);}

/* ── proof strip — dark stat panels, Space Grotesk numerals ─────────── */
.gwe .proof{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;}
.gwe .proof .pcell{background:var(--gw-panel);border:2px solid var(--gw-edge);
  border-radius:var(--gw-r);padding:1rem 1.1rem;box-shadow:var(--gw-off);}
.gwe .proof .pn{font-family:var(--gw-disp);font-size:clamp(24px,2.6vw,32px);font-weight:700;
  color:var(--gw-ptxt);font-variant-numeric:tabular-nums;letter-spacing:-.01em;}
.gwe .proof .pl{font-size:.8rem;color:var(--gw-pmut);margin-top:.15rem;}
.gwe .proof .ps{font-size:.68rem;color:var(--gw-faint);margin-top:.35rem;}

/* ── timeline — dark step panels ───────────────────────────────────── */
.gwe .tl{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;
  counter-reset:gwstep;}
.gwe .tl .tstep{background:var(--gw-panel);border:2px solid var(--gw-edge);
  border-radius:var(--gw-r);padding:1rem 1.05rem;box-shadow:var(--gw-off);position:relative;}
.gwe .tl .tstep::before{counter-increment:gwstep;content:counter(gwstep);
  display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;
  background:var(--gw-lime);color:var(--gw-edge);font-size:.72rem;font-weight:800;margin-bottom:.5rem;}
.gwe .tl .td{font-size:.7rem;font-weight:800;color:#a3e635;letter-spacing:.06em;
  text-transform:uppercase;margin-bottom:.2rem;}
.gwe .tl h3{font-size:.98rem;font-family:var(--gw-sans);font-weight:700;color:var(--gw-ptxt);}
.gwe .tl p{font-size:.84rem;color:var(--gw-pmut);margin:.3rem 0 0;}

/* ── outcomes + glyph system ───────────────────────────────────────────
   One proprietary illustration language (the Incogni/Optery lesson):
   duotone ink+lime geometric glyphs, grain-textured — the tile stays
   LIGHT on the dark outcome panel so the ink glyph shapes keep reading. */
.gwe .glyph{width:54px;height:54px;border-radius:14px;background:var(--gw-ok-bg);
  display:grid;place-items:center;margin-bottom:.7rem;position:relative;overflow:hidden;}
.gwe .glyph::after{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2'/%3E%3C/filter%3E%3Crect width='90' height='90' filter='url(%23n)'/%3E%3C/svg%3E");}
.gwe .glyph svg{width:32px;height:32px;}
.gwe .outcomes{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;}
.gwe .outcome{background:var(--gw-panel);border:2px solid var(--gw-edge);
  border-radius:var(--gw-r);padding:1.15rem 1.15rem 1.05rem;box-shadow:var(--gw-off);
  transition:transform .2s var(--gw-ease),box-shadow .2s var(--gw-ease),
             opacity .48s var(--gw-ease);}
.gwe .outcome:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--gw-edge);}
.gwe .outcome h3{font-family:var(--gw-sans);font-size:.98rem;font-weight:700;color:var(--gw-ptxt);}
.gwe .outcome p{font-size:.85rem;color:var(--gw-pmut);margin:.35rem 0 0;}

/* ── audience toggle + gamer (cyberpunk) mode ─────────────────────────
   Audience self-selection: [Everyone | For gamers]. Gamer mode re-skins
   the outcomes into GW's dark world with neon cyan/lime — tasteful:
   static scanlines, no pulsing, reduced-motion safe. */
.gwe .aud-toggle{display:inline-flex;background:var(--gw-card);border:1px solid var(--gw-hair2);
  border-radius:999px;padding:4px;gap:2px;margin:.2rem 0 .2rem;}
.gwe .aud-toggle button{border:0;background:transparent;cursor:pointer;font-family:inherit;
  font-size:.82rem;font-weight:700;color:var(--gw-mut);padding:.45rem 1rem;border-radius:999px;
  transition:background var(--gw-t) var(--gw-ease),color var(--gw-t) var(--gw-ease);}
.gwe .aud-toggle button.on{background:var(--gw-ink);color:#d9f99d;}
.gwe .outwrap{border-radius:18px;transition:background .35s var(--gw-ease);padding:0;}
.gwe .outwrap .gset{display:none;}
.gwe .outwrap .gset.on{display:block;}
.gwe .outwrap.gamer{background:#0b0d14;padding:clamp(18px,3vw,34px);position:relative;
  overflow:hidden;box-shadow:var(--gw-sh3);}
.gwe .outwrap.gamer::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;
  background:repeating-linear-gradient(0deg,transparent 0 3px,#22d3ee 3px 4px);}
.gwe .outwrap.gamer > *{position:relative;z-index:1;}
.gwe .outwrap.gamer .kicker{color:#22d3ee;letter-spacing:.18em;}
.gwe .outwrap.gamer h2{color:#eafcff;}
.gwe .outwrap.gamer .outcome{background:#151a24;border-color:rgba(34,211,238,.28);
  box-shadow:5px 5px 0 var(--gw-edge-d);}
.gwe .outwrap.gamer .outcome:hover{border-color:rgba(34,211,238,.55);
  box-shadow:7px 7px 0 var(--gw-edge-d);}
.gwe .outwrap.gamer .outcome h3{color:#e7f9ff;}
.gwe .outwrap.gamer .outcome p{color:#8a94a8;}
.gwe .outwrap.gamer .glyph{background:#0d1720;border:1px solid rgba(34,211,238,.25);}
.gwe .outwrap.gamer .gtag{display:inline-block;font-size:.62rem;font-weight:800;
  letter-spacing:.12em;text-transform:uppercase;color:#22d3ee;background:rgba(34,211,238,.1);
  border:1px solid rgba(34,211,238,.3);border-radius:5px;padding:.14rem .45rem;margin-bottom:.45rem;}

/* ── ink chapter band (Incogni annual-plan pattern) ──────────────────── */
.gwe .inkband{background:var(--gw-ink);border-radius:18px;color:#e7e9ee;
  position:relative;overflow:hidden;padding:clamp(28px,4vw,52px) clamp(22px,4vw,56px);
  display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center;
  box-shadow:var(--gw-sh3);}
@media(max-width:760px){.gwe .inkband{grid-template-columns:1fr;}}
.gwe .inkband::before{content:"";position:absolute;inset:0;
  background:radial-gradient(620px 320px at 88% 110%, rgba(132,204,22,.22), transparent 60%);}
.gwe .inkband::after{content:"";position:absolute;inset:0;opacity:.06;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");}
.gwe .inkband > *{position:relative;z-index:1;}
.gwe .inkband h2{color:#fff;}
.gwe .inkband p{color:#b9bec9;font-size:.92rem;max-width:480px;}
.gwe .inkband .art{display:grid;place-items:center;}
.gwe .inkband .art canvas{width:min(280px,64vw);height:min(280px,64vw);}

/* depth: tinted panel offset behind the offer (Optery layering).
   CONSCIOUSLY LEFT LIGHT: ink headline + fine print overlap this pseudo-
   element, so a dark backdrop would kill their contrast without a layout
   change. Cooled from warm green to slate to match the new paper. */
.gwe .depth{position:relative;}
.gwe .depth::before{content:"";position:absolute;inset:38px -14px -26px 30%;
  background:#e6eaef;border-radius:20px;z-index:0;}
.gwe .depth > *{position:relative;z-index:1;}

/* links inside dark panels: the paper green-ink link is illegible there —
   flip to light lime (matches herodark lede links) */
.gwe .scanbox a,.gwe .pcell a,.gwe .tstep a,.gwe .outcome a,
.gwe .rev a,.gwe details a,.gwe .ocard a:not(.btn){color:#bef264;}

/* ── offer ─────────────────────────────────────────────────────────── */
.gwe .offer{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:860px;margin:0 auto;}
@media(max-width:720px){.gwe .offer{grid-template-columns:1fr;}}
.gwe .ocard{background:var(--gw-panel);border:2px solid var(--gw-edge);border-radius:var(--gw-r);
  padding:1.4rem 1.3rem;box-shadow:var(--gw-off);color:#ccd2dc;}
.gwe .ocard.lead{border-color:var(--gw-lime-d);}
.gwe .oprice{font-family:var(--gw-disp);font-size:34px;font-weight:700;color:var(--gw-ptxt);
  letter-spacing:-.02em;}
.gwe .oprice small{font-size:.82rem;font-weight:600;color:var(--gw-pmut);margin-left:.35rem;}
.gwe .ocard ul{list-style:none;margin:.8rem 0 1rem;padding:0;}
.gwe .ocard li{font-size:.87rem;padding:.3rem 0 .3rem 1.4rem;position:relative;}
.gwe .ocard li::before{content:"✓";position:absolute;left:.1rem;color:var(--gw-lime);
  font-weight:800;}
.gwe .btn.block{display:block;width:100%;text-align:center;}

/* ── reviews (Trustpilot strip, Incogni pattern) / faq / footer ─────── */
.gwe .revstrip{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
  padding:.2rem .2rem .8rem;-webkit-overflow-scrolling:touch;
  scrollbar-width:thin;scrollbar-color:var(--gw-hair2) transparent;}
.gwe .rev{flex:0 0 min(300px,82vw);scroll-snap-align:start;background:var(--gw-panel);
  border:2px solid var(--gw-edge);border-radius:var(--gw-r);
  padding:1.05rem 1.1rem;box-shadow:var(--gw-off);display:flex;flex-direction:column;}
.gwe .rev q{font-family:var(--gw-sans);font-size:.93rem;color:var(--gw-ptxt);line-height:1.5;
  quotes:"\201C" "\201D";flex:1 1 auto;}
.gwe .rev .who{font-size:.76rem;color:var(--gw-pmut);margin-top:.7rem;font-weight:600;}
.gwe .tp-stars{display:flex;gap:2px;margin-bottom:.55rem;}
.gwe .tp-stars i{width:16px;height:16px;background:#00b67a;display:grid;place-items:center;
  color:#fff;font-size:10px;font-style:normal;}
.gwe .tp-stars i::before{content:"\2605";}
.gwe .tp-line{display:flex;align-items:center;gap:.45rem;font-size:.8rem;color:var(--gw-mut);
  margin-top:.4rem;}
.gwe .tp-line .tpmark{color:#00b67a;font-weight:800;}
.gwe details{background:var(--gw-panel);border:2px solid var(--gw-edge);border-radius:var(--gw-r);
  box-shadow:var(--gw-off);padding:.85rem 1rem;margin-bottom:.75rem;max-width:760px;}
.gwe summary{font-weight:700;font-size:.92rem;color:var(--gw-ptxt);cursor:pointer;}
.gwe details p{font-size:.87rem;color:#b8bfc9;margin:.55rem 0 0;}
.gwe .tfoot{border-top:1px solid var(--gw-hair);background:var(--gw-card);
  padding:2.2rem 0 2.6rem;margin-top:1rem;}
.gwe .tfoot .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:1.6rem;font-size:.84rem;}
@media(max-width:760px){.gwe .tfoot .cols{grid-template-columns:1fr 1fr;}}
.gwe .tfoot h4{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gw-faint);margin:0 0 .5rem;}
.gwe .tfoot a{display:block;color:var(--gw-mut);padding:.14rem 0;}

/* motion discipline */
@media(prefers-reduced-motion:reduce){
  .gwe *,.gwe *::before,.gwe *::after{animation:none!important;transition:none!important;}
}

/* ── engine pipeline (the 15 seconds, dramatized) ─────────────────────
   Full-bleed ink band; five nodes under an animated data-flow rail. A
   lime packet travels the rail; nodes light as it passes. Reduced-motion
   renders everything static and lit. */
.gwe .pipeband{background:#0b0d14;position:relative;overflow:hidden;}
.gwe .pipeband::before{content:"";position:absolute;inset:0;
  background:radial-gradient(800px 400px at 50% -20%, rgba(132,204,22,.10), transparent 60%);}
.gwe .pipeband::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");}
.gwe .pipeband > *{position:relative;z-index:1;}
.gwe .pipeflow{position:relative;height:3px;margin:1.6rem 0 1.2rem;border-radius:2px;
  background:repeating-linear-gradient(90deg,#242a3d 0 10px,transparent 10px 18px);}
.gwe .pipeflow i{position:absolute;top:50%;left:0;width:10px;height:10px;margin-top:-5px;
  border-radius:50%;background:#a3e635;box-shadow:0 0 12px rgba(163,230,53,.8);
  animation:gwePacket 6s linear infinite;}
@keyframes gwePacket{0%{left:0;opacity:0}6%{opacity:1}94%{opacity:1}100%{left:calc(100% - 10px);opacity:0}}
.gwe .pipe{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;}
/* nodes sit on the ink band already — lighter charcoal + hard offset */
.gwe .pnode{background:var(--gw-panel-2);border:2px solid var(--gw-edge-d);border-radius:var(--gw-r);
  box-shadow:5px 5px 0 var(--gw-edge-d);
  padding:1rem 1rem .9rem;transition:transform .2s var(--gw-ease),border-color .2s var(--gw-ease),
  box-shadow .2s var(--gw-ease),opacity .48s var(--gw-ease);}
.gwe .pnode:hover{transform:translate(-2px,-2px);border-color:rgba(163,230,53,.45);
  box-shadow:7px 7px 0 var(--gw-edge-d);}
.gwe .pnode .pn-n{display:inline-grid;place-items:center;width:22px;height:22px;
  border-radius:50%;background:#a3e635;color:#0b0d14;font-size:.72rem;font-weight:800;
  margin-bottom:.55rem;}
.gwe .pnode h3{font-family:var(--gw-sans);font-size:.92rem;font-weight:700;color:#e7e9ee;}
.gwe .pnode p{font-size:.78rem;line-height:1.5;color:#8a90a0;margin:.35rem 0 0;}
@media(prefers-reduced-motion:reduce){.gwe .pipeflow i{animation:none;left:calc(50% - 5px);}}

/* globe terminal feed — one line, cyber register, never a text pile */
.gwe .globefeed{margin-top:.8rem;text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:.72rem;font-weight:700;letter-spacing:.09em;color:#a3e635;min-height:1.2em;
  text-transform:uppercase;transition:color .3s var(--gw-ease);}
.gwe .gf-caret{display:inline-block;width:7px;height:12px;background:currentColor;
  margin-left:5px;vertical-align:-1px;animation:gweCaret 1s steps(1) infinite;}
@keyframes gweCaret{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.gwe .gf-caret{animation:none;}}
