/* Carnival 12 Ai — site styles v2, "Neon Midway". Glass, liquid light and depth, drawn from the studio's Apple Glass game UI language. Tokens mirror the design system (tokens.json). */
/* Ported from the reference (source/src/styles.css). Changes: the design tokens are imported from packages/tokens (generated
   from tokens.json) instead of typed into :root, and the shadow and glow values the reference typed out are those tokens;
   the font stacks are tokens.json's type.families, which outrank the reference :root (its display stack also listed
   "Helvetica Neue Condensed", a fallback that only applies if the self-hosted font fails); the fonts are self-hosted files
   instead of inlined data; the reference's inline style attributes are classes at the end of this file (CSP style-src
   'self'); the header carries the phone. */
/* Generated by packages/tokens from _handoff/design-system/tokens.json with packages/tokens/src/brand.json. Do not edit: change the source and rebuild. */
:root{
  /* color */
  --void-950:#070918;
  --night-900:#0F1235;
  --night-800:#181C4A;
  --night-700:#232863;
  --night-line:#343A82;
  --night-line-strong:#6A71C6;
  --snow-100:#F4F3FF;
  --snow-300:#BDC0EA;
  --rose-400:#FF4D8D;
  --volt-400:#2F8BFF;
  --ruby-300:#FF6B7D;
  --teal-300:#46E0C6;
  --glass-fill:rgba(255,255,255,0.038);
  --glass-fill-strong:rgba(255,255,255,0.085);
  --glass-border:rgba(255,255,255,0.16);
  --glass-hairline:rgba(255,255,255,0.11);
  --console-000:#FFFFFF;
  --status-neutral-bg:#E8EAF3;
  --status-neutral-ink:#2E3350;
  --status-new-bg:#12142B;
  --status-ok-bg:#D9F2E7;
  --status-ok-ink:#0B5A41;
  --status-wait-bg:#FFEFC7;
  --status-wait-ink:#6B4700;
  --status-risk-bg:#FCDDE1;
  --status-risk-ink:#8C1526;
  --brand-blue:#2A5BF5;
  --brand-violet:#7A3FF2;
  --brand-blue-light:#8AB4FF;
  --brand-violet-light:#B69CFF;
  --brand-blue-rgb:42 91 245;
  --brand-violet-rgb:122 63 242;
  --brand-blue-light-rgb:138 180 255;
  --brand-violet-light-rgb:182 156 255;
  --volt-400-rgb:47 139 255;
  --rose-400-rgb:255 77 141;
  --teal-300-rgb:70 224 198;
  /* spacing */
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;
  /* radius */
  --radius-sm:6px;
  --radius-md:12px;
  --radius-lg:24px;
  --radius-stage:30px;
  --radius-pill:999px;
  /* shadow */
  --shadow-glass:0 16px 48px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.14);
  --glow-bulb:0 0 4px rgba(138,180,255,0.7);
  --glow-volt:0 0 28px -6px rgba(47,139,255,0.6);
  --shadow-toast:0 12px 40px rgba(0,0,0,0.45);
  --glow-brand:0 0 0 1px rgba(122,63,242,0.45), 0 10px 32px -8px rgba(42,91,245,0.7);
  /* type */
  --font-display:"Big Shoulders Display", "Oswald", "Arial Narrow", Impact, sans-serif;
  --font-text:"Hanken Grotesk", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
}
@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:500 900;font-display:swap;src:url("/fonts/BigShouldersDisplay-var-latin.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url("/fonts/HankenGrotesk-var-latin.woff2") format("woff2")}
@property --spin{syntax:"<angle>";inherits:false;initial-value:0deg}

:root{
  /* colors, space, radius, shadows and the font stacks (--font-display, --font-text): packages/tokens/dist/tokens.css,
     imported above */
  /* motion */
  --t-fast:160ms;--t-panel:320ms;--ease:cubic-bezier(.2,.7,.2,1);
  --gutter:clamp(20px,4vw,48px);
  --focus:var(--brand-blue-light);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px;background:var(--void-950)}
body{margin:0;font-family:var(--font-text);font-size:1.0625rem;line-height:1.6;color:var(--snow-100);background:transparent;overflow-x:clip;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%}
a{color:inherit}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:16px;top:-64px;z-index:100;background:linear-gradient(135deg,var(--brand-blue),var(--brand-violet));color:var(--snow-100);padding:12px 16px;border-radius:var(--radius-sm);font-weight:600;text-decoration:none}
.skip:focus{top:16px}

/* atmosphere: three drifting light sources and a faint technical grid, fixed behind everything */
.aurora{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(1100px 620px at 78% -8%,rgba(35,40,99,.6),rgba(7,9,24,0) 70%)}
.aurora i{position:absolute;display:block;width:64vmax;height:64vmax;border-radius:50%;will-change:transform}
.aurora i:nth-child(1){background:radial-gradient(closest-side,rgb(var(--brand-blue-rgb) / .30),rgb(var(--brand-blue-rgb) / 0));left:-24vmax;top:-28vmax;animation:drift-a 28s ease-in-out infinite alternate}
.aurora i:nth-child(2){background:radial-gradient(closest-side,rgb(var(--brand-violet-rgb) / .22),rgb(var(--brand-violet-rgb) / 0));right:-28vmax;top:14vh;animation:drift-b 34s ease-in-out infinite alternate}
.aurora i:nth-child(3){background:radial-gradient(closest-side,rgb(var(--rose-400-rgb) / .18),rgb(var(--rose-400-rgb) / 0));left:10vw;bottom:-38vmax;animation:drift-c 40s ease-in-out infinite alternate}
.aurora::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,rgba(0,0,0,0) 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,rgba(0,0,0,0) 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000,rgba(0,0,0,0) 78%);mask-image:radial-gradient(ellipse 90% 70% at 50% 0%,#000,rgba(0,0,0,0) 78%)}
@keyframes drift-a{to{transform:translate(14vw,10vh) scale(1.15)}}
@keyframes drift-b{to{transform:translate(-12vw,-14vh) scale(.9)}}
@keyframes drift-c{to{transform:translate(10vw,-12vh) scale(1.1)}}

.wrap{width:min(100% - 2*var(--gutter),1240px);margin-inline:auto}
.band{padding-block:clamp(64px,9vw,120px)}
.band-night{background:transparent}
.band-dusk{background:rgba(24,28,74,.42);border-block:1px solid var(--glass-hairline)}
.band-deep{background:rgba(7,9,24,.58)}

.display-1,.display-2{font-family:var(--font-display);font-weight:800;text-transform:uppercase;margin:0;text-wrap:balance}
.display-1{font-size:clamp(2.75rem,6.6vw,5.5rem);line-height:.93;letter-spacing:.004em;text-shadow:0 0 48px rgb(var(--volt-400-rgb) / .22)}
.display-2{font-size:clamp(2.125rem,4.6vw,3.75rem);line-height:.98;letter-spacing:.006em}
.display-2 .w{display:inline-block;white-space:nowrap}
.title{font-size:1.3125rem;line-height:1.3;font-weight:600;margin:0 0 var(--space-2)}
.lead{font-size:clamp(1.125rem,1.55vw,1.3125rem);line-height:1.55;max-width:60ch}
.muted{color:var(--snow-300)}
.head{display:grid;gap:var(--space-5);margin-bottom:var(--space-8)}
@media (min-width:900px){.head{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:end;gap:var(--space-8)}}
.head p{margin:0}

/* glass: translucent fill, lit top edge, and a spotlight that follows the pointer */
.glass{position:relative;border-radius:var(--radius-lg);background:linear-gradient(180deg,var(--glass-fill-strong),var(--glass-fill));border:1px solid var(--glass-border);box-shadow:var(--shadow-glass)}
.glass::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity var(--t-panel) var(--ease);background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgb(var(--volt-400-rgb) / .14),rgb(var(--volt-400-rgb) / 0) 65%)}
.glass:hover::after{opacity:1}
.glass-blur{-webkit-backdrop-filter:blur(20px) saturate(120%);backdrop-filter:blur(20px) saturate(120%)}

/* liquid light: a conic gradient flowing round the edge, with a counter-rotating blurred halo behind it */
.liquid{position:relative;isolation:isolate;border-radius:var(--radius-lg)}
.liquid::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:2px;pointer-events:none;z-index:2;
  background:conic-gradient(from var(--spin),var(--brand-blue-light),var(--brand-violet) 25%,var(--rose-400) 50%,var(--volt-400) 75%,var(--brand-blue-light));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:spin 7s linear infinite}
.liquid-fx{position:absolute;inset:-3px;border-radius:inherit;pointer-events:none;z-index:-1;filter:blur(18px);opacity:.75}
.liquid-fx i{position:absolute;inset:0;display:block;border-radius:inherit;padding:6px;
  background:conic-gradient(from var(--spin),var(--volt-400),var(--brand-violet) 35%,var(--rose-400) 68%,var(--volt-400));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:spin 11s linear infinite reverse}
.liquid.is-off::before,.liquid.is-off .liquid-fx i{animation-play-state:paused}
.liquid-hover::before{opacity:0;transition:opacity var(--t-panel) var(--ease)}
.liquid-hover:hover::before,.liquid-hover:focus-within::before{opacity:1}
@keyframes spin{to{--spin:360deg}}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:48px;padding:0 22px;border-radius:var(--radius-pill);border:2px solid transparent;font-weight:600;font-size:1rem;line-height:1;text-decoration:none;transition:background var(--t-fast) var(--ease),color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),box-shadow var(--t-panel) var(--ease),transform var(--t-fast) var(--ease)}
.btn-primary{background:linear-gradient(135deg,var(--brand-blue),var(--brand-violet));color:var(--snow-100);box-shadow:var(--glow-brand)}
.btn-primary:hover{background:linear-gradient(135deg,var(--brand-blue),var(--brand-violet));box-shadow:0 0 0 1px rgb(var(--brand-violet-light-rgb) / .6),0 14px 44px -6px rgb(var(--brand-blue-rgb) / .85)}
.btn-ghost{border-color:var(--glass-border);color:var(--snow-100);background:var(--glass-fill-strong)}
.btn-ghost:hover{border-color:var(--volt-400);box-shadow:var(--glow-volt)}
.btn-quiet{min-height:40px;padding:0 16px;font-size:.9375rem;border-color:var(--night-line-strong);background:transparent;color:var(--snow-100)}
.btn-quiet:hover{border-color:var(--snow-100)}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.text-link{font-weight:600;text-underline-offset:.2em;text-decoration-thickness:2px;text-decoration-color:var(--brand-blue-light)}
.text-link:hover{color:var(--brand-violet-light)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,9,24,.62);border-bottom:1px solid var(--glass-hairline)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5);min-height:72px}
.progress{position:absolute;left:0;right:0;bottom:-2px;height:2px;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--volt-400),var(--brand-violet-light),var(--rose-400));box-shadow:0 0 12px rgb(var(--brand-violet-rgb) / .7)}
@keyframes grow{to{transform:scaleX(1)}}
@supports (animation-timeline:scroll()){.progress{animation:grow linear both;animation-timeline:scroll(root)}}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--snow-100)}
.brand-mark{width:38px;height:38px;flex:none;filter:drop-shadow(0 0 6px rgb(var(--brand-blue-rgb) / .7))}
.brand-name{font-family:var(--font-display);font-weight:800;font-size:1.625rem;letter-spacing:.02em;text-transform:uppercase;line-height:1}
.brand-name span{color:var(--brand-blue-light);text-shadow:0 0 14px rgb(var(--brand-blue-rgb) / .7)}
/* C12W-0711 (R-C12W-76, board RP10): the gap is --space-4 and the Menu takes over below 1180px, so "Industries" fits in one row
   from 1170px (Docs/evidence/C12W-0741b/rp10/navfit.json, measured on carnival12.com with its fonts loaded). */
.nav-list{display:flex;align-items:center;gap:var(--space-4)}
.nav-list a{text-decoration:none;font-weight:500;font-size:.96875rem;color:var(--snow-300);padding:12px 2px}
.nav-list a:hover{color:var(--snow-100)}
.nav-list .btn{color:var(--snow-100);padding:0 18px;min-height:44px}
.nav-toggle{display:none;min-height:44px;min-width:44px;border-radius:var(--radius-pill);border:2px solid var(--night-line-strong);background:transparent;padding:0 16px;font-weight:600}
@media (max-width:1179px){
  .nav-toggle{display:inline-flex;align-items:center}
  .nav{position:absolute;left:0;right:0;top:100%;background:rgba(7,9,24,.96);border-bottom:1px solid var(--glass-hairline);display:none}
  .nav.is-open{display:block}
  .nav-list{flex-direction:column;align-items:stretch;gap:0;padding:var(--space-3) var(--gutter) var(--space-5)}
  .nav-list a{display:flex;align-items:center;min-height:52px;padding:0;border-bottom:1px solid var(--glass-hairline);font-size:1.0625rem}
  .nav-list li:last-child a{border:0;margin-top:var(--space-4);justify-content:center}
}

/* hero */
.hero{padding-block:clamp(40px,5vw,72px) clamp(32px,4vw,56px)}
.hero-grid{display:grid;gap:var(--space-7)}
@media (min-width:1020px){.hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center}}
.typed{margin:var(--space-5) 0 0;min-height:2.3em;font-family:var(--font-display);font-weight:700;font-size:clamp(1.375rem,2.3vw,2rem);line-height:1.15;text-transform:uppercase;letter-spacing:.02em;color:var(--volt-400);text-shadow:0 0 20px rgb(var(--volt-400-rgb) / .5)}
@media (min-width:1020px){.typed{min-height:1.15em}}
.typed-prefix{color:var(--snow-100);text-shadow:none}
.caret{display:inline-block;width:.45em;height:.95em;margin-left:.12em;vertical-align:-.1em;background:var(--brand-blue-light);box-shadow:0 0 14px var(--brand-blue-light);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero .lead{margin:var(--space-5) 0 var(--space-6)}
/* C12W-0712 (R-C12W-75): the outcome line under the h1, as drawn on RP2: the lead's type size (18 px at 390, 21 px at 1440),
   weight 600, full-strength text. Its own class, because the first p.lead in the hero is read as the lead. */
.hero-outcome{margin:var(--space-5) 0 0;font-size:clamp(1.125rem,1.55vw,1.3125rem);line-height:1.45;font-weight:600;max-width:60ch;color:var(--snow-100)}
.cta-row{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.hero-side{display:grid;gap:var(--space-5);justify-items:center}
.orbit{position:relative;width:min(100%,560px);aspect-ratio:1/0.74}
.orbit canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.orbit-label{position:absolute;left:0;right:0;bottom:0;margin:0;text-align:center;font-size:.9375rem;color:var(--snow-300);pointer-events:none}
.orbit-label b{color:var(--brand-blue-light);font-family:var(--font-display);font-weight:800;font-size:1.25rem;margin-right:6px}
@media (max-width:1019px){.orbit{width:min(100%,380px)}}

/* ticket */
.ticket-wrap{display:block;width:100%;max-width:420px;filter:drop-shadow(0 0 22px rgb(var(--brand-blue-rgb) / .5)) drop-shadow(0 0 60px rgb(var(--rose-400-rgb) / .2));perspective:800px}
.ticket{display:grid;grid-template-columns:1fr auto;background:linear-gradient(135deg,var(--brand-blue),var(--brand-violet));color:var(--snow-100);border-radius:var(--radius-md);text-decoration:none;max-width:420px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform var(--t-panel) var(--ease);will-change:transform;
  -webkit-mask:radial-gradient(11px at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(11px at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(11px at 0 50%,#0000 97%,#000) left/51% 100% no-repeat,radial-gradient(11px at 100% 50%,#0000 97%,#000) right/51% 100% no-repeat}
.ticket-main{padding:22px 20px 22px 30px}
.ticket-kicker{display:block;font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:2.125rem;line-height:1;letter-spacing:.02em;margin:0 0 6px}
.ticket-main p{margin:0;font-size:.96875rem;line-height:1.4;font-weight:500}
.ticket-stub{display:grid;place-items:center;padding:0 30px 0 18px;border-left:2px dashed color-mix(in srgb,var(--snow-100) 55%,transparent);font-family:var(--font-display);font-weight:800;font-size:2.75rem;line-height:1}

/* midway */
.midway-top{display:grid;gap:var(--space-6);margin-bottom:var(--space-6)}
@media (min-width:900px){.midway-top{grid-template-columns:minmax(0,1fr) auto;align-items:end}}
.dial{display:flex;align-items:center;gap:var(--space-4)}
.dial svg{width:112px;height:112px;flex:none}
.dial circle{fill:var(--night-700);transition:fill var(--t-fast) var(--ease)}
.dial circle.on{fill:var(--brand-blue-light);filter:drop-shadow(0 0 5px rgb(var(--brand-blue-light-rgb) / .8))}
.dial text{font-family:var(--font-display);font-weight:800;font-size:40px;fill:var(--snow-100)}
.dial-btns{display:flex;gap:var(--space-2)}
.dial-btns button{width:48px;height:48px;border-radius:50%;border:2px solid var(--night-line-strong);background:transparent;display:grid;place-items:center}
.dial-btns button:hover{border-color:var(--snow-100)}
.dial-btns svg{width:20px;height:20px}

.booths{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);gap:var(--space-2);overflow-x:auto;padding:4px 4px var(--space-3);margin:0 -4px var(--space-5);scrollbar-width:thin;scrollbar-color:var(--night-line-strong) transparent}
@media (min-width:1020px){.booths{grid-auto-flow:row;grid-template-columns:repeat(6,minmax(0,1fr));overflow:visible}}
.booth{display:flex;align-items:baseline;gap:10px;width:100%;min-height:56px;text-align:left;padding:10px 14px;border-radius:var(--radius-md);border:2px solid var(--night-line);background:var(--night-800);color:var(--snow-300);font-weight:500;font-size:.9375rem;line-height:1.25;transition:border-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}
.booth b{font-family:var(--font-display);font-weight:800;font-size:1.375rem;line-height:1;color:var(--night-line-strong);min-width:1.5ch;font-variant-numeric:tabular-nums}
.booth:hover{border-color:var(--night-line-strong);color:var(--snow-100)}
.booth[aria-selected="true"]{border-color:var(--brand-blue-light);background:var(--night-700);color:var(--snow-100)}
.booth[aria-selected="true"] b{color:var(--brand-blue-light)}

.marquee{position:relative;padding:24px;border-radius:var(--radius-stage);background:var(--night-800);border:1px solid var(--night-line)}
.marquee::before,.marquee::after{content:"";position:absolute;inset:0;padding:24px;border-radius:inherit;pointer-events:none;
  background-size:48px 48px;background-repeat:round;filter:drop-shadow(var(--glow-bulb));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
.marquee::before{background-image:radial-gradient(circle at 25% 25%,var(--brand-blue-light) 0 2.8px,#0000 3.4px),radial-gradient(circle at 75% 75%,var(--brand-blue-light) 0 2.8px,#0000 3.4px)}
.marquee::after{background-image:radial-gradient(circle at 75% 25%,var(--brand-violet-light) 0 2.8px,#0000 3.4px),radial-gradient(circle at 25% 75%,var(--brand-violet-light) 0 2.8px,#0000 3.4px)}
.marquee.is-chasing::before{animation:chase .7s steps(1) 4}
.marquee.is-chasing::after{animation:chase .7s steps(1) 4 reverse}
@keyframes chase{0%{opacity:1}50%{opacity:.18}100%{opacity:1}}
@media (max-width:640px){.views{padding:10px}.stage-bar{padding:12px 14px}.stage-num{font-size:2.25rem}.marquee{padding:16px;border-radius:22px}.marquee::before,.marquee::after{padding:16px;background-size:32px 32px}}

.stage{background:var(--night-900);border-radius:12px;overflow:hidden}
.stage-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--night-line)}
.stage-id{display:flex;align-items:center;gap:var(--space-4);min-width:0}
.stage-num{font-family:var(--font-display);font-weight:800;font-size:2.75rem;line-height:1;color:var(--brand-blue-light);font-variant-numeric:tabular-nums}
.stage-name{margin:0;font-weight:600;font-size:1.125rem;line-height:1.25}
.stage-note{margin:0;font-size:.875rem;color:var(--snow-300)}
.seg{display:inline-flex;padding:4px;border-radius:var(--radius-pill);background:var(--night-800);border:1px solid var(--night-line)}
.seg button{min-height:40px;padding:0 16px;border-radius:var(--radius-pill);border:0;background:transparent;color:var(--snow-300);font-weight:600;font-size:.9375rem;position:relative}
.seg button[aria-pressed="true"]{background:var(--snow-100);color:var(--night-900)}
.seg .seg-both{display:none}
@media (min-width:1080px){.seg .seg-both{display:inline-block}}
.seg .ping{position:absolute;top:4px;right:6px;width:10px;height:10px;border-radius:50%;background:var(--ruby-300);box-shadow:0 0 0 3px var(--night-800)}

.views{display:grid;gap:var(--space-4);padding:var(--space-4);align-items:start}
.views[data-view="both"]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.views[data-view="front"] .view-admin,.views[data-view="admin"] .view-front{display:none}
.view-label{display:flex;justify-content:space-between;align-items:center;min-height:36px;margin:0 0 var(--space-2);font-size:.875rem;font-weight:600;color:var(--snow-300)}
.view-label button{background:none;border:0;padding:8px 0;color:var(--snow-300);text-decoration:underline;text-underline-offset:.2em;font-size:.875rem}
.view-label button:hover{color:var(--snow-100)}

/* build panel */
.build{display:grid;gap:var(--space-6);margin-top:var(--space-7)}
@media (min-width:900px){.build{grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.1fr);gap:var(--space-7);align-items:start}}
.build h3{margin:0 0 var(--space-3);font-size:1rem;font-weight:600;color:var(--brand-blue-light)}
.build li{padding:9px 0;border-top:1px solid var(--night-line);font-size:.96875rem;line-height:1.4;color:var(--snow-100)}
.build-cta p{font-size:1.0625rem;color:var(--snow-300)}

/* simulated UIs */
.sim{container-type:inline-size;border-radius:10px;overflow:hidden;background:#fff;color:#16181d;font-size:14px;line-height:1.45;box-shadow:0 0 0 1px rgb(255 255 255 / .08)}
.sim-chrome{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#E6E8F0;color:#3b4058}
.sim-dots{display:flex;gap:5px}
.sim-dots i{width:9px;height:9px;border-radius:50%;background:#B9BDD1;display:block}
.sim-url{flex:1;min-width:0;background:#fff;border-radius:var(--radius-pill);padding:3px 12px;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sim button{font-size:inherit}
.sim :focus-visible{outline:3px solid #12153A;outline-offset:2px}

.site{background:var(--bg);color:var(--fg);min-height:520px;display:flex;flex-direction:column}
.site-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid color-mix(in srgb,var(--fg) 14%,transparent)}
.site-brand{font-weight:700;font-size:15px;letter-spacing:.01em}
.site-links{display:flex;gap:16px;font-size:13px;opacity:.85}
.site-hero{padding:26px 18px 20px;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--a) 9%,transparent) 0 18px,#0000 18px 36px)}
.site-h{margin:0 0 6px;font-size:26px;line-height:1.12;font-weight:700;max-width:22ch}
.sim[data-head="serif"] .site-h,.sim[data-head="serif"] .site-brand{font-family:Georgia,"Times New Roman",serif;font-weight:700}
.sim[data-head="cond"] .site-h,.sim[data-head="cond"] .site-brand{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.02em}
.sim[data-head="cond"] .site-h{font-size:32px;line-height:1}
.sim[data-head="cond"] .site-brand{font-size:19px;letter-spacing:.05em;font-weight:700}
.site-p{margin:0 0 16px;max-width:46ch;opacity:.9}
.site-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:8px;align-items:end}
.site-field{display:grid;gap:3px;font-size:11.5px;font-weight:600}
.site-field span{opacity:.8}
.site-field output{display:block;padding:9px 10px;border-radius:6px;background:color-mix(in srgb,var(--fg) 7%,var(--bg));border:1px solid color-mix(in srgb,var(--fg) 38%,transparent);font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site-go{min-height:40px;padding:0 16px;border-radius:6px;border:0;background:var(--a);color:var(--ai);font-weight:700;white-space:nowrap}
.site-go:hover{filter:brightness(1.08)}
.site-sent{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:11px 12px;border-radius:6px;background:color-mix(in srgb,var(--a) 20%,var(--bg));border:1px solid var(--a);font-weight:600}
.site-sent button{min-height:34px;padding:0 12px;border-radius:6px;border:1px solid currentColor;background:transparent;color:inherit;font-weight:600}
.site-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:16px 18px}
.site-item{border-radius:8px;overflow:hidden;border:1px solid color-mix(in srgb,var(--fg) 14%,transparent);background:color-mix(in srgb,var(--fg) 4%,var(--bg))}
.site-pic{height:64px;background:color-mix(in srgb,var(--a) 30%,var(--bg));display:grid;place-items:center;color:color-mix(in srgb,var(--fg) 70%,var(--a))}
.site-pic svg{width:26px;height:26px}
.site-item div{padding:9px 10px 11px}
.site-item strong{display:block;font-size:13.5px}
.site-item span{display:block;font-size:12px;opacity:.8}
.site-item em{display:block;font-style:normal;font-weight:700;font-size:13px;margin-top:4px}
.site-chat{margin:auto 18px 18px;display:grid;gap:6px;justify-items:start}
.site-chat p{margin:0;padding:8px 12px;border-radius:12px;max-width:40ch;font-size:13px}
.chat-q{justify-self:end;background:color-mix(in srgb,var(--fg) 12%,var(--bg))}
.chat-a{background:var(--a);color:var(--ai)}
.chat-who{font-size:11.5px;font-weight:600;opacity:.75}
@container (max-width:520px){
  .site-links{display:none}
  .site-form{grid-template-columns:1fr 1fr}
  .site-go{grid-column:1/-1}
  .site-items{grid-template-columns:1fr}
  .site-pic{height:44px}
  .site-h{font-size:22px}
}

.adm{display:grid;grid-template-columns:150px minmax(0,1fr);min-height:520px;background:#F5F6FA;color:#171A2B;font-variant-numeric:tabular-nums}
.adm-side{background:#12142B;color:#C9CCE6;padding:14px 10px;display:flex;flex-direction:column;gap:2px}
.adm-logo{font-weight:700;color:#fff;font-size:13px;padding:4px 8px 12px}
.adm-side span{display:block;padding:8px;border-radius:6px;font-size:13px}
.adm-side span[aria-current]{background:color-mix(in srgb,var(--a) 85%,#12142B);color:var(--ai);font-weight:600}
.adm-main{padding:14px;display:grid;gap:12px;align-content:start;min-width:0}
.adm-top{display:flex;justify-content:space-between;align-items:center;gap:10px}
.adm-title{font-size:16px;font-weight:700;margin:0}
.adm-user{font-size:12px;color:#4B5070;white-space:nowrap}
.adm-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.adm-kpi{background:#fff;border:1px solid #DFE1EC;border-radius:8px;padding:10px}
.adm-kpi span{display:block;font-size:11.5px;color:#4B5070}
.adm-kpi strong{display:block;font-size:20px;line-height:1.2}
.adm-kpi em{display:block;font-style:normal;font-size:11.5px;color:#0B6B4F;font-weight:600;min-height:1.4em}
.adm-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.adm-card{background:#fff;border:1px solid #DFE1EC;border-radius:8px;padding:10px 12px;min-width:0}
.adm-card h4{margin:0 0 8px;font-size:12.5px;font-weight:600;color:#33374F}
.adm-chart svg{display:block;width:100%;height:92px}
.adm-chart rect{fill:var(--a)}
.adm-feed{display:grid;gap:0;max-height:136px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 72%,#0000);mask-image:linear-gradient(#000 72%,#0000)}
.adm-feed li{display:grid;grid-template-columns:auto 1fr;gap:8px;padding:5px 0;border-top:1px solid #ECEEF5;font-size:12.5px;line-height:1.35}
.adm-feed li:first-child{border-top:0}
.adm-feed time{color:#5A5F80;font-size:11.5px;white-space:nowrap}
.adm-feed li.is-new{animation:flash 2.4s var(--ease)}
.adm-table{width:100%;border-collapse:collapse;font-size:12.5px}
.adm-table th{text-align:left;font-weight:600;color:#4B5070;padding:6px 8px;border-bottom:1px solid #DFE1EC}
.adm-table td{padding:7px 8px;border-bottom:1px solid #ECEEF5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:16ch}
.adm-table tr.is-new td{animation:flash 3s var(--ease);font-weight:600}
@keyframes flash{0%,40%{background:#FFE9B0}100%{background:transparent}}
.pill{display:inline-block;padding:2px 8px;border-radius:var(--radius-pill);font-size:11.5px;font-weight:600;background:var(--status-neutral-bg);color:var(--status-neutral-ink)}
.pill-new{background:var(--status-new-bg);color:#fff}
.pill-ok{background:var(--status-ok-bg);color:var(--status-ok-ink)}
.pill-wait{background:var(--status-wait-bg);color:var(--status-wait-ink)}
.pill-risk{background:var(--status-risk-bg);color:var(--status-risk-ink)}
@container (max-width:520px){
  .adm{grid-template-columns:1fr}
  .adm-side{flex-direction:row;overflow-x:auto;padding:8px;gap:4px}
  .adm-logo{display:none}
  .adm-side span{white-space:nowrap}
  .adm-kpis{grid-template-columns:1fr 1fr}
  .adm-grid{grid-template-columns:1fr}
  .adm-table th:nth-child(3),.adm-table td:nth-child(3){display:none}
}

/* sovereignty */
.spectrum{display:grid;gap:var(--space-4);margin:var(--space-7) 0;counter-reset:none}
@media (min-width:900px){.spectrum{grid-template-columns:repeat(3,minmax(0,1fr));gap:0}}
.spectrum li{position:relative;padding:var(--space-6) var(--space-5) var(--space-5);background:var(--night-900);border:1px solid var(--night-line)}
@media (min-width:900px){.spectrum li+li{border-left:0}.spectrum li:first-child{border-radius:var(--radius-md) 0 0 var(--radius-md)}.spectrum li:last-child{border-radius:0 var(--radius-md) var(--radius-md) 0}}
.spectrum li::before{content:"";position:absolute;left:var(--space-5);top:-7px;width:14px;height:14px;border-radius:50%;background:var(--brand-blue-light);box-shadow:0 0 10px rgb(var(--brand-blue-light-rgb) / .7)}
.spectrum p{margin:0;color:var(--snow-300);font-size:.96875rem}
.axis{display:flex;justify-content:space-between;font-size:.9375rem;color:var(--snow-300);margin-top:calc(-1*var(--space-4))}
.commit{display:grid;gap:0 var(--space-8)}
@media (min-width:900px){.commit{grid-template-columns:1fr 1fr}}
.commit li{display:grid;grid-template-columns:28px 1fr;gap:var(--space-3);padding:var(--space-4) 0;border-top:1px solid var(--night-line)}
.commit svg{width:22px;height:22px;color:var(--teal-300);margin-top:3px}
.commit strong{display:block}
.commit span{color:var(--snow-300);font-size:.96875rem}

/* fit table */
.table-scroll{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--night-line)}
.fit{width:100%;min-width:760px;border-collapse:collapse;font-size:.96875rem}
.fit th,.fit td{text-align:left;vertical-align:top;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--night-line)}
.fit thead th{font-family:var(--font-display);text-transform:uppercase;font-weight:800;font-size:1.375rem;letter-spacing:.01em;line-height:1.05;color:var(--brand-blue-light);background:rgba(7,9,24,.6)}
.fit tbody th{font-weight:600;color:var(--snow-300);width:18%}
.fit tr:last-child th,.fit tr:last-child td{border-bottom:0}

/* contact */
.contact{display:grid;gap:var(--space-8)}
@media (min-width:1020px){.contact{grid-template-columns:minmax(0,6fr) minmax(0,4fr);gap:var(--space-9)}}
.form{display:grid;gap:var(--space-4)}
.form-row{display:grid;gap:var(--space-4)}
@media (min-width:640px){.form-row{grid-template-columns:1fr 1fr}}
.field{display:grid;gap:6px;align-content:start}
.field label{font-weight:600;font-size:.96875rem}
.field label small{font-weight:400;color:var(--snow-300);font-size:.875rem}
.field input,.field select,.field textarea{width:100%;min-height:50px;padding:12px 14px;border-radius:var(--radius-sm);border:2px solid var(--night-line-strong);background:var(--night-900);color:var(--snow-100)}
.field textarea{min-height:132px;resize:vertical;line-height:1.5}
.field select{appearance:none;background-image:linear-gradient(45deg,#0000 50%,var(--snow-300) 50%),linear-gradient(135deg,var(--snow-300) 50%,#0000 50%);background-position:calc(100% - 22px) 22px,calc(100% - 16px) 22px;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--snow-300)}
.field [aria-invalid="true"]{border-color:var(--ruby-300)}
.field-error{color:var(--ruby-300);font-size:.9375rem;font-weight:500;min-height:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:.9375rem;color:var(--snow-300);margin:0}
.form-status{padding:var(--space-5);border-radius:var(--radius-md);border:2px solid var(--teal-300);background:var(--night-900)}
.form-status h3{margin:0 0 6px}
.form-status p{margin:0;color:var(--snow-300)}
.aside-list{display:grid;gap:0;margin-top:var(--space-6)}
.aside-list li{padding:var(--space-4) 0;border-top:1px solid var(--night-line)}
.aside-list strong{display:block}
.aside-list span,.aside-list a{color:var(--snow-300)}

/* footer */
.site-footer{background:rgba(7,9,24,.72);color:var(--snow-300);border-top:1px solid var(--night-line);padding-block:var(--space-8) var(--space-6);font-size:.96875rem}
.foot{display:grid;gap:var(--space-7)}
@media (min-width:900px){.foot{grid-template-columns:minmax(0,5fr) repeat(4,minmax(0,2fr))}}
.foot h2{font-size:.96875rem;font-weight:600;color:var(--snow-100);margin:0 0 var(--space-3)}
.foot li{margin-bottom:8px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--snow-100);text-decoration:underline}
.proofline{margin-top:var(--space-7);padding-top:var(--space-5);border-top:1px solid var(--night-line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-4)}
.proofline p{margin:0}
.proofline strong{color:var(--teal-300);font-weight:600}

.toast{position:fixed;left:16px;right:16px;bottom:24px;margin-inline:auto;width:fit-content;max-width:min(560px,calc(100% - 32px));transform:translateY(24px);opacity:0;pointer-events:none;z-index:80;display:flex;align-items:center;gap:var(--space-3);padding:10px 10px 10px 20px;border-radius:20px;line-height:1.35;background:var(--snow-100);color:var(--night-900);font-weight:600;box-shadow:var(--shadow-toast);transition:opacity var(--t-panel) var(--ease),transform var(--t-panel) var(--ease)}
.toast.is-on{opacity:1;transform:none;pointer-events:auto}
.toast button{flex:none;white-space:nowrap;min-height:44px;padding:0 16px;border-radius:var(--radius-pill);border:0;background:var(--night-900);color:#fff;font-weight:600}


/* stage shell: neon tubing outside, marquee bulbs inside */
.stage-shell{border-radius:var(--radius-stage)}
.stage-shell .liquid-fx{filter:blur(30px);opacity:.95;inset:-10px}
.stage-shell .liquid-fx i{padding:16px}
.aside-list{gap:var(--space-2)}
.aside-list li.glass{padding:var(--space-4) var(--space-5);border-top:1px solid var(--glass-border);border-radius:var(--radius-md)}
.views.is-swapping .view{animation:swap-in .38s var(--ease) both}
.views.is-swapping .view-admin{animation-delay:.06s}
@keyframes swap-in{from{opacity:0;transform:translateX(28px) scale(.985);filter:blur(6px)}}
.booth[aria-selected="true"]{box-shadow:0 0 0 1px var(--brand-blue-light),0 0 28px -4px rgb(var(--brand-blue-rgb) / .6)}
.build li{border-top-color:var(--glass-hairline)}

/* needs: the client's own sentence leads, our answer follows */
.needs{display:grid;gap:var(--space-3)}
@media (min-width:900px){.needs{grid-template-columns:1fr 1fr}}
.need{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-6)}
.need-q{margin:0;font-size:clamp(1.25rem,1.9vw,1.5rem);line-height:1.25;font-weight:600;text-wrap:balance;padding-left:var(--space-5);position:relative}
.need-q::before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--brand-blue-light),var(--brand-violet-light));box-shadow:0 0 12px rgb(var(--brand-violet-rgb) / .6)}
.need p{margin:0;color:var(--snow-300)}
.need a{justify-self:start;color:var(--snow-100)}
/* make it yours */
.stage-mine{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2) var(--space-5);padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--night-line);background:rgb(var(--brand-blue-rgb) / .05)}
.mine{display:flex;align-items:center;gap:var(--space-3);flex:1 1 280px;max-width:460px}
.mine-hint{margin:0;font-size:.875rem;color:var(--snow-300)}
.mine label{font-weight:600;font-size:.9375rem;white-space:nowrap;color:var(--brand-blue-light)}
.mine input{flex:1;min-width:0;min-height:44px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid var(--night-line-strong);background:var(--night-800);color:var(--snow-100);font-size:.9375rem}
.mine input::placeholder{color:var(--snow-300);opacity:1}
.mine input:hover{border-color:var(--snow-300)}
.mine input:focus-visible{border-color:var(--volt-400);box-shadow:0 0 24px -6px rgb(var(--volt-400-rgb) / .7)}

/* proof */
.proof{display:grid;gap:var(--space-7)}
@media (min-width:900px){.proof{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:var(--space-9)}}
.proof-points{display:grid;gap:var(--space-4)}
.proof-points li{padding:var(--space-5) var(--space-6)}
.proof-points strong{display:block;font-size:1.1875rem;line-height:1.35;font-weight:600}
.proof-points cite{display:block;margin-top:6px;font-style:normal;font-size:.9375rem;color:var(--snow-300)}

/* services */
.svc{display:grid;gap:var(--space-3)}
.svc-row{display:grid;gap:var(--space-3) var(--space-7);padding:var(--space-6)}
@media (min-width:900px){.svc-row{grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,3fr)}}
.svc-name{font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:clamp(1.625rem,2.4vw,2.125rem);line-height:1;letter-spacing:.01em;margin:0;transition:color var(--t-panel) var(--ease),text-shadow var(--t-panel) var(--ease)}
.svc-row:hover .svc-name{color:var(--brand-blue-light);text-shadow:0 0 24px rgb(var(--brand-blue-rgb) / .5)}
.svc-row p{margin:0}
.svc-inc{font-size:.96875rem;color:var(--snow-300)}
.gamedev-see{margin-top:var(--space-5)}
/* C12W-0702: the ticket's CSS mask clips any outline drawn on .ticket itself, so the keyboard focus ring is drawn on
   the unmasked wrapper instead. :has for engines that support it, :focus-within as the fallback. */
.ticket-wrap:focus-within{outline:3px solid var(--focus);outline-offset:3px;border-radius:var(--radius-md)}
.ticket-wrap:has(.ticket:focus-visible){outline:3px solid var(--focus);outline-offset:3px;border-radius:var(--radius-md)}
.ticket-wrap:focus-within:not(:has(.ticket:focus-visible)){outline:none}
.svc-inc a{display:inline-block;margin-top:var(--space-3);color:var(--snow-100)}

/* work */
.case{display:grid;gap:var(--space-7);margin-bottom:var(--space-7)}
@media (min-width:1020px){.case{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center}}
.case-map{background:rgba(7,9,24,.78);border-radius:var(--radius-lg);padding:var(--space-5)}
.case-map svg{display:block;width:100%;height:auto}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--space-4)}
.tags li{font-size:.875rem;font-weight:500;padding:4px 12px;border-radius:var(--radius-pill);border:1px solid var(--glass-border);background:var(--glass-fill);color:var(--snow-100)}
.work-list{display:grid;gap:var(--space-3)}
.work-item{display:grid;gap:var(--space-2) var(--space-7);padding:var(--space-5) var(--space-6)}
@media (min-width:900px){.work-item{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}}
.work-item h3{margin:0}
.work-item p{margin:0;color:var(--snow-300)}

/* process */
.steps{display:grid;gap:var(--space-3);counter-reset:step}
@media (min-width:760px){.steps{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1180px){.steps{grid-template-columns:repeat(6,minmax(0,1fr))}}
.steps li{counter-increment:step;padding:var(--space-5)}
.steps li::before{content:counter(step);display:block;width:fit-content;font-family:var(--font-display);font-weight:800;font-size:3.25rem;line-height:1;margin-bottom:var(--space-2);background:linear-gradient(135deg,var(--brand-blue-light),var(--brand-violet-light) 55%,var(--rose-400));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgb(var(--brand-violet-rgb) / .45))}
.steps h3{margin:0 0 6px;font-size:1.1875rem}
.steps p{margin:0;font-size:.96875rem;color:var(--snow-300)}
.gate{margin:var(--space-7) 0 0;padding:var(--space-5) var(--space-6);font-size:1.125rem;max-width:74ch}
.gate strong{color:var(--teal-300)}

/* team */
.cities{display:grid;gap:var(--space-3);margin-bottom:var(--space-8)}
@media (min-width:900px){.cities{grid-template-columns:repeat(3,minmax(0,1fr))}}
.city{padding:var(--space-5) var(--space-6)}
.city h3{font-family:var(--font-display);text-transform:uppercase;font-weight:800;font-size:2rem;line-height:1;margin:0 0 var(--space-2)}
.city p{margin:0;color:var(--snow-300)}
.duo{display:grid;gap:var(--space-7)}
@media (min-width:900px){.duo{grid-template-columns:1fr 1fr;gap:var(--space-9)}}

/* faq */
.faq{display:grid;gap:var(--space-2);max-width:860px}
.faq details{padding:0 var(--space-5);border-radius:var(--radius-md)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-5) 0;font-weight:600;font-size:1.1875rem;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:14px;height:14px;border-right:3px solid var(--volt-400);border-bottom:3px solid var(--volt-400);transform:rotate(45deg) translate(-3px,-3px);transition:transform var(--t-fast) var(--ease);filter:drop-shadow(0 0 6px rgb(var(--volt-400-rgb) / .7))}
.faq details[open] summary::after{transform:rotate(-135deg) translate(-3px,-3px)}
.faq details[open]{border-color:rgb(var(--volt-400-rgb) / .45)}
.faq details p{margin:0 0 var(--space-5);max-width:68ch;color:var(--snow-300)}

/* sovereignty and contact on glass */
.spectrum li{background:linear-gradient(180deg,var(--glass-fill-strong),var(--glass-fill));border-color:var(--glass-border)}
.form{padding:clamp(20px,3vw,32px)}
.fx-toggle{min-height:40px;padding:0 16px;border-radius:var(--radius-pill);border:1px solid var(--glass-border);background:var(--glass-fill);color:var(--snow-100);font-size:.9375rem;font-weight:600}
.fx-toggle:hover{border-color:var(--volt-400)}

/* pointer effects */
.fx-trail{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:89}
.cursor-ring{position:fixed;left:0;top:0;width:36px;height:36px;margin:-18px 0 0 -18px;border-radius:50%;border:1.5px solid var(--volt-400);box-shadow:0 0 16px rgb(var(--volt-400-rgb) / .55),inset 0 0 10px rgb(var(--volt-400-rgb) / .25);pointer-events:none;z-index:90;opacity:0;transition:opacity .2s,width .2s var(--ease),height .2s var(--ease),margin .2s var(--ease),border-color .2s,box-shadow .2s;will-change:transform}
.cursor-ring.is-on{opacity:1}
.cursor-ring.is-hot{width:58px;height:58px;margin:-29px 0 0 -29px;border-color:var(--brand-blue-light);box-shadow:0 0 24px rgb(var(--brand-blue-rgb) / .65),inset 0 0 12px rgb(var(--brand-blue-rgb) / .25)}
.cursor-ring.is-down{width:26px;height:26px;margin:-13px 0 0 -13px}

/* scroll-linked entrances, only where the browser supports them and effects are on */
@keyframes rise{from{opacity:0;transform:translateY(32px) scale(.985);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
@supports (animation-timeline:view()){
  html[data-fx="on"] :is(.head,.need,.svc-row,.proof-points li,.case,.work-item,.steps li,.city,.faq details,.spectrum li,.commit li,.gate,.table-scroll,.contact > *,.build > *){animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 42%}
}

/* effects off, by the visitor's switch or their system setting */
html[data-fx="off"] .aurora i,html[data-fx="off"] .liquid::before,html[data-fx="off"] .liquid-fx i,html[data-fx="off"] .caret,html[data-fx="off"] .marquee::before,html[data-fx="off"] .marquee::after{animation:none}
html[data-fx="off"] .fx-trail,html[data-fx="off"] .cursor-ring{display:none}
html[data-fx="off"] .ticket{transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
  .fx-trail,.cursor-ring{display:none}
}
@media print{.site-header,.toast,.booths,.seg,.dial-btns,.aurora,.fx-trail,.cursor-ring{display:none}html,body{background:#fff;color:#000}}

/* Formerly inline style attributes in the reference body.html (15 of them), moved here because production CSP is
   style-src 'self' without 'unsafe-inline'. Same values; spacing that equals a token uses the token. They sit last so
   they win over the equal-specificity rules above, as the inline styles did. */
.midway-band{padding-block:0 clamp(64px,9vw,120px)}
.midway-lead{margin:var(--space-4) 0 0}
.noscript-note{padding:var(--space-5);margin:0}
.band-flush{padding-top:0}
.proof-lead{margin-bottom:var(--space-6)}
.commit-after-axis{margin-top:var(--space-7)}
.case-title{margin-bottom:var(--space-4)}
.case-figure{margin:0}
.faq-title{margin-bottom:var(--space-7)}
.contact-lead{margin:var(--space-4) 0 var(--space-6)}
/* C12W-0706: "What happens next" between the lead and the form (artboard A8, R-C12W-82): stacked rows with the numeral on
   the left below 760px, three glass cards from 760px. The numeral is the Midway booth numeral's style. Static. Tokens only. */
.next{margin:0 0 var(--space-6)}
.next-h{margin:0 0 var(--space-3);font-size:1.25rem;line-height:1.3;font-weight:600}
.next-list{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none}
.next-list li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-1) var(--space-3);align-items:start;min-height:64px;padding:var(--space-4);border-radius:var(--radius-md)}
.next-list b{grid-row:span 2;font-family:var(--font-display);font-weight:800;font-size:1.375rem;line-height:1.1;color:var(--brand-blue-light);font-variant-numeric:tabular-nums}
.next-list strong{font-size:.96875rem;font-weight:600;line-height:1.35}
.next-list span{font-size:.875rem;line-height:1.45;color:var(--snow-300)}
@media (min-width:760px){.next-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.next-list li{grid-template-columns:minmax(0,1fr);align-content:start;padding:var(--space-4) var(--space-5)}.next-list b{grid-row:auto}}
.next-note{margin:var(--space-3) 0 0;font-size:.875rem;color:var(--snow-300)}
.form-actions{align-items:center}
.foot-tagline{margin:var(--space-4) 0 0;max-width:40ch}
/* C12W-0705: trust and legal long-form pages. One layout (Legal.astro), a sticky table of contents beside the article. */
.legal{padding-block:clamp(48px,7vw,88px)}
.legal-head{margin-bottom:var(--space-7)}
.legal-head .display-2{margin:0}
.legal-meta{margin:var(--space-3) 0 0;color:var(--snow-300);font-size:.9375rem}
.legal-grid{display:grid;gap:var(--space-6)}
@media (min-width:900px){.legal-grid{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--space-9);align-items:start}}
.legal-toc{position:static}
@media (min-width:900px){.legal-toc{position:sticky;top:88px}}
.legal-toc h2{font-size:.9375rem;font-weight:600;color:var(--snow-100);margin:0 0 var(--space-3)}
.legal-toc ul{display:grid;gap:8px}
.legal-toc a{color:var(--snow-300);text-decoration:none;font-size:.9375rem}
.legal-toc a:hover{color:var(--snow-100);text-decoration:underline}
.legal-article{max-width:68ch}
.legal-article h2{font-family:var(--font-text);font-size:1.3125rem;line-height:1.3;font-weight:600;color:var(--snow-100);margin:var(--space-7) 0 var(--space-3);scroll-margin-top:88px}
.legal-article h2:first-child{margin-top:0}
.legal-article p{margin:0 0 var(--space-4);color:var(--snow-100)}
.legal-article ul{margin:0 0 var(--space-4);padding-left:1.2em;list-style:disc}
.legal-article li{margin-bottom:6px}
/* C12W-0782: the /terms/ "Purchases" section is the first legal text with sub-headings and numbered clauses (cited as "1.9"). */
.legal-article h3{font-family:var(--font-text);font-size:1.0625rem;line-height:1.35;font-weight:600;color:var(--snow-100);margin:var(--space-5) 0 var(--space-2)}
.legal-article ol{margin:0 0 var(--space-4);padding-left:1.6em;list-style:decimal}
.legal-input{color:var(--brand-violet-light);font-style:italic}
.legal-draft{margin:0 0 var(--space-7)}
@media print{.legal-toc{display:none}}

/* C12W-0785: /fixed-price/, the quick-flow products page (board QP1). It keeps the trust-page head, grid and contents
   list above; the article column holds glass cards, so it is not held to 68ch. Phones stack each card (the 390 board);
   from 760px the price sits beside the name and the lists pair up (the 1440 board). No motion of its own. */
.fp-lead{margin:var(--space-4) 0 0;max-width:60ch;font-size:clamp(1.125rem,1.6vw,1.3125rem);line-height:1.55;color:var(--snow-300)}
.fp-toc li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3)}
.fp-toc-price{flex:none;font-size:.9375rem;font-weight:600;color:var(--snow-100)}
.fp-article{display:grid;gap:var(--space-6);min-width:0}
.fp-article h2,.fp-article h3,.fp-article h4{scroll-margin-top:88px}
.fp-how,.fp-card{padding:var(--space-5)}
.fp-how h2,.fp-questions h2{margin:0 0 var(--space-4);font-family:var(--font-text);font-size:1.3125rem;line-height:1.3;font-weight:600;color:var(--snow-100)}
.fp-how ul{display:grid;gap:var(--space-4) var(--space-6);font-size:.96875rem}
.fp-how strong{display:block}
.fp-terms-link{margin:var(--space-5) 0 0;font-size:.96875rem}
.fp-how span{color:var(--snow-300)}
.fp-card{display:grid;gap:var(--space-4)}
.fp-card p{margin:0}
.fp-card-head{display:grid;gap:var(--space-2)}
.fp-kicker{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-blue-light)}
.fp-name{margin:0;font-family:var(--font-display);font-weight:800;font-size:1.75rem;line-height:1;letter-spacing:.01em;text-transform:uppercase;text-wrap:balance}
.fp-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 var(--space-2)}
.fp-amount{font-family:var(--font-display);font-weight:800;font-size:2.5rem;line-height:1;color:var(--brand-blue-light);font-variant-numeric:tabular-nums}
.fp-unit{font-size:.8125rem;color:var(--snow-300)}
.fp-summary,.fp-muted{color:var(--snow-300)}
.fp-statement{padding:var(--space-4) var(--space-5);border-left:3px solid var(--brand-blue-light);background:rgb(var(--brand-blue-rgb) / .1);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-size:.96875rem}
.fp-cols{display:grid;gap:var(--space-4)}
.fp-label{margin:0 0 var(--space-2);font-family:var(--font-text);font-size:.75rem;line-height:1.4;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--snow-300)}
.fp-card .fp-list,.fp-card .fp-cols p,.fp-card .fp-rule p,.fp-variant p,.fp-services p{font-size:.9375rem}
.fp-list{display:grid;gap:var(--space-1);padding-left:1.2em;list-style:disc}
.fp-rule{padding-top:var(--space-4);border-top:1px solid var(--night-line)}
.fp-variants,.fp-services{display:grid;gap:var(--space-4)}
.fp-variant{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-5);border:1px solid var(--night-line);border-radius:var(--radius-md);background:var(--night-900)}
.fp-variant h3,.fp-services h3{margin:0;font-family:var(--font-text);font-size:1.1875rem;line-height:1.3;font-weight:600;color:var(--snow-100)}
.fp-variant .fp-label{margin:var(--space-1) 0 0}
.fp-services li{display:grid;gap:var(--space-3);padding:var(--space-4) var(--space-5);border:1px solid var(--night-line);border-radius:var(--radius-md);background:var(--night-900)}
.fp-services li > div{display:grid;gap:var(--space-2)}
.fp-buy{display:grid;gap:var(--space-3)}
.fp-buy .btn{width:100%;line-height:1.25;padding-block:var(--space-3);text-align:center}
.fp-buy-note{font-size:.84375rem;color:var(--snow-300)}
.fp-questions{padding-top:var(--space-5);border-top:1px solid var(--night-line)}
.fp-questions p{max-width:68ch;margin:0}
@media (min-width:760px){
  .fp-how,.fp-card{padding:var(--space-6)}
  .fp-card{gap:var(--space-5)}
  .fp-how ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fp-card-head{grid-template-columns:minmax(0,1fr) auto;gap:var(--space-2) var(--space-5);align-items:start}
  .fp-card-head > *{grid-column:1}
  .fp-card-head > .fp-price{grid-column:2;grid-row:1 / span 3;display:grid;align-content:start}
  .fp-name{font-size:2.125rem}
  .fp-amount{font-size:3rem}
  .fp-cols,.fp-variants{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}
  .fp-variants{gap:var(--space-4)}
  .fp-rule{padding-top:var(--space-5)}
  .fp-services li{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--space-5)}
  .fp-buy{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-5)}
  .fp-buy .btn{width:auto}
  .fp-buy-note{max-width:44ch}
}

/* Header phone (R-C12W-10), desktop only. Shown from 1300px (C12W-0711, R-C12W-76; was 1260px before "Industries"): with
   the phone the row fits from 1290px, so 1300 keeps a margin (Docs/evidence/C12W-0741b/rp10/navfit.json). On phones and
   at 1180-1299px the number stays in the footer and the contact section. */
.nav-phone{display:none}
.nav-phone a{white-space:nowrap}
@media (min-width:1300px){.nav-phone{display:list-item}}

/* C12W-0801: "Live demos" in the main navigation, a <details> disclosure (staging builds until the gateway is live). Desktop:
   a panel under the summary; phones: the entries stack inline in the menu. No animation. C12W-0711: "Industries" is the
   same disclosure, so the rules are on the shared class `nav-menu`. */
.nav-menu{position:relative}
.nav-menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:var(--space-2);font-weight:500;font-size:.96875rem;color:var(--snow-300);padding:12px 2px}
.nav-menu summary::-webkit-details-marker{display:none}
.nav-menu summary::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px}
.nav-menu details[open] summary::after{transform:rotate(-135deg);margin-top:4px}
.nav-menu summary:hover,.nav-menu details[open] summary{color:var(--snow-100)}
.nav-menu ul{position:absolute;top:100%;left:calc(-1 * var(--space-3));z-index:60;display:grid;min-width:250px;padding:var(--space-2);border-radius:var(--radius-md);background:var(--night-900);border:1px solid var(--glass-hairline);box-shadow:var(--shadow-glass)}
.nav-menu ul a{display:flex;align-items:center;min-height:44px;padding:0 var(--space-3);border-radius:var(--radius-sm);white-space:nowrap}
.nav-menu ul a:hover{background:var(--glass-fill-strong);color:var(--snow-100)}
@media (max-width:1179px){
  .nav-menu summary{display:flex;justify-content:space-between;width:100%;min-height:52px;padding:0;border-bottom:1px solid var(--glass-hairline);font-size:1.0625rem}
  .nav-menu ul{position:static;min-width:0;padding:0 0 0 var(--space-4);border:0;border-radius:0;background:transparent;box-shadow:none}
  .nav-menu ul a{min-height:52px;padding:0;border-radius:0}
  .nav-list .nav-menu li:last-child a{border-bottom:1px solid var(--glass-hairline);margin-top:0;justify-content:flex-start}
}

/* C12W-0802: the demo gallery and launch page (staging builds until the gateway is live), moved here from demo-gallery.css so
   the token test reads them. .eyebrow and .gradient-text, which the pages use and nothing defined, are set here. */
.demo-gallery{padding-block:var(--space-8)}
.demo-heading{max-width:70ch;margin-bottom:var(--space-7)}
.demo-heading h1,.demo-launch h1{margin-block:var(--space-4);font-family:var(--font-display);line-height:1.02}
.demo-heading p{max-width:58ch;color:var(--snow-300)}
.demo-heading .eyebrow,.demo-card .eyebrow,.demo-contact .eyebrow{color:var(--brand-blue-light)}
.demo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}
.demo-card{overflow:hidden;background:var(--night-900);border:1px solid var(--night-700);border-radius:var(--radius-lg)}
.demo-card>img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block}
.demo-card-body{padding:var(--space-6)}
.demo-card h2{font-family:var(--font-display);margin:0 0 var(--space-4)}
.demo-tags{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-block:var(--space-6);color:var(--brand-blue-light)}
.demo-tags li{border-bottom:1px solid var(--night-700);padding-bottom:var(--space-2)}
.demo-note{margin-top:var(--space-4);color:var(--snow-300)}
.demo-expectations{margin-block:var(--space-7);padding:var(--space-6);border-left:2px solid var(--brand-blue-light);background:var(--night-900)}
.demo-expectations p{max-width:80ch}.demo-contact{padding-block:var(--space-8)}
.demo-contact h2{font-family:var(--font-display);line-height:1.1}
.demo-contact .btn{margin-right:var(--space-4);margin-bottom:var(--space-4)}
.demo-launch{max-width:70ch}.demo-launch #launch-status{margin-top:var(--space-6)}
@media (max-width:759px){.demo-grid{grid-template-columns:1fr}.demo-card-body{padding:var(--space-6)}}
.demo-gallery .eyebrow{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-blue-light)}
.demo-gallery .gradient-text{color:var(--brand-blue-light)}

/* C12W-0711: /industries/manufacturing/ (board RP9). The page is built from the site's own bands, cards, type and grids;
   these rules add only what RP9 draws that the home page does not. Tokens only. The contact form's optional chip is here
   too (Contact.astro). */
.mfg-kicker{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-blue-light)}
.mfg-hero .display-1{margin-top:var(--space-4)}
.mfg-glance{display:grid;gap:var(--space-4);align-content:start;padding:var(--space-6)}
.mfg-glance p{margin:0}
.mfg-glance-name{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(1.75rem,2.6vw,2.25rem);line-height:1;letter-spacing:.01em;text-transform:uppercase}
.mfg-glance-price{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--night-line)}
.mfg-glance-price span{font-size:.875rem;font-weight:600;color:var(--snow-300)}
.mfg-glance-price strong{font-size:2rem;font-weight:700;line-height:1;letter-spacing:-.01em}
.mfg-checks{display:grid;gap:var(--space-2) var(--space-4);font-size:.9375rem;line-height:1.35}
@media (min-width:560px){.mfg-checks{grid-template-columns:1fr 1fr}}
.mfg-checks li,.mfg-data-list li{display:flex;gap:var(--space-2);align-items:flex-start}
.mfg-checks svg{flex:none;width:18px;height:18px;color:var(--teal-300)}
.mfg-glance .text-link{justify-self:start}
@media (min-width:1020px){.mfg-needs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1020px){.mfg-head{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:end}}
.plant-map{margin:0}
.plant-map figcaption{margin-top:var(--space-5);font-size:.9375rem;line-height:1.5;color:var(--snow-300)}
.plant-map .map-narrow{display:none}
@media (max-width:759px){.plant-map .map-wide{display:none}.plant-map .map-narrow{display:block}}
.mfg-pillars{display:grid;gap:var(--space-3)}
@media (min-width:1020px){.mfg-pillars{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mfg-pillars li{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-6)}
.mfg-pillars h3,.mfg-data-head h3{margin:0;font-size:1.375rem;line-height:1.3;font-weight:600}
.mfg-pillars p{margin:0}
.mfg-data{margin-top:var(--space-7);display:grid;gap:var(--space-3)}
.mfg-data-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:var(--space-2) var(--space-5)}
.mfg-data-list{display:grid;gap:0 var(--space-7)}
@media (min-width:760px){.mfg-data-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1020px){.mfg-data-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
.mfg-data-list li{align-items:center;gap:var(--space-3);padding:var(--space-4) 0;border-top:1px solid var(--night-line)}
.mfg-data-list svg{flex:none;width:22px;height:22px;color:var(--teal-300)}
.mfg-data-list strong{font-weight:600}
.mfg-offer{display:grid;gap:var(--space-7);padding:clamp(var(--space-6),4vw,var(--space-7))}
.mfg-offer .mfg-kicker{margin-bottom:var(--space-5)}
.mfg-deliverables{display:grid;gap:var(--space-5) var(--space-6)}
@media (min-width:760px){.mfg-deliverables{grid-template-columns:1fr 1fr}}
.mfg-deliverables li{display:grid;grid-template-columns:36px 1fr;gap:var(--space-3)}
.mfg-deliverables span{font-family:var(--font-display);font-weight:800;font-size:2rem;line-height:1;color:var(--brand-blue-light)}
.mfg-deliverables strong{display:block;font-weight:600}
.mfg-deliverables p{margin:0;font-size:.9375rem;line-height:1.5}
.mfg-offer-side{display:grid;gap:var(--space-5);align-content:start}
@media (min-width:1020px){.mfg-offer{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.mfg-offer-side{border-left:1px solid var(--night-line);padding-left:var(--space-7)}}
.mfg-investment{margin:0;display:grid;gap:var(--space-2)}
.mfg-offer .mfg-investment .mfg-kicker{margin:0}
.mfg-investment strong{font-size:clamp(2.25rem,3.4vw,3rem);font-weight:700;line-height:1;letter-spacing:-.015em}
.mfg-fixed{margin:0;font-size:1.0625rem;font-weight:600}
.mfg-terms{margin:0;display:grid;grid-template-columns:auto 1fr;gap:var(--space-3) var(--space-4);font-size:.9375rem;line-height:1.5}
.mfg-terms dt{font-weight:600}
.mfg-terms dd{margin:0}
.mfg-offer-side .btn{justify-self:start}
.mfg-ladder{margin:var(--space-5) 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);font-size:.9375rem;color:var(--snow-300)}
.mfg-ladder strong{font-weight:600;color:var(--snow-100)}
.mfg-ladder svg{width:16px;height:16px}
.mfg-phase-map{display:grid;gap:var(--space-3);margin:var(--space-4) 0 0;padding:0;list-style:none}
.mfg-phase-map li{padding-top:var(--space-2);border-top:2px solid var(--night-line-strong);font-size:.9375rem;font-weight:600}
.mfg-phase-map .mfg-rung-1{border-top-color:var(--brand-blue-light)}
.mfg-phase-map .mfg-rung-2{border-top-color:var(--brand-violet-light)}
@media (min-width:1180px){.mfg-phase-map{grid-template-columns:repeat(6,minmax(0,1fr))}.mfg-span-1{grid-column:span 1}.mfg-span-2{grid-column:span 2}.mfg-span-3{grid-column:span 3}}
.mfg-cities{margin-bottom:0}
.form-chip{display:inline-flex;align-items:center;justify-self:start;gap:var(--space-2);min-height:36px;padding:0 var(--space-1) 0 var(--space-4);border:1px solid var(--brand-blue-light);border-radius:var(--radius-pill);background:var(--night-800);font-size:.875rem;font-weight:600}
.form-chip button{display:grid;place-items:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;background:var(--night-700);color:var(--snow-100);cursor:pointer}
.form-chip svg{width:14px;height:14px}

/* C12W-0772: /small-business/ (board SB1), on the manufacturing page's template (its .mfg-kicker and .mfg-head reused);
   H-1 under the Fit table (board SB5); the chip hidden until a package link shows it. Tokens only. */
.form-chip[hidden]{display:none}
.fit-lane{margin:var(--space-5) 0 0}
.lane-hero .display-1{margin-top:var(--space-4);max-width:18ch}
.lane-note{margin:var(--space-4) 0 0;font-size:.9375rem;color:var(--snow-300)}
.lane-cards{display:grid;gap:var(--space-4)}
@media (min-width:760px){.lane-cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1020px){.lane-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.lane-cards>li{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-6)}
.lane-cards h3{margin:0;font-size:1.3125rem;line-height:1.3;font-weight:600}
.lane-cards p{margin:0}
.lane-packages>li{gap:var(--space-4)}
.lane-start{justify-self:start;padding:var(--space-1) var(--space-3);border:1px solid var(--brand-blue-light);border-radius:var(--radius-pill);font-size:.8125rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand-blue-light)}
.lane-cards .lane-pkg-name{font-family:var(--font-display);font-weight:800;font-size:clamp(1.75rem,2.4vw,2.125rem);line-height:1;letter-spacing:.01em;text-transform:uppercase}
.lane-pkg-terms{display:grid;gap:var(--space-4);margin:0}
.lane-pkg-terms dt{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--snow-300)}
.lane-pkg-terms dd{margin:var(--space-1) 0 0;font-size:.96875rem;line-height:1.5}
.lane-prices{display:grid;gap:var(--space-1)}
.lane-prices li{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-3)}
.lane-prices strong{font-size:1.125rem;font-weight:700;white-space:nowrap}
.lane-packages .text-link{justify-self:start}
.lane-more{margin:var(--space-5) 0 0;color:var(--snow-300)}
.lane-scope{display:grid}
.lane-scope>div{padding:var(--space-6)}
.lane-scope h3{margin:0 0 var(--space-4);font-size:1.3125rem;line-height:1.3;font-weight:600}
@media (min-width:900px){.lane-scope{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.lane-scope>div+div{border-left:1px solid var(--night-line)}}
.lane-list{display:grid;gap:var(--space-3)}
.lane-list li{display:flex;gap:var(--space-3);align-items:flex-start}
.lane-list svg{flex:none;width:20px;height:20px;margin-top:3px}
.lane-yes svg{color:var(--teal-300)}
.lane-no svg{color:var(--ruby-300)}
.lane-home-office{grid-column:1/-1;margin:0;padding:var(--space-5) var(--space-6);border-top:1px solid var(--night-line);color:var(--snow-300)}
.lane-home-office strong{color:var(--snow-100);font-weight:600}
.lane-steps-h{margin:var(--space-8) 0 var(--space-5);font-family:var(--font-display);font-weight:800;font-size:clamp(1.75rem,3vw,2.5rem);line-height:1;text-transform:uppercase}
.lane-steps ol{display:grid;gap:var(--space-4);margin:0;padding:0;list-style:none}
@media (min-width:900px){.lane-steps ol{grid-template-columns:repeat(4,minmax(0,1fr))}}
.lane-steps li{display:grid;gap:var(--space-2);align-content:start;padding-top:var(--space-4);border-top:1px solid var(--night-line)}
.lane-steps .muted{font-size:.96875rem}

/* C12W-0746: /las-vegas/ (board SB2), on /small-business/'s template (.lane-*, .mfg-kicker, .mfg-head and the
   manufacturing hero's .mfg-glance card reused), and the home Team card's link to it (R-C12W-81). Tokens only. */
.city .city-link{margin-top:var(--space-3)}
.city-contact{display:grid;gap:var(--space-2);margin:0;padding:0;list-style:none;font-size:1.125rem}
.city-contact li{display:flex;align-items:center;gap:var(--space-3)}
.city-contact svg{flex:none;width:20px;height:20px;color:var(--brand-blue-light)}
.city-lane .text-link{justify-self:start}
.city-price{margin:0}
.city-price dt{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--snow-300)}
.city-price dd{margin:var(--space-2) 0 0}
.city-price-lead strong{font-size:2rem;line-height:1}
@media (min-width:760px){.city-meet{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1180px){.city-meet{grid-template-columns:repeat(4,minmax(0,1fr))}}
.city-booths{display:grid;gap:var(--space-4);margin:0;padding:0;list-style:none}
@media (min-width:900px){.city-booths{grid-template-columns:repeat(2,minmax(0,1fr))}}
.city-booths>li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--space-5);align-items:start;padding:var(--space-6)}
.city-booths>li>div{display:grid;gap:var(--space-3)}
.city-booths p{margin:0}
.city-booths .text-link{justify-self:start}
.city-booth-num{font-family:var(--font-display);font-weight:800;font-size:3.5rem;line-height:.9;color:var(--brand-blue-light)}
.city-booth-name{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3)}
.city-booth-name strong{font-size:1.3125rem;line-height:1.3;font-weight:600}
.city-sim{padding:var(--space-1) var(--space-2);border:1px solid var(--night-line-strong);border-radius:var(--radius-pill);font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--snow-300)}

/* C12W-0708: the two doors under the hero's calls to action (board RP5 variant B). From 1020px they are the hero grid's
   second row, spanning both columns under the copy (the orbit and ticket keep the first row's right column); below that
   they follow the calls to action in document order. Glass cards, no liquid edge. Below 760px the compact variant: 26px
   titles, no icons, no lane sentence, each place over its line. Link rows are at least 52px tall. Tokens only. */
.hero-routes{display:grid;gap:var(--space-3)}
@media (min-width:760px){.hero-routes{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (min-width:1020px){.hero-side{grid-column:2;grid-row:1}.hero-routes{grid-column:1/-1;grid-row:2}}
.door{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-5) var(--space-6)}
.door-head{display:flex;align-items:center;gap:var(--space-3)}
.door-icon{flex:none;width:28px;height:28px;color:var(--brand-blue-light)}
.door-title{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(1.625rem,2.4vw,2.125rem);line-height:1;letter-spacing:.01em;text-transform:uppercase}
.door-lead{margin:0;font-size:1.0625rem;line-height:1.6;color:var(--snow-300)}
.door-links a{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);min-height:52px;border-top:1px solid var(--glass-hairline);text-decoration:none;color:var(--snow-100)}
.door-links a:hover strong{color:var(--brand-blue-light)}
.door-links strong{font-weight:600}
.door-line span{color:var(--snow-300)}
.door-links svg{flex:none;width:20px;height:20px;color:var(--brand-blue-light)}
@media (max-width:759px){
  .door{gap:var(--space-2);padding:var(--space-4) var(--space-5)}
  .door-icon,.door-lead{display:none}
  .door-links a{padding:6px 0;box-sizing:border-box}
  .door-line{display:grid}
  .door-line span{font-size:.9375rem}
}

/* C12W-0707: the offers band, "Where to start" (board SB4): a track label and title, then the track's cards in a row
   (four for Track A, three for Track B). The entry card holds the band's one always-on liquid edge (.liquid); Track B's
   cards are liquid-hover only. Tokens only. */
.offer-track+.offer-track{margin-top:var(--space-8)}
.offer-track-label{margin:0;font-size:.8125rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-blue-light)}
.offer-track-title{margin:var(--space-2) 0 var(--space-5);font-family:var(--font-display);font-weight:800;font-size:clamp(1.75rem,3vw,2.5rem);line-height:1;text-transform:uppercase}
.offer-cards{display:grid;gap:var(--space-4);margin:0;padding:0;list-style:none}
@media (min-width:760px){.offer-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1180px){.offer-cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}.offer-cards-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.offer-card{display:grid;gap:var(--space-3);align-content:start;padding:var(--space-6)}
.offer-card>p{margin:0}
.offer-step{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--snow-300)}
.offer-name{margin:0;font-size:1.3125rem;line-height:1.25;font-weight:600}
.offer-terms{display:grid;gap:var(--space-3);margin:0}
.offer-terms dt{font-size:.8125rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--snow-300)}
.offer-terms dd{margin:var(--space-1) 0 0;font-size:.9375rem;line-height:1.5}
.offer-terms .offer-price{font-size:1.125rem;font-weight:700}
.offer-card .text-link{justify-self:start;margin-top:var(--space-2)}