/* ==========================================================================
   FILE      assets/edgelit.css            VERSION  R02  (2026-10-23)
   The EdgelitCV theme. R01 was the draft site's sheet; R02 adds the fonts
   served from this site (no call to Google), and the pre-launch page's
   parts at the foot: the build demonstration, the price cards, the
   register-your-interest form and the privacy notice's prose.
   Layout: one centred column (1120 max) on midnight navy; edge-lit panels
   mark the moments that matter.
   ========================================================================== */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-tight-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-tight-latin-600-normal.woff2) format("woff2")}
:root{
  --bg:#101826; --panel:#162133; --panel-2:#1B2840; --ink:#EEF3FB; --ink-2:#C9D4E6; --mute:#A8B5CB;
  --line:rgba(220,232,255,.14); --edge:#DCE8FF; --edge-a:rgba(220,232,255,.8);
  --glow:rgba(220,232,255,.26); --glow-in:rgba(220,232,255,.07); --sweep:rgba(220,232,255,.16);
  --btn-ink:#06122B; --seg1:#DCE8FF; --seg2:#9FB4D6; --seg3:#6E86AE; --seg4:#46597E;
  --f-head:"Inter Tight", Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-body:Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --gut-l:max(16px, env(safe-area-inset-left, 0px)); --gut-r:max(16px, env(safe-area-inset-right, 0px));
  color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--f-body);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top, 0px);z-index:30;background:var(--bg)}
a{color:var(--edge)} a:hover{color:#FFFFFF}
:focus-visible{outline:2px solid var(--edge);outline-offset:3px;border-radius:4px}
.wrap{max-width:1120px;margin:0 auto;padding-left:var(--gut-l);padding-right:var(--gut-r)}
h1,h2,h3{font-family:var(--f-head);font-weight:600;letter-spacing:-.02em;text-wrap:balance;margin:0;color:#FFFFFF}
h1{font-size:clamp(2rem, 1.3rem + 2.6vw, 3.1rem);line-height:1.1}
h2{font-size:clamp(1.5rem, 1.15rem + 1.3vw, 2.1rem);line-height:1.15}
h3{font-size:1.15rem;line-height:1.3}
p{margin:0;max-width:64ch;color:var(--ink-2)}
.eyebrow{font:500 .75rem/1.4 var(--f-body);letter-spacing:.2em;text-transform:uppercase;color:var(--mute)}

/* Draft notice */
.draft{background:#0B1220;border-bottom:1px solid var(--line);font-size:.8rem;color:var(--mute)}
.draft .wrap{padding-block:8px;display:flex;gap:10px;flex-wrap:wrap}
.draft b{color:var(--edge);font-weight:600;letter-spacing:.16em}

/* Header and menu */
header.nav{position:sticky;top:env(safe-area-inset-top, 0px);z-index:20;background:rgba(16,24,38,.94);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header.nav .wrap{height:68px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;min-height:44px}
.brand img{display:block;height:40px;width:auto}
@media (max-width:900px){.brand img{height:22px}}
.nav-links{display:flex;gap:30px;align-items:center}
.nav-links a{font:500 .8rem/1 var(--f-body);letter-spacing:.18em;text-transform:uppercase;color:var(--ink);text-decoration:none;padding:14px 0}
.nav-links a:hover,.nav-links a[aria-current="page"]{color:#FFFFFF;text-shadow:0 0 12px rgba(220,232,255,.65)}
.nav-burger{display:none;background:none;border:0;width:44px;height:44px;padding:0;cursor:pointer;align-items:center;justify-content:center}
@media (max-width:900px){
  .nav-burger{display:inline-flex}
  .nav-links{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;
    background:var(--panel);border-bottom:1px solid var(--line);padding:8px var(--gut-r) 14px var(--gut-l);box-shadow:0 18px 30px rgba(0,0,0,.35)}
  .nav-links.open{display:flex}
  .nav-links a{padding:16px 0;border-bottom:1px solid var(--line);font-size:.85rem}
  .nav-links a:last-child{border-bottom:0}
}
/* ==========================================================================
   EdgelitCV menu icon: the rim-lit CV page replaces the burger glyph.

   The page's three text lines ARE the burger's three bars, so it still reads
   as a menu. Open, they fold into an X inside the page, and a single edge
   strobe runs round the rim, clockwise from the bottom-left as in the logo.

   Nothing else changes. The button keeps id="navBurger", class "nav-burger",
   aria-expanded and aria-label, so assets/aes.js still opens the menu, the
   mouseover atom still circles, collapses and explodes on a click, and the
   AES sound plays exactly as on AES. No script is added.

   Load after the site's nav stylesheet.
   ========================================================================== */

.nav-burger.ec-menu {
  --ec-navy:  #0E1F3D;   /* page fill */
  --ec-edge:  #2A4470;   /* unlit page edge */
  --ec-white: #F2F7FF;   /* rim light, heading line */
  --ec-ice:   #A9D2FF;   /* glow */
  --ec-steel: #8FA3C0;   /* body lines */
  line-height: 0;        /* the old glyph's line box no longer sets the height */
  color: var(--ec-white);
}
.nav-burger.ec-menu:focus-visible {
  outline: 2px solid var(--ec-ice);
  outline-offset: 2px;
  border-radius: 6px;
}

.ec-doc { display: block; width: 20px; height: 28px; margin: auto; overflow: visible; }

/* The page */
.ec-doc .ec-page { fill: var(--ec-navy); stroke: var(--ec-edge); stroke-width: 1; stroke-linejoin: round; }
.ec-doc .ec-fold { fill: none; stroke: var(--ec-edge); stroke-width: 1; stroke-linejoin: round; }

/* The rim light, as on the logo: across the top to the fold, down the right edge, along the foot */
.ec-doc .ec-rim, .ec-doc .ec-rim-glow { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ec-doc .ec-rim      { stroke: var(--ec-white); stroke-width: 1.3; opacity: .85; transition: opacity .2s ease; }
.ec-doc .ec-rim-glow { stroke: var(--ec-ice);   stroke-width: 3.4; opacity: .28; transition: opacity .2s ease; }

/* The three lines: a bright heading line, two body lines */
.ec-doc .ec-l {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .3s cubic-bezier(.2, .7, .2, 1), opacity .2s ease, fill .2s ease;
}
.ec-doc .ec-l1 { fill: var(--ec-white); }
.ec-doc .ec-l2, .ec-doc .ec-l3 { fill: var(--ec-steel); }

/* Hover and keyboard focus: the rim brightens */
.nav-burger.ec-menu:hover .ec-rim,      .nav-burger.ec-menu:focus-visible .ec-rim      { opacity: 1; }
.nav-burger.ec-menu:hover .ec-rim-glow, .nav-burger.ec-menu:focus-visible .ec-rim-glow { opacity: .5; }
.nav-burger.ec-menu:hover .ec-l2,       .nav-burger.ec-menu:hover .ec-l3               { fill: var(--ec-white); }

/* Open: the lines fold into an X at the centre of the page (10, 15) */
.nav-burger.ec-menu[aria-expanded="true"] .ec-l1 { transform: translate(1.25px, 4.35px) rotate(45deg) scale(1.54, .85); fill: var(--ec-white); }
.nav-burger.ec-menu[aria-expanded="true"] .ec-l2 { transform: scaleX(.2); opacity: 0; }
.nav-burger.ec-menu[aria-expanded="true"] .ec-l3 { transform: translate(0, -4.4px) rotate(-45deg) scale(1.11, 1); fill: var(--ec-white); }
.nav-burger.ec-menu[aria-expanded="true"] .ec-rim      { opacity: 1; }
.nav-burger.ec-menu[aria-expanded="true"] .ec-rim-glow { opacity: .55; }

/* One edge strobe round the whole page each time the menu opens */
.ec-doc .ec-strobe path { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 16 84; opacity: 0; }
.ec-doc .ec-strobe .ec-s-core { stroke: #FFFFFF;      stroke-width: 1.6; }
.ec-doc .ec-strobe .ec-s-glow { stroke: var(--ec-ice); stroke-width: 4;  }
.nav-burger.ec-menu[aria-expanded="true"] .ec-strobe .ec-s-core { animation: ecStrobe .6s cubic-bezier(.3, .1, .3, 1) 1; }
.nav-burger.ec-menu[aria-expanded="true"] .ec-strobe .ec-s-glow { animation: ecStrobeGlow .6s cubic-bezier(.3, .1, .3, 1) 1; }
@keyframes ecStrobe {
  0%   { stroke-dashoffset: 100; opacity: 0; }
  12%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { stroke-dashoffset: 0;   opacity: 0; }
}
@keyframes ecStrobeGlow {
  0%   { stroke-dashoffset: 100; opacity: 0; }
  12%  { opacity: .45; }
  85%  { opacity: .45; }
  100% { stroke-dashoffset: 0;   opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .ec-doc .ec-l { transition: none; }
  .nav-burger.ec-menu[aria-expanded="true"] .ec-strobe path { animation: none; }
}


/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 22px;border-radius:8px;border:0;
  background:var(--edge);color:var(--btn-ink);font:600 .95rem/1 var(--f-body);text-decoration:none;cursor:pointer;
  box-shadow:0 0 0 1px rgba(220,232,255,.35),0 0 22px rgba(220,232,255,.22);transition:box-shadow .2s ease, transform .2s ease}
.btn:hover{color:var(--btn-ink);box-shadow:0 0 0 1px rgba(220,232,255,.6),0 0 30px rgba(220,232,255,.45)}
.btn.ghost{background:transparent;color:var(--edge);box-shadow:inset 0 0 0 1px var(--edge-a)}
.btn.ghost:hover{color:#FFFFFF;box-shadow:inset 0 0 0 1px var(--edge),0 0 22px rgba(220,232,255,.3)}
.textlink{font-weight:500;text-underline-offset:4px}

/* Edge-lit panel: the theme's cool white edge with a slow left-to-right sweep */
.lit{position:relative;border-radius:12px;border:1px solid var(--edge-a);background:var(--panel);
  box-shadow:0 0 0 1px rgba(220,232,255,.18),0 0 32px var(--glow),inset 0 0 22px var(--glow-in)}
.lit > *{position:relative}
.lit > .sweep{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.lit > .sweep::before{content:"";position:absolute;top:0;bottom:0;left:0;width:40%;
  background:linear-gradient(90deg,transparent,var(--sweep),transparent);animation:sweep 3.8s cubic-bezier(.45,0,.25,1) infinite}
@keyframes sweep{0%{transform:translateX(-60%);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateX(230%);opacity:0}}

/* Sections */
main section{padding-block:clamp(48px, 7vw, 88px)}
main section + section{border-top:1px solid var(--line)}
.stack{display:flex;flex-direction:column;gap:18px}

/* Hero */
.hero{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,48px);align-items:center}
.hero .lit{padding:clamp(24px,3.2vw,40px);display:flex;flex-direction:column;gap:18px}
.hero .lede{font-size:1.06rem;color:var(--ink-2)}
.cta{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.small{font-size:.86rem;color:var(--mute)}
.reel{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#07122A;aspect-ratio:16/9;max-width:100%}
.reel video{display:block;width:100%;height:100%;object-fit:cover}
.reel button{position:absolute;right:12px;bottom:12px;min-height:40px;padding:0 16px;border-radius:20px;border:1px solid var(--edge-a);
  background:rgba(7,18,42,.75);color:var(--ink);font:500 .82rem/1 var(--f-body);letter-spacing:.06em;cursor:pointer}
.reel button:hover{background:rgba(22,33,51,.95);color:#FFFFFF}
@media (max-width:900px){.hero{grid-template-columns:minmax(0,1fr)} .reel{order:-1}}

/* Why section: the argument, its figures and their sources */
.big-lede{font:600 clamp(1.2rem, 1rem + .8vw, 1.5rem)/1.35 var(--f-head);color:#FFFFFF;max-width:40ch}
.stats{list-style:none;margin:6px 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:980px}
.stats li{display:flex;flex-direction:column;gap:6px;padding:20px 22px;border-left:1px solid var(--edge-a);min-width:0}
.stats b{font:600 clamp(1.9rem, 1.5rem + 1.2vw, 2.5rem)/1 var(--f-head);color:#FFFFFF;font-variant-numeric:tabular-nums;
  text-shadow:0 0 18px rgba(220,232,255,.35)}
.stats span{font-size:.95rem;color:var(--ink-2)}
sup{font-size:.7em;line-height:0} sup a{text-decoration:none}
.pull{font:600 clamp(1.15rem, 1rem + .6vw, 1.4rem)/1.4 var(--f-head);color:#FFFFFF;max-width:46ch;padding-left:18px;
  border-left:2px solid var(--edge);box-shadow:-10px 0 18px -12px rgba(220,232,255,.6)}
.ethos{font-style:italic;color:var(--edge)}
.sources{margin:8px 0 0;padding-left:1.4em;font-size:.8rem;color:var(--mute);display:flex;flex-direction:column;gap:4px;max-width:80ch}
.sources a{color:var(--mute);text-underline-offset:3px} .sources a:hover{color:var(--edge)}
@media (max-width:760px){.stats{grid-template-columns:minmax(0,1fr)} .stats li{padding:14px 16px}}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;counter-reset:s}
.steps li{counter-increment:s;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px 22px 22px 66px;position:relative;min-width:0}
.steps li::before{content:counter(s);position:absolute;left:20px;top:20px;width:30px;height:30px;border-radius:50%;
  border:1px solid var(--edge-a);display:grid;place-items:center;font:600 .85rem/1 var(--f-head);color:var(--edge);
  box-shadow:0 0 14px rgba(220,232,255,.25)}
.steps h3{margin-bottom:6px}
@media (max-width:700px){.steps{grid-template-columns:minmax(0,1fr)}}

/* Rubric */
.bar{display:flex;height:22px;border-radius:6px;overflow:hidden;border:1px solid var(--line);max-width:760px}
.bar span{display:block;height:100%}
.legend{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;max-width:760px}
.legend li{display:flex;flex-direction:column;gap:2px;padding-left:16px;position:relative;font-size:.92rem;color:var(--ink-2)}
.legend li::before{content:"";position:absolute;left:0;top:6px;width:9px;height:9px;border-radius:2px;background:var(--c)}
.legend b{font:600 1.5rem/1.1 var(--f-head);color:#FFFFFF;font-variant-numeric:tabular-nums}
@media (max-width:560px){.legend{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Tier cards */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tier{display:flex;flex-direction:column;gap:10px;padding:24px;border-radius:12px;background:var(--panel);border:1px solid var(--line);
  color:var(--ink-2);text-decoration:none;min-width:0;transition:border-color .2s ease, box-shadow .2s ease}
.tier:hover,.tier:focus-visible{color:var(--ink-2);border-color:var(--edge-a);box-shadow:0 0 0 1px rgba(220,232,255,.18),0 0 28px var(--glow)}
.tier .price{margin-top:auto;padding-top:10px;font:600 1rem/1.3 var(--f-head);color:#FFFFFF}
.tier .more{font-size:.86rem;color:var(--edge)}
@media (max-width:820px){.tiers{grid-template-columns:minmax(0,1fr)}}

/* Tier pages */
.two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.box{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:24px;min-width:0}
.box ul{margin:12px 0 0;padding-left:1.1em;display:flex;flex-direction:column;gap:8px;color:var(--ink-2)}
@media (max-width:760px){.two{grid-template-columns:minmax(0,1fr)}}
.facts{display:flex;flex-wrap:wrap;gap:10px 28px;color:var(--ink-2)}
.facts b{color:#FFFFFF;font-weight:600}

/* Comparison table */
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--panel)}
table{border-collapse:collapse;width:100%;min-width:680px;font-size:.95rem}
th,td{text-align:left;vertical-align:top;padding:14px 18px;border-bottom:1px solid var(--line)}
thead th{font:600 1rem/1.3 var(--f-head);color:#FFFFFF}
thead th a{color:#FFFFFF;text-decoration:none} thead th a:hover{text-shadow:0 0 12px rgba(220,232,255,.65)}
tbody th{font-weight:500;color:var(--mute);width:24%}
td{color:var(--ink-2)}
tr:last-child th,tr:last-child td{border-bottom:0}
ul.ticks{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:8px;color:var(--ink-2);max-width:70ch}

/* Sign-in */
.signin{max-width:440px;display:flex;flex-direction:column;gap:14px}
.signin .btn{width:100%}
.or{display:flex;align-items:center;gap:12px;color:var(--mute);font-size:.85rem}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
label{font-weight:500;color:var(--ink)}
input[type=email]{width:100%;min-height:46px;padding:0 14px;border-radius:8px;border:1px solid var(--edge-a);background:var(--bg);color:var(--ink);font:400 1rem var(--f-body)}
.status{min-height:1.6em;color:var(--edge);font-size:.92rem}

/* Disclosure and footer */
.disclose{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.disclose .wrap{padding-block:22px}
.disclose p{max-width:none;font-size:.92rem;color:var(--ink-2)}
.disclose b{color:#FFFFFF;font-weight:600}
footer .wrap{padding-block:32px 40px;display:flex;flex-direction:column;gap:14px}
footer p{font-size:.84rem;color:var(--mute);max-width:none}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.84rem;color:var(--mute)}

@media (prefers-reduced-motion:reduce){.lit > .sweep::before{animation:none;opacity:0}.btn,.tier{transition:none}}

/* ==========================================================================
   PRE-LAUNCH PAGE  (R02)
   ========================================================================== */

/* If the splash script never runs (blocked, or failed to load), the navy
   cover still gets out of the way on its own after 16 s. The script lifts it
   long before this, so on a working page this rule never shows. */
#aesSplash{animation:elSplashFailsafe 0s linear 16s forwards}
@keyframes elSplashFailsafe{to{visibility:hidden;pointer-events:none}}

main section[id]{scroll-margin-top:84px}
.nav-links a.nav-cta{padding:11px 18px;border:1px solid var(--edge-a);border-radius:22px}
.nav-links a.nav-cta:hover{box-shadow:0 0 18px rgba(220,232,255,.28)}
@media (max-width:900px){.nav-links a.nav-cta{border:0;border-radius:0;padding:16px 0}}

/* "Opening soon" */
.soon{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;padding:6px 14px 6px 11px;border-radius:999px;
  border:1px solid var(--edge-a);background:rgba(220,232,255,.05);font:500 .72rem/1.2 var(--f-body);letter-spacing:.18em;
  text-transform:uppercase;color:var(--edge)}
.soon i{width:8px;height:8px;border-radius:50%;background:var(--edge);box-shadow:0 0 10px 2px rgba(220,232,255,.7);
  animation:soonPulse 2.4s ease-in-out infinite}
@keyframes soonPulse{0%,100%{opacity:1}50%{opacity:.35}}

/* How we check: the words beside a build, shown as the customer will see it */
.check{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4.5vw,56px);align-items:start}
.check > .stack{gap:20px}
@media (max-width:900px){.check{grid-template-columns:minmax(0,1fr)}}
.build{padding:clamp(18px,2.4vw,26px);display:flex;flex-direction:column;gap:14px}
.build-head{display:flex;justify-content:space-between;align-items:baseline;gap:6px 12px;flex-wrap:wrap}
.build-head .tag{font-size:.78rem;color:var(--mute)}
.stages{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.stages li{--sw1:220,232,255;--swp:242,247,255;position:relative;overflow:hidden;padding:12px 14px 12px 42px;border:1px solid var(--line);
  border-radius:8px;background:var(--panel-2);color:var(--mute);font-size:.94rem;line-height:1.4;transition:color .3s ease}
.stages li::before{content:"";position:absolute;left:15px;top:50%;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;
  border:2px solid rgba(220,232,255,.22);transition:background .3s ease,border-color .3s ease}
.stages li.done{color:var(--ink-2)}
.stages li.done::before{border-color:var(--edge);background:var(--edge)}
.stages li.now{color:#FFFFFF;border-color:rgba(var(--swp),.85);background:rgba(var(--sw1),.12);animation:edgeStrobe 1.6s linear infinite}
.stages li.now::before{border-color:rgb(var(--swp));background:#F2F8FF;box-shadow:0 0 6px 2px rgba(var(--swp),.9),0 0 16px 5px rgba(var(--sw1),.6)}
.stages .band{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;display:none}
.stages li.now .band{display:block}
.stages .band i{position:absolute;top:0;bottom:0;left:0;width:40%;mix-blend-mode:screen;
  background:linear-gradient(90deg,transparent 0%,rgba(var(--sw1),.24) 26%,rgba(var(--swp),.55) 50%,rgba(var(--sw1),.24) 74%,transparent 100%);
  animation:band 1.6s cubic-bezier(.45,.05,.35,1) infinite}
/* The edge flashes twice, sharply, as each pass begins, then holds lit */
@keyframes edgeStrobe{
  0%{border-color:rgba(var(--swp),1);box-shadow:0 0 0 1px rgba(var(--swp),1),0 0 30px rgba(var(--sw1),.9),inset 0 0 24px rgba(var(--sw1),.35)}
  5%{border-color:rgba(var(--sw1),.6);box-shadow:0 0 0 1px rgba(var(--sw1),.4),0 0 10px rgba(var(--sw1),.3),inset 0 0 10px rgba(var(--sw1),.1)}
  10%{border-color:rgba(var(--swp),1);box-shadow:0 0 0 1px rgba(var(--swp),1),0 0 30px rgba(var(--sw1),.9),inset 0 0 24px rgba(var(--sw1),.35)}
  22%,100%{border-color:rgba(var(--sw1),.75);box-shadow:0 0 0 1px rgba(var(--sw1),.5),0 0 14px rgba(var(--sw1),.35),inset 0 0 12px rgba(var(--sw1),.14)}
}
@keyframes band{from{transform:translateX(-50%)}to{transform:translateX(200%)}}
.key{display:flex;flex-wrap:wrap;gap:8px 16px;font-size:.8rem;color:var(--mute)}
.key span{display:inline-flex;align-items:center;gap:7px}
.key b{width:22px;height:8px;border-radius:9px;display:inline-block}
.key .k-w{background:#3E7BF5}.key .k-1{background:#2FD27E}.key .k-2{background:#FF8A2B}.key .k-p{background:#DCE8FF}
.report{padding:12px 14px;border-radius:8px;border:1px dashed rgba(220,232,255,.22);color:var(--mute);font-size:.9rem;line-height:1.45;
  transition:color .4s ease,border-color .4s ease,box-shadow .4s ease}
.report b{color:inherit;font-weight:600}
.report.ready{border-style:solid;border-color:var(--edge-a);color:#FFFFFF;box-shadow:0 0 22px rgba(220,232,255,.18)}
.bar .s1{width:60%;background:var(--seg1)}.bar .s2{width:15%;background:var(--seg2)}.bar .s3{width:15%;background:var(--seg3)}.bar .s4{width:10%;background:var(--seg4)}
.legend .l1{--c:var(--seg1)}.legend .l2{--c:var(--seg2)}.legend .l3{--c:var(--seg3)}.legend .l4{--c:var(--seg4)}

/* Price cards: each one is a link to the register box, with its tier chosen */
.tier .amount{font:600 clamp(2.3rem, 1.9rem + 1.2vw, 2.9rem)/1 var(--f-head);color:#FFFFFF;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;text-shadow:0 0 18px rgba(220,232,255,.25)}
.tier .amount small{margin-left:8px;font:500 .78rem/1.3 var(--f-body);letter-spacing:0;color:var(--mute);text-shadow:none}
.tier h3{color:#FFFFFF}
.tier ul{margin:2px 0 0;padding-left:1.1em;display:flex;flex-direction:column;gap:7px;font-size:.93rem;color:var(--ink-2)}
.tier .more{margin-top:auto;padding-top:10px;font-weight:500}
.tier .more::after{content:" \2192"}
.fine{font-size:.88rem;color:var(--mute)}

/* Register your interest */
.register{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,4vw,52px);padding:clamp(24px,3.6vw,44px)}
.register > .stack{gap:16px}
@media (max-width:860px){.register{grid-template-columns:minmax(0,1fr)}}
.register form{display:flex;flex-direction:column;gap:18px;min-width:0}
.field{display:flex;flex-direction:column;gap:7px}
.field .opt{font-weight:400;color:var(--mute)}
input[type=email],input[type=text]{width:100%;min-height:48px;padding:0 14px;border-radius:8px;border:1px solid var(--edge-a);
  background:var(--bg);color:var(--ink);font:400 1rem var(--f-body)}
input[type=email]:focus,input[type=text]:focus{outline:none;border-color:#FFFFFF;box-shadow:0 0 0 1px #FFFFFF,0 0 18px rgba(220,232,255,.3)}
input::placeholder{color:#7F8DA6}
fieldset.chips{border:0;margin:0;padding:0;min-width:0}
fieldset.chips legend{padding:0;margin-bottom:9px;font-weight:500;color:var(--ink)}
.chips .opts{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;display:inline-flex}
.chip input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.chip span{display:inline-flex;align-items:center;gap:6px;min-height:42px;padding:0 15px;border-radius:999px;border:1px solid rgba(220,232,255,.24);
  color:var(--ink-2);font-size:.9rem;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,color .2s ease,background .2s ease}
.chip span em{font-style:normal;color:var(--mute)}
.chip:hover span{border-color:var(--edge-a);color:#FFFFFF}
.chip input:checked + span{border-color:var(--edge);background:rgba(220,232,255,.09);color:#FFFFFF;box-shadow:0 0 14px rgba(220,232,255,.25)}
.chip input:checked + span em{color:var(--ink-2)}
.chip input:focus-visible + span{outline:2px solid var(--edge);outline-offset:3px}
.consent{display:flex;gap:12px;align-items:flex-start;font-weight:400;font-size:.93rem;color:var(--ink-2);cursor:pointer}
.consent input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:#DCE8FF;cursor:pointer}
.hp{position:absolute!important;left:-10000px!important;top:auto;width:1px;height:1px;overflow:hidden}
.form-status{min-height:1.5em;margin:0;font-size:.95rem;color:var(--edge)}
.form-status.err{color:#FFC2B8}
.register button.btn{align-self:flex-start}
.register button.btn[disabled]{opacity:.65;cursor:progress}
.thanks{display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:10px;border:1px solid var(--edge-a);
  background:rgba(220,232,255,.05);box-shadow:inset 0 0 22px var(--glow-in)}
.thanks h3{font-size:1.3rem}
.preview-note{font-size:.82rem;color:var(--mute)}

/* Privacy notice and other prose pages */
.prose{max-width:74ch;display:flex;flex-direction:column;gap:14px}
.prose h2{margin-top:22px;font-size:clamp(1.2rem, 1.1rem + .4vw, 1.4rem)}
.prose p{max-width:none}
.prose ul{margin:0;padding-left:1.2em;display:flex;flex-direction:column;gap:7px;color:var(--ink-2)}
.prose .meta{font-size:.88rem;color:var(--mute)}

/* Footer links */
.foot-links a{color:var(--mute);text-underline-offset:3px}
.foot-links a:hover{color:var(--edge)}

@media (prefers-reduced-motion:reduce){
  .soon i,.stages li.now,.stages .band i{animation:none}
  .chip span,.report{transition:none}
}