/* Shared with v2/index.html: token names, type, buttons, wrap and liquid-glass nav.
   2026-10-21 dark design system v1: DARK is the default on every page; light only via the toggle (saved ub-theme).
   The OS preference is no longer followed. New tokens + finish recipes live in ../fx/ub-dark.css (linked by fx/inject.mjs). */
@font-face{font-family:"Montserrat";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/montserrat-latin-wght-normal.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;src:url("../fonts/hanken-grotesk-latin-wght-normal.woff2") format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:italic;font-weight:100 900;font-display:swap;src:url("../fonts/hanken-grotesk-latin-wght-italic.woff2") format("woff2")}
:root {
  --void:#05060c; --hull:#0e1122; --hull-2:#151a30;
  --ink:#f3f4fa; --mute:#b3b8cf; --line:rgba(178,190,255,.12);
  --pink:#ec145a; --pink-fill:#d6125a; --pink-text:#ff7aa6;
  --sheet:#090b16; --sheet-ink:#f3f4fa; --sheet-mute:#b3b8cf; --sheet-link:#8d9bff;
  --blue:#3e4ca8; --green:#18e884;
  --night:#05060c; --on-night:#f3f4fa; --on-night-2:#b3b8cf;
  --link:#8d9bff;
  --nav-bg:rgba(18,22,42,.72); --nav-hover:rgba(255,255,255,.07);
  --nav-hi:rgba(255,255,255,.12); --nav-ring:rgba(178,190,255,.14); --chip:rgba(255,255,255,.08);
  --menu-bg:rgba(5,6,12,.86);
  --logo-d:block; --logo-l:none; --sun:block; --moon:none;
  --glass-tint:rgba(18,22,42,.46); --hair:1px;
  --spring:linear(0,.051,.169,.313,.458,.59,.703,.794,.864,.916,.953,.978,.994,1.004,1.009,1.011,1.011,1.01,1.008,1.007,1.005,1.004,1.003,1.002,1.001,1.001,1);
  --font-display:"Montserrat",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"Hanken Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.32,.72,0,1);
  color-scheme:dark;
}
:root[data-theme="light"] {
  --void:#fbfbfd; --hull:#ffffff; --hull-2:#eef0f7;
  --ink:#14162b; --mute:#4d5270; --line:rgba(20,24,60,.1);
  --pink-fill:#c8104c; --pink-text:#c8104c; --link:#3445b8;
  --sheet:#f4f5fa; --sheet-ink:#14162b; --sheet-mute:#4d5270; --sheet-link:#3445b8;
  --nav-bg:rgba(255,255,255,.72); --nav-hover:rgba(20,24,60,.05);
  --nav-hi:rgba(255,255,255,.9); --nav-ring:rgba(20,24,60,.08); --chip:rgba(20,24,60,.06);
  --glass-tint:rgba(255,255,255,.55); --menu-bg:rgba(251,251,253,.9); --logo-d:none; --logo-l:block; --sun:none; --moon:block;
  color-scheme:light;
}
* { box-sizing:border-box; }
html { background:var(--void); scroll-padding-top:calc(env(safe-area-inset-top,0px) + 164px); }
body { margin:0; background:var(--void); color:var(--ink); font:17px/1.5 var(--font-body); letter-spacing:-.01em; -webkit-font-smoothing:antialiased; }
img { max-width:100%; display:block; height:auto; }
a { color:var(--link); text-decoration:none; }
a:hover { text-decoration:underline; text-underline-offset:4px; }
button, summary, a { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--link); outline-offset:4px; border-radius:6px; }
h1,h2,h3 { margin:0; font-family:var(--font-display); font-weight:600; letter-spacing:-.03em; line-height:1.06; text-wrap:balance; }
p,figure { margin:0; }
.wrap { max-width:1280px; margin:0 auto; padding-inline:max(24px,env(safe-area-inset-left,0px)) max(24px,env(safe-area-inset-right,0px)); }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; }
.skip { position:absolute; z-index:60; left:16px; top:8px; padding:12px 20px; background:var(--hull); transform:translateY(-150%); }
.skip:focus { transform:none; }
/* Content buttons use the home CTA (indigo, white text); contact CTAs (.cta) use the pink spark. */
.btn, .btn:hover { color:var(--btn-ink,#ffffff); }
.global-header { min-height:calc(env(safe-area-inset-top,0px) + 84px); }
.local-header { position:sticky; top:calc(env(safe-area-inset-top,0px) + 84px); z-index:20; background:var(--nav-bg); backdrop-filter:blur(22px) saturate(180%); -webkit-backdrop-filter:blur(22px) saturate(180%); border-bottom:1px solid var(--nav-ring); }
.local-nav { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.local-title { max-width:390px; color:var(--ink); font:700 20px/1.2 var(--font-display); letter-spacing:-.025em; min-height:44px; display:flex; align-items:center; }
.local-actions { display:flex; align-items:center; gap:26px; flex:none; }
.section-links { display:flex; align-items:center; gap:22px; }
.section-links a { color:var(--mute); font-size:13px; min-height:44px; min-width:44px; justify-content:center; display:flex; align-items:center; }
.local-actions .btn { min-height:44px; padding:10px 18px; font-size:14px; }
.hero { padding-top:88px; text-align:center; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; min-height:30px; padding:0 13px 0 11px; border-radius:999px; color:var(--mute); font:600 11.5px/1 var(--font-display); letter-spacing:.14em; text-transform:uppercase;
  background:var(--glass-1,rgba(18,22,42,.46)); box-shadow:inset 0 0 0 var(--hair) var(--stroke-2,rgba(178,190,255,.22)),inset 0 1px 0 rgba(255,255,255,.08); }
.eyebrow::before { content:""; flex:none; width:6px; height:6px; border-radius:50%; background:var(--pink); box-shadow:0 0 10px 1px rgba(236,20,90,.65); }
:root[data-theme="light"] .eyebrow::before { box-shadow:none; }
.hero h1 { margin:18px auto 0; max-width:1080px; font-size:clamp(48px,6.7vw,96px); line-height:1; letter-spacing:-.04em; }
.hero .lede { max-width:720px; margin:24px auto 0; font-size:22px; line-height:1.45; color:var(--mute); }
.hero-link { margin-top:14px; }
.hero figure { margin-top:64px; }
.hero figure img { width:100%; aspect-ratio:16/8; object-fit:cover; border-radius:28px; background:var(--hull-2); }
.hero figure img.screen { object-fit:contain; }
.hero figcaption { margin:12px auto 0; max-width:920px; color:var(--mute); font-size:13px; }
.service-section { padding-block:132px; }
.service-section h2 { font-size:clamp(34px,4.2vw,56px); letter-spacing:-.035em; }
.make-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:48px; }
.make-card { background:var(--hull-2); border-radius:22px; padding:32px; min-width:0; }
.make-card h3 { font-size:21px; line-height:1.25; }
.make-card p { margin-top:12px; color:var(--mute); }
.night { position:relative; background:radial-gradient(60% 70% at 85% 0%,rgba(92,110,255,.2),transparent 70%),radial-gradient(50% 60% at 0% 100%,rgba(130,80,255,.14),transparent 70%),var(--night); color:var(--on-night); --link:#8d9bff; --mute:#b3b8cf; --line:rgba(178,190,255,.12); }
.night :focus-visible { outline-color:#8d9bff; }
.get-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:80px; }
.get-intro p { max-width:400px; margin-top:20px; font-size:19px; color:var(--on-night-2); }
.checklist { margin:0; padding:0; list-style:none; }
.checklist li { display:flex; gap:16px; padding:23px 0; border-bottom:var(--hair) solid rgba(178,190,255,.14); }
.checklist li:first-child { padding-top:0; }
.checklist li:last-child { border-bottom:0; padding-bottom:0; }
.checklist svg { flex:none; color:#8d9bff; margin-top:3px; filter:drop-shadow(0 0 6px rgba(108,125,255,.6)); }
.checklist h3 { font:600 19px/1.4 var(--font-body); letter-spacing:-.01em; }
.checklist p { margin-top:5px; font-size:16px; color:var(--on-night-2); }
.examples-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px 24px; margin-top:48px; }
.examples-grid img { width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:22px; background:var(--hull-2); }
.examples-grid img.screen { object-fit:contain; }
.examples-grid figcaption { margin-top:14px; }
.examples-grid figcaption strong { display:block; font-size:19px; font-weight:600; }
.examples-grid figcaption span { display:block; margin-top:3px; font-size:15px; color:var(--mute); }
.examples-grid.single-example { grid-template-columns:minmax(0,1fr); max-width:780px; }
.example-heading { display:flex; align-items:center; flex-wrap:wrap; gap:6px 12px; }
.examples-grid .status { font-size:12px; line-height:1.4; border:1px solid var(--line); border-radius:999px; padding:4px 10px; }
.examples-note { margin-top:24px; color:var(--mute); font-size:14px; }
.proof-record { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:28px; margin-top:48px; padding-top:32px; border-top:1px solid var(--line); }
.proof-record h3 { font-size:18px; }
.proof-record p { margin-top:10px; color:var(--mute); font-size:16px; }
.process { background:var(--hull-2); padding-block:112px; }
.process h2,.faq h2 { font-size:clamp(32px,3.6vw,44px); }
.process-grid { margin:40px 0 0; padding:0; list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; counter-reset:step; }
.process-grid li { position:relative; min-width:0; border-top:2px solid var(--line); padding-top:18px; counter-increment:step; }
.process-grid li.on { border-color:var(--indigo-400,#6c7dff); }
.process-grid li.on::before { content:""; position:absolute; right:0; top:20px; width:10px; height:10px; border-radius:50%; background:var(--indigo-400,#6c7dff); box-shadow:0 0 12px 2px rgba(108,125,255,.6); }
.step-number { display:block; color:var(--mute); font-size:13px; margin-bottom:16px; font-variant-numeric:tabular-nums; }
.process-grid h3 { color:var(--mute); font-size:19px; line-height:1.3; }
.process-grid li.on h3 { color:var(--ink); }
.process-grid p { margin-top:8px; color:var(--mute); font-size:16px; }
.engagements { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin-top:56px; padding-top:32px; border-top:1px solid var(--line); }
.engagements h3 { font-size:18px; }
.engagements p { margin-top:8px; color:var(--mute); font-size:16px; }
.engagements span { display:block; margin-top:12px; color:var(--mute); font-size:13px; }
.faq .wrap { max-width:908px; }
.faq-list { margin-top:32px; }
.faq details { border-bottom:1px solid var(--line); }
.faq summary { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:28px; padding-block:18px; cursor:pointer; list-style:none; font-size:19px; font-weight:600; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; flex:none; font-size:26px; font-weight:400; color:var(--mute); }
.faq details[open] summary::after { content:"−"; }
.faq details p { max-width:720px; padding:0 36px 24px 0; color:var(--mute); line-height:1.6; }
.cta { text-align:center; }
.cta h2 { max-width:920px; margin-inline:auto; font-size:clamp(42px,5.6vw,80px); line-height:1.03; }
.cta .lede { max-width:620px; margin:24px auto 0; font-size:21px; color:var(--on-night-2); }
.cta .btn { margin-top:36px; padding:16px 34px; min-height:56px; }   /* fill, ink and shadow: button tokens in fx/ub-dark.css (silver on the night band) */
.other-services { margin-top:40px; }
.other-services p { font-size:14px; color:var(--on-night-2); }
.other-links { display:flex; flex-wrap:wrap; justify-content:center; column-gap:24px; row-gap:0; margin:12px auto 0; max-width:1000px; }
.other-links a { display:inline-flex; align-items:center; min-height:44px; font-size:15px; }
.industry-link { margin-top:28px; }
.short .service-section { padding-block:88px; }
.short .process { padding-block:80px; }
@media (max-width:1100px) {
  .local-title { font-size:18px; max-width:320px; }
  .local-actions { gap:18px; } .section-links { gap:16px; }
  .get-layout { gap:48px; }
}
@media (max-width:900px) {
  .section-links { display:none; }
  .make-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .proof-record { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
  .wrap { padding-inline:max(16px,env(safe-area-inset-left,0px)) max(16px,env(safe-area-inset-right,0px)); }
  .local-nav { min-height:68px; gap:10px; }
  .local-title { font-size:16px; max-width:215px; }
  .local-actions { flex-shrink:0; }
  .local-actions .btn { padding-inline:16px; font-size:13px; white-space:nowrap; }
  .hero { padding-top:56px; }
  .eyebrow { font-size:11px; letter-spacing:.08em; }
  .hero h1 { font-size:clamp(40px,11.3vw,60px); line-height:1.04; margin-top:16px; }
  .hero .lede { font-size:18px; margin-top:20px; }
  .hero figure { margin-top:36px; }
  .hero figure img { border-radius:18px; }
  .hero figcaption { font-size:12px; text-wrap:pretty; }
  .service-section,.short .service-section { padding-block:72px; }
  .service-section h2 { font-size:34px; }
  .make-grid,.examples-grid,.process-grid,.get-layout,.proof-record,.engagements { grid-template-columns:minmax(0,1fr); }
  .make-grid,.examples-grid { margin-top:32px; }
  .make-card { padding:28px; }
  .get-layout { gap:36px; }
  .process,.short .process { padding-block:72px; }
  .process-grid { gap:28px; margin-top:32px; }
  .step-number { margin-bottom:8px; }
  .examples-grid { gap:32px; }
  .examples-grid img { border-radius:18px; }
  .faq summary { font-size:18px; gap:20px; }
  .cta h2 { font-size:42px; }
  .cta .lede { font-size:18px; }
  .other-links { flex-direction:column; align-items:center; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
}
@media (scripting:none) { .tbtn { display:none; } }
::view-transition-old(root),::view-transition-new(root) { animation:none; mix-blend-mode:normal; }

/* Round 2 additions: the original service rules and tokens above remain intact. */
[hidden] { display:none!important; }
.content-page .hero-actions { display:flex; justify-content:center; margin-top:30px; }
.content-page .hero-actions .btn { padding:15px 28px; }
.content-page .text-hero { padding-bottom:20px; }
.content-page .section-lead { margin-top:24px; max-width:760px; font-size:21px; color:var(--mute); }
.content-page .section-note { margin-top:32px; max-width:880px; color:var(--mute); }
.content-page .night .section-lead,.content-page .night .section-note { color:var(--on-night-2); }
.content-page .two-column { grid-template-columns:repeat(2,minmax(0,1fr)); }
.content-page .plain-list { padding-left:1.2em; margin:24px 0 0; }
.content-page .plain-list li + li { margin-top:12px; }
.content-page .make-card .plain-list { color:var(--mute); }
.content-page .prose { max-width:760px; margin-top:32px; font-size:20px; line-height:1.65; }
.content-page .prose p + p { margin-top:24px; }
.reading-page .hero .last-updated { margin-top:24px; color:var(--mute); font-size:14px; }
.reading-page .service-section { padding-block:40px; }
.reading-page .service-section:last-child { padding-bottom:88px; }
.reading-page .service-section > .wrap { max-width:808px; }
.reading-page .service-section h2 { font-size:clamp(28px,3.2vw,38px); }
.reading-page .prose { margin-top:24px; font-size:18px; }
.reading-page .prose > * + * { margin-top:24px; }
.reading-page .prose code { font-size:.9em; overflow-wrap:anywhere; }
.reading-page .table-scroll { margin-top:24px; }
.content-page .prose .pull-line { padding:24px 0 24px 28px; border-left:3px solid var(--link); font-size:24px; line-height:1.45; }
.content-page .facts-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; margin:0; padding-block:32px; border-block:1px solid var(--line); }
.content-page .facts-strip dt { font-size:13px; color:var(--mute); margin-bottom:8px; }
.content-page .facts-strip dd { margin:0; font-size:17px; }
.content-page .stats-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin:40px 0 0; }
.content-page .stats-grid > div { padding:28px 24px; background:var(--hull-2); border-radius:22px; min-width:0; }
.content-page .stats-grid dt { font-size:15px; color:var(--mute); }
.content-page .stats-grid dd { margin:16px 0 0; }
.content-page .stats-grid dd strong { font:700 clamp(26px,3vw,42px)/1.1 var(--font-display); letter-spacing:-.03em; display:block; overflow-wrap:anywhere; }
.content-page .stats-grid dd span { display:block; margin-top:14px; font-size:14px; color:var(--mute); }
.content-page .table-scroll { overflow-x:auto; margin-top:36px; border-block:1px solid var(--line); -webkit-overflow-scrolling:touch; }
.content-page table { width:100%; border-collapse:collapse; font-size:17px; line-height:1.5; }
.content-page th,.content-page td { text-align:left; vertical-align:top; padding:22px 24px 22px 0; border-bottom:1px solid var(--line); min-width:140px; }
.content-page thead th { font-weight:600; font-size:14px; color:var(--mute); }
.content-page tbody th { font-weight:600; min-width:190px; }
.content-page tr:last-child > * { border-bottom:0; }
.content-page td:last-child,.content-page th:last-child { padding-right:0; }
.content-page .timeline { margin:40px 0 0; padding:0; list-style:none; max-width:1000px; }
.content-page .timeline li { display:grid; grid-template-columns:minmax(140px,1fr) minmax(0,3fr); gap:40px; padding:28px 0; border-top:1px solid var(--line); }
.content-page .timeline li:first-child { border-color:var(--link); }
.content-page .timeline-when { color:var(--link); font-weight:600; }
.content-page .timeline h3 { font-size:21px; line-height:1.3; }
.content-page .timeline p { margin-top:10px; max-width:680px; color:var(--mute); }
.content-page .timeline-source { display:block; font-size:13px; margin-top:12px; color:var(--mute); }
.copy-placeholder { display:inline; border-radius:4px; box-decoration-break:clone; -webkit-box-decoration-break:clone; padding:2px 4px; background:var(--hull-2); color:var(--pink-text); border:1px dashed currentColor; font-size:.9em; line-height:1.7; overflow-wrap:anywhere; }
.night .copy-placeholder { background:#151a30; color:#ff7aa6; }
.content-page .stats-grid dd .copy-placeholder { display:inline; color:var(--pink-text); }
.content-page .portrait-placeholder { aspect-ratio:4/3; display:grid; place-items:center; padding:28px; border:1px dashed var(--mute); border-radius:16px; margin-bottom:28px; color:var(--mute); text-align:center; }
.content-page .person-role { font-size:15px; }
.content-page .film-poster { margin-top:48px; scroll-margin-top:96px; }
.content-page .film-poster > img { width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:28px; }
.content-page .film-poster figcaption { margin-top:20px; }
.content-page .film-poster figcaption strong { display:block; font-size:21px; margin-block:12px 4px; }
.content-page .film-poster figcaption p { color:var(--mute); }
.content-page .film-poster .status { display:inline-flex; border:1px solid var(--line); border-radius:999px; padding:4px 12px; font-size:13px; }
.content-page .simulation-posters { margin-top:64px; }
.content-page .simulation-posters img { aspect-ratio:16/9; object-fit:contain; }
.content-page .fine-print { padding-block:40px; }
.content-page .fine-print .prose { margin:0; max-width:1000px; font-size:14px; color:var(--mute); }
.content-page .contact-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:80px; }
.content-page #brief-title { font-size:clamp(30px,3.6vw,44px); }
.content-page .contact-side { align-self:start; background:var(--hull-2); border-radius:22px; padding:36px; }
.content-page .contact-side h2 { font-size:26px; line-height:1.2; }
.content-page .contact-side p { margin-top:18px; color:var(--mute); }
.content-page .contact-side .contact-channel { color:var(--ink); font-weight:600; }
.content-page form { margin-top:36px; }
.content-page .preview-note { margin-top:24px; }
.content-page .preview-note + form { margin-top:12px; }
.content-page .field { margin:0 0 26px; padding:0; min-width:0; border:0; }
.content-page .field-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.content-page .field label,.content-page .field legend { font-weight:600; display:block; padding:0; margin-bottom:10px; }
.content-page input:not([type="checkbox"]),.content-page textarea,.content-page select { display:block; width:100%; min-height:52px; padding:13px 16px; background:var(--hull); color:var(--ink); border:1px solid var(--mute); border-radius:12px; font:inherit; }
.content-page textarea { resize:vertical; }
.content-page input::placeholder,.content-page textarea::placeholder { color:var(--mute); opacity:1; }
.content-page .field-help { color:var(--mute); font-size:14px; margin-top:8px; }
.content-page .field-error { color:var(--pink-text); font-size:15px; margin-top:8px; }
.content-page [aria-invalid="true"] { border-color:var(--pink-text); }
.content-page .chips { display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.content-page .field .choice { display:flex; align-items:center; min-height:48px; gap:10px; border:1px solid var(--mute); border-radius:999px; padding:10px 16px; margin:0; font-size:15px; font-weight:400; cursor:pointer; }
.content-page .choice:has(input:checked) { background:var(--hull-2); border-color:var(--link); }
.content-page .choice input { width:18px; height:18px; margin:0; accent-color:var(--pink-fill); flex:none; }
.content-page .choice:focus-within { outline:3px solid var(--link); outline-offset:3px; }
.content-page .form-submit { padding:16px 30px; cursor:pointer; }
.content-page .form-submit:disabled { opacity:.55; cursor:default; }
.content-page .privacy { margin-top:18px; max-width:580px; }
.content-page .form-summary { padding:18px 22px; border:1px solid var(--pink-text); border-radius:12px; margin-bottom:28px; }
.content-page .form-success { margin-top:36px; padding:32px; background:var(--hull-2); border-radius:22px; }
.content-page .form-success h3 { font-size:28px; line-height:1.2; }
.content-page .form-success p { margin-top:16px; color:var(--mute); }
.content-page .form-success a { margin-top:18px; }
.content-page .honeypot { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media (max-width:1100px) {
 .content-page .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .content-page .contact-layout { gap:40px; }
 .content-page .contact-side { padding:28px; }
}
@media (max-width:800px) {
 .content-page .contact-layout { grid-template-columns:minmax(0,1fr); }
 .content-page .facts-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px) {
 .content-page .two-column,.content-page .stats-grid,.content-page .facts-strip,.content-page .field-pair { grid-template-columns:minmax(0,1fr); }
 .content-page .section-lead,.content-page .prose { font-size:18px; }
 .content-page .timeline li { grid-template-columns:minmax(0,1fr); gap:12px; }
 .content-page .table-scroll { margin-right:0; }
 .content-page th,.content-page td { min-width:125px; padding:18px 18px 18px 0; font-size:15px; }
 .content-page tbody th { min-width:150px; }
 .content-page .stats-grid dd strong { font-size:34px; }
 .content-page .film-poster > img { border-radius:18px; }
 .content-page .contact-side { padding:28px; }
 .content-page .prose .pull-line { font-size:21px; padding-left:20px; }
}

/* BEGIN keep in sync with v2/index.html: liquid glass + nav + footer */
/* ---------- buttons: pill with a nested icon island ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:14px;min-height:52px;padding:6px 6px 6px 24px;border-radius:999px;border:0;
  font:600 16px/1 var(--font-body);color:var(--btn-ink,#fff);background:var(--btn-fill,var(--grad-btn,#4a5be8));cursor:pointer;transition:transform .5s var(--ease),filter .3s,box-shadow .4s var(--ease)}
.btn:hover{color:var(--btn-ink,#fff);filter:brightness(1.08)}
.btn.spark{background:var(--grad-spark,#d6125a)}
.btn:active{transform:scale(.97)}
.btn .ico{width:40px;height:40px;border-radius:50%;background:var(--btn-ico,rgba(255,255,255,.16));display:grid;place-items:center;transition:transform .5s var(--ease)}
.btn:hover .ico{transform:translate(3px,-2px) scale(1.06)}
.btn.ghost{background:transparent;--glass-tint:rgba(255,255,255,.1);color:#fff}
.btn.ghost:hover{background:rgba(255,255,255,.06);color:#fff}
.tlink{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:600}
.tlink svg{transition:transform .4s var(--ease)}
.tlink:hover svg{transform:translateX(4px)}

/* ---------- island nav ---------- */
.nav{position:fixed;z-index:30;top:calc(env(safe-area-inset-top,0px) + 14px);left:50%;transform:translateX(-50%);
  display:flex;align-items:center;gap:6px;padding:6px 6px 6px 18px;border-radius:999px;width:max-content;max-width:calc(100vw - 24px);
  box-shadow:0 1px 1px rgba(0,0,0,.16),0 14px 34px -14px rgba(0,0,0,.5)}
.nav .logo{height:20px;width:213px;fill:var(--ink);display:block}
footer .fine .flogo{height:46px;width:242px;max-width:100%;fill:var(--ink)}
@media (min-width:820px) and (max-width:1023px){.nav .logo{height:15px;width:160px}.nav .links a{padding:0 10px}}
@media (min-width:820px) and (max-width:959px){.nav .logo{height:14px;width:149px}.nav .links a{padding:0 6px;font-size:13px;white-space:nowrap}.nav>.btn,.nav .btn{white-space:nowrap}}
@media (min-width:820px) and (max-width:859px){.nav{gap:3px}.nav .logo{height:13px;width:139px}.nav>a[aria-label]{margin-right:6px}}
@media (max-width:819px){.nav .logo{height:17px;width:181px}}
@media (max-width:374px){.nav .logo{height:14px;width:149px}}
.nav>a[aria-label]{display:flex;align-items:center;min-height:44px;margin-right:14px}
.nav .links{display:flex;gap:2px}
.nav .links a{color:var(--ink);font-size:14px;padding:0 14px;min-height:44px;display:flex;align-items:center;border-radius:999px;transition:background-color .3s}
.nav .links a:hover{background:var(--nav-hover)}
.ld{display:var(--logo-d)}.ll{display:var(--logo-l)}
.tbtn{width:44px;height:44px;border-radius:50%;border:0;background:var(--chip);color:var(--ink);display:grid;place-items:center;cursor:pointer;margin-left:4px;flex:none}
.tbtn .sun{display:var(--sun)}.tbtn .moon{display:var(--moon)}
.tbtn svg{transition:transform .7s var(--spring)}.tbtn:hover svg{transform:rotate(30deg) scale(1.08)}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
.nav .btn{min-height:44px;padding:4px 4px 4px 18px;font-size:14px;gap:10px;margin-left:6px}
.nav .btn .ico{width:36px;height:36px}
.burger{display:none;width:44px;height:44px;border-radius:50%;border:0;background:var(--chip);position:relative;cursor:pointer;margin-left:6px}
.burger span{position:absolute;left:13px;right:13px;height:1.6px;background:var(--ink);border-radius:2px;transition:transform .5s var(--ease),top .5s var(--ease)}
.burger span:nth-child(1){top:17px}.burger span:nth-child(2){top:25px}
.menu-open .burger span:nth-child(1){top:21px;transform:rotate(45deg)}
.menu-open .burger span:nth-child(2){top:21px;transform:rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:25;background:var(--menu-bg);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);
  padding:calc(env(safe-area-inset-top,0px) + 110px) max(24px,env(safe-area-inset-right,0px)) 40px max(24px,env(safe-area-inset-left,0px));
  display:flex;flex-direction:column;gap:6px;opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility .45s}
.menu-open .menu{opacity:1;visibility:visible;transition:opacity .45s var(--ease),visibility 0s}
.menu a{font:700 40px/1.1 var(--font-display);letter-spacing:-.03em;color:var(--ink);min-height:56px;display:flex;align-items:center;
  transform:translateY(40px);opacity:0;transition:transform .8s var(--ease),opacity .6s var(--ease)}
.menu-open .menu a{transform:none;opacity:1}
.menu a:nth-child(2){transition-delay:.05s}.menu a:nth-child(3){transition-delay:.1s}.menu a:nth-child(4){transition-delay:.15s}.menu a:nth-child(5){transition-delay:.2s}
@media (max-width:819px){.hero-cap{display:none}.nav .links,.nav .btn{display:none}.burger{display:block}.nav{gap:0}
  html:not(.nav-ready) .burger{display:none}html:not(.nav-ready) .nav .links{display:flex;flex-wrap:wrap}html:not(.nav-ready) .nav{flex-wrap:wrap;border-radius:26px}}

footer{border-top:1px solid var(--line);padding-block:72px 40px;font-size:14px;color:var(--mute);position:relative}
/* contact-dock 2026-10-29: CSS-only layout so the footer markup (copied into every page by pages/chrome.mjs) stays as it is.
   Brand (logo + description) beside the link columns, offices in a row, fine print last. .fine is flattened into the grid. */
footer::before{content:"";position:absolute;left:12%;right:12%;top:-1px;height:1px;background:linear-gradient(90deg,transparent,var(--indigo-300),transparent);opacity:.55}
footer .wrap{display:grid;grid-template-columns:minmax(0,1fr);row-gap:28px;grid-template-areas:"logo" "desc" "cols" "loc" "rule" "note" "sister" "copy"}
footer .fine{display:contents}
footer .fine .flogo{grid-area:logo;justify-self:start}
footer .footer-description{grid-area:desc;margin:0;max-width:440px;font-size:14px;line-height:1.6;color:var(--mute)}
footer .cols{grid-area:cols;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px;align-content:start}
footer b{display:block;color:var(--ink);font:600 11px/1.2 var(--font-display);letter-spacing:.14em;text-transform:uppercase;margin-bottom:8px}
footer a{display:flex;align-items:center;min-height:44px;color:var(--mute);line-height:1.3}
footer a:hover{color:var(--ink)}
footer .footer-locations{grid-area:loc;margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:20px 32px;color:var(--mute)}
footer .footer-locations>div{padding-top:18px;border-top:1px solid var(--line)}
footer .footer-locations b{margin-bottom:6px;font:600 13px/1.4 var(--font-body);letter-spacing:-.005em;text-transform:none}
footer .footer-locations p{margin:0;font-size:13px;line-height:1.5}
footer .footer-locations a{display:inline-flex;font-weight:600;color:var(--ink)}
footer .wrap::before{content:"";grid-area:rule;border-top:1px solid var(--line)}
footer .fine>span{font-size:12px;line-height:1.55;color:var(--mute)}
footer .fine>span:nth-of-type(1){grid-area:note;max-width:760px}
footer .fine>span:nth-of-type(2){grid-area:sister}
footer .fine>span:nth-of-type(3){grid-area:copy}
footer .fine img{height:24px;width:auto}
@media (pointer:fine){footer .cols a{min-height:32px;padding-block:5px}}
@media (min-width:820px){
  footer .cols{grid-template-columns:minmax(0,1.7fr) repeat(3,minmax(0,1fr))}
  footer .footer-locations{grid-template-columns:repeat(2,minmax(0,1fr))}
  footer .wrap{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"logo logo" "desc desc" "cols cols" "loc loc" "rule rule" "note note" "sister copy"}
  footer .fine>span:nth-of-type(3){justify-self:end}
}
@media (min-width:1100px){
  footer .wrap{grid-template-columns:minmax(0,3.6fr) minmax(0,8.4fr);grid-template-rows:auto 1fr;column-gap:72px;row-gap:24px;
    grid-template-areas:"logo cols" "desc cols" "loc loc" "rule rule" "note note" "sister copy"}
  footer .footer-locations{margin-top:24px}
}

/* ---------- liquid glass (skill liquid-glass-web): chrome only, never on content ---------- */
@property --a{syntax:"<angle>";inherits:true;initial-value:-60deg}
@media (min-resolution:2dppx){:root{--hair:.5px}}
.glass>.warp,.glass>.tint,.glass>.depth,.glass>.rim,.glass>.spec{position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.glass>.warp{overflow:hidden;-webkit-backdrop-filter:blur(12px) saturate(170%) brightness(1.04);backdrop-filter:blur(12px) saturate(170%) brightness(1.04)}
.lg-refract .glass[data-refract]>.warp{backdrop-filter:var(--lgf) saturate(165%) brightness(1.05)}
.glass>.tint{background:var(--glass-tint)}
.glass>.depth{box-shadow:inset 0 1px 0 rgba(255,255,255,.28),inset 0 -1px 1px rgba(0,0,0,.22),inset 0 0 18px rgba(255,255,255,.07),inset 0 -10px 18px -12px rgba(0,0,0,.3)}
.glass>.rim{padding:var(--hair);background:linear-gradient(calc(var(--a) + 90deg),rgba(255,255,255,.66),rgba(190,200,255,.16) 22%,rgba(190,200,255,.05) 50%,rgba(190,200,255,.14) 78%,rgba(255,255,255,.44));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:--a .6s var(--ease)}
.glass>.rim.soft{padding:2px;filter:blur(1.5px);opacity:.45}
.glass>.spec{opacity:0;background:radial-gradient(130px 64px at var(--mx,50%) var(--my,0%),rgba(255,255,255,.24),#0000 70%);transition:opacity .4s}
.glass:hover>.spec{opacity:1}
.glass>:not(.warp):not(.tint):not(.depth):not(.rim):not(.spec){position:relative}
/* solid pink buttons get the same moving rim + a pointer hotspot (shine without glass) */
.btn{box-shadow:var(--btn-shadow)}
.btn:not(.glass):hover{box-shadow:var(--btn-shadow-hover)}
.btn.spark{box-shadow:inset 0 1px 0 rgba(255,255,255,.32),inset 0 -1px 0 rgba(0,0,0,.22),0 0 0 var(--hair) rgba(255,140,180,.45),0 10px 28px -10px rgba(214,18,90,.6),0 0 54px -12px rgba(236,20,90,.45)}
.btn:not(.glass)::before,.btn:not(.glass)::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
.btn:not(.glass)::before{padding:var(--hair);background:linear-gradient(calc(var(--a) + 90deg),rgba(255,255,255,.8),rgba(255,255,255,.12) 25%,rgba(255,255,255,.04) 50%,rgba(255,255,255,.14) 75%,rgba(255,255,255,.55));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:--a .6s var(--ease)}
.btn:not(.glass)::after{background:radial-gradient(90px 46px at var(--mx,50%) var(--my,0%),rgba(255,255,255,.28),#0000 70%);opacity:0;transition:opacity .4s}
.btn:not(.glass):hover::after{opacity:1}
.btn>*{position:relative}
.pv-panel.glass>.warp,.pv-panel.glass>.tint{display:none}
@media (prefers-reduced-transparency:reduce){
  .menu{background:var(--void);-webkit-backdrop-filter:none;backdrop-filter:none}
  .form .core{background:#121216;-webkit-backdrop-filter:none;backdrop-filter:none}
  .seq-tag{background:#121216;-webkit-backdrop-filter:none;backdrop-filter:none}
  .pv-sheet .pv-panel{background:var(--hull);-webkit-backdrop-filter:none;backdrop-filter:none}
  .btn.ghost{background:#121216}
  .btn.ghost>.warp,.btn.ghost>.tint{background:#121216}
  .glass>.warp,.lg-refract .glass[data-refract]>.warp{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--hull)}
  .glass>.spec,.glass>.rim.soft{display:none}
}
@media (prefers-contrast:more){.glass>.tint{background:rgba(10,10,14,.85)}.glass>.rim{padding:1px;background:#fff}}
@media (prefers-reduced-motion:reduce){.glass>.rim,.btn::before{transition:none}}

footer .cols span{display:block;line-height:2.1}
/* END keep in sync */

/* Page integration around the verbatim home chrome. */
.global-header .nav { --pink-fill:#d6125a; }
.global-header .nav .btn { color:var(--btn-ink,#fff); }
.global-header .nav a:hover,footer a:hover { text-decoration:none; }
/* Round 5 accessibility fixes stay outside the refreshed homepage CSS block. */
.btn,.other-links a { min-width:44px; }
.nav > a:has(.logo) { display:flex; align-items:center; min-height:44px; min-width:44px; }
footer a { display:flex; align-items:center; min-height:44px; }
@media (prefers-reduced-transparency:reduce) {
  .local-header,.menu { background:var(--hull); backdrop-filter:none; -webkit-backdrop-filter:none; }
  :root .btn.ghost,:root .btn.ghost:hover { background:#121216; color:#ffffff; }
  .btn.ghost > .warp,.btn.ghost > .tint { background:#121216; backdrop-filter:none; -webkit-backdrop-filter:none; }
}
/* No refraction class, filter definitions or SVG filter script is installed on pages. */
.retina { margin-inline:auto; }
/* Home's CSS reveal values, enabled only when the OS allows motion. */
@supports (animation-timeline: view()) {
  html.motion .rv { animation:rise linear both; animation-timeline:view(); animation-range:entry 0% entry 70%; }
  @keyframes rise { from { opacity:0; transform:translateY(44px); } }
}
/* An unenhanced phone menu remains in the document flow, so all links work without JS. */
html:not(.nav-ready) .burger,html:not(.nav-ready) .tbtn { display:none; }
@media (min-width:820px) { html:not(.nav-ready) .menu { display:none; } }
@media (max-width:819px) {
  html:not(.nav-ready) .menu {
    position:relative; inset:auto; z-index:auto; visibility:visible; opacity:1;
    padding:calc(env(safe-area-inset-top,0px) + 92px) 24px 24px;
    background:var(--hull); backdrop-filter:none; -webkit-backdrop-filter:none; transition:none;
  }
  html:not(.nav-ready) .menu a {
    font:600 17px/1.4 var(--font-body); letter-spacing:normal; min-height:44px;
    transform:none; opacity:1; transition:none;
  }
}
/* BEGIN industries dropdown */
/* Main-menu Industries item (structure v8): opens on hover or keyboard focus, so it works without JS; Escape closes (theme.js). */
.nav-drop { position:relative; display:flex; }
.nav .nav-drop-top { gap:6px; }
.nav-chev { flex:none; transition:transform .3s var(--ease); }
.nav-drop-panel { position:absolute; top:100%; left:50%; z-index:31; min-width:264px; margin-top:10px; padding:8px; display:grid; gap:2px; border-radius:20px; background:var(--hull); border:1px solid var(--line); box-shadow:0 18px 40px -18px rgba(0,0,0,.45); opacity:0; visibility:hidden; transform:translate(-50%,-6px); transition:opacity .25s var(--ease),transform .25s var(--ease),visibility 0s .25s; }
.nav-drop-panel::before { content:""; position:absolute; left:0; right:0; top:-12px; height:12px; }
.nav-drop:is(:hover,:focus-within):not(.nav-drop-shut) .nav-drop-panel { opacity:1; visibility:visible; transform:translate(-50%,0); transition:opacity .25s var(--ease),transform .25s var(--ease),visibility 0s; }
.nav-drop:is(:hover,:focus-within):not(.nav-drop-shut) .nav-chev { transform:rotate(180deg); }
.nav .nav-drop-panel a { min-height:40px; padding:0 14px; border-radius:12px; white-space:nowrap; }
.nav .nav-drop-panel .nav-drop-all { margin-top:4px; padding-top:2px; border-top:1px solid var(--line); color:var(--link); font-weight:600; }
@media (min-width:820px) and (max-width:1023px) { .nav .links a { padding:0 10px; } .nav > a[aria-label] { margin-right:8px; } }
.menu a:nth-child(6) { transition-delay:.25s; }
@media (prefers-reduced-motion:reduce) { .nav-drop-panel,.nav-chev { transition:none; } }
/* END industries dropdown */
/* Case studies link (station-lab lane 2026-10-29): at 820-959 px the pill would overflow, so the home-only "How we work" anchor (also in the footer and phone menu) and the button arrow step aside. Same block in index.html and pages/service.css. */
@media (min-width:820px) and (max-width:959px){.nav .links>a[href$="#process"]{display:none}.nav>.btn .ico{display:none}}

/* BEGIN v8 service sections (lane home-services, 2026-10-21): overview lead, specialist accordions, tools + logos */
.make-lead { max-width:760px; margin-top:20px; font-size:19px; line-height:1.55; color:var(--mute); }
.spec-lead { max-width:760px; margin-top:20px; }
.spec-lead p { margin-top:14px; font-size:18px; line-height:1.55; color:var(--mute); }
.spec .eyebrow { margin-bottom:14px; }
.spec-h3 { margin-top:48px; font-size:21px; line-height:1.25; letter-spacing:-.015em; }
.spec-list { max-width:908px; margin-top:12px; }
.spec-list details p { max-width:760px; }
.spec-block { max-width:760px; }
.spec-block p { margin-top:12px; color:var(--mute); line-height:1.6; }
.spec-cols { grid-template-columns:repeat(2,minmax(0,1fr)); }
.spec-cols .make-card p { line-height:1.55; }
.spec-tech { font-size:14px; }
.spec-note { max-width:760px; }
.make-card h3 a { color:inherit; text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:4px; display:inline-flex; min-height:44px; align-items:center; }
.make-card h3 a:hover { color:var(--link); text-decoration-color:currentColor; }
.tools-lead { max-width:760px; margin-top:20px; font-size:18px; line-height:1.55; color:var(--mute); }
.logo-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; margin:40px 0 0; padding:0; list-style:none; }
.logo-tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:112px; padding:18px 12px; border-radius:18px; background:var(--hull-2); color:var(--ink); text-align:center; font-size:14px; font-weight:600; line-height:1.3; }
.logo-tile.name-only { font:700 16px/1.25 var(--font-display); letter-spacing:-.01em; }
.logo-mark { flex:none; }
.tools-note { max-width:760px; line-height:1.5; }
.tool-list { margin:0; padding:0 0 18px; display:grid; gap:16px; }
.tool-list div { max-width:760px; }
.tool-list dt { font-weight:600; }
.tool-list dt span { display:block; font-size:13px; font-weight:400; color:var(--mute); }
.tool-list dd { margin:4px 0 0; color:var(--mute); line-height:1.6; }
@media (max-width:900px) { .logo-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:600px) {
  .make-lead,.spec-lead p,.tools-lead { font-size:17px; }
  .spec-cols { grid-template-columns:minmax(0,1fr); }
  .logo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:28px; }
  .logo-tile { min-height:96px; }
  .spec-h3 { margin-top:36px; }
  /* long v8 CTA labels: the local-nav button may wrap to two lines instead of pushing past the viewport */
  .local-title { min-width:0; }
  .local-actions { flex-shrink:1; min-width:0; }
  .local-actions .btn { white-space:normal; max-width:172px; text-align:center; line-height:1.2; padding-block:8px; }
}
/* END v8 service sections */
/* contact quick actions (final integration, lead 2026-10-29): email and call, beside the brief form */
.contact-quick{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 24px}
.contact-quick .btn{padding:6px 22px;min-height:48px;gap:8px}
/* in-text links are underlined, not colour-only (a11y link-in-text-block, final integration 2026-10-29) */
.contact-layout .field-help a,.contact-layout .privacy a{text-decoration:underline;text-underline-offset:3px}
