/* SpokenKey v6 — "dark, cinematic". Loaded after site.css and app.css.
   The page goes near-black; SpokenKey's own (light) UI glows on it like a lit screen. Orange stays the one accent. */

:root {
  --paper: #0b0d10;
  --paper-2: #0f1216;
  --surface: #161a20;
  --surface-2: #1d222a;
  --ink: #f2f3f5;
  --ink-2: #a7adb9;          /* on --paper ≈ 8.4:1 */
  --line: #252a33;
  --line-strong: #3a414d;
  --signal: #ff5b1f;          /* fills; dark ink on it ≈ 6.9:1 */
  --signal-ink: #ff8a57;      /* orange text on --paper ≈ 7.7:1 */
  --signal-soft: rgba(255, 91, 31, 0.16);
  --night: #050607;
  --night-2: #12151a;
  --night-line: #232831;
  --on-night: #f2f3f5;
  --on-night-2: #a7adb9;
  --signal-night: #ff8a57;
  --focus: #7aa2ff;           /* on --paper ≈ 7.9:1 */
  --shadow: 0 0 0 1px rgba(255, 255, 255, 0.05), 0 30px 80px -30px rgba(0, 0, 0, 0.8);
  --shadow-lift: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 40px 100px -30px rgba(0, 0, 0, 0.85);
  --glow: radial-gradient(60% 55% at 50% 45%, rgba(255, 91, 31, 0.16), rgba(255, 91, 31, 0) 70%);
  color-scheme: dark;
}

body { background: var(--paper); }
::selection { background: rgba(255, 91, 31, 0.35); color: #fff; }

/* Header floats on the dark */
.site-header { background: transparent; position: relative; z-index: 5; }
.brand-mark rect:first-child { fill: #161a20; stroke: #3a414d; }
.brand-mark path { stroke: #3a414d; }

/* Keycaps, dark edition: graphite caps with a deep edge; the primary is lit orange */
.key { --k-bg: #1b1f26; --k-fg: var(--ink); --k-edge: #000; border-color: #343a45; box-shadow: 0 3px 0 #000, inset 0 1px 0 rgba(255, 255, 255, 0.06); }
.key:active { box-shadow: 0 1px 0 #000, inset 0 1px 0 rgba(255, 255, 255, 0.06); }
.key-primary { --k-bg: var(--signal); --k-fg: #0c0f14; border-color: #ff7a45; box-shadow: 0 3px 0 #8a2f08, 0 10px 30px -8px rgba(255, 91, 31, 0.55); }
.key-primary:active { box-shadow: 0 1px 0 #8a2f08, 0 6px 18px -8px rgba(255, 91, 31, 0.5); }
.key-quiet { border-color: var(--line-strong); box-shadow: none; }
@media (hover: hover) and (pointer: fine) {
  .key-primary:hover { --k-bg: #ff6d33; }
  .key:not(.key-primary):not(.key-quiet):hover { --k-bg: #232832; }
}
.menu-btn { background: #1b1f26 !important; color: var(--ink) !important; border-color: #343a45 !important; box-shadow: 0 2px 0 #000 !important; }

/* Hero: a spotlight behind the product */
.hero { position: relative; }
.hero::before { content: ""; position: absolute; inset: -10% -10% 0 30%; background: var(--glow); pointer-events: none; }
.hero .wrap { position: relative; }
.hero h1 { color: #fff; }
.hero h1 em { color: #fff; }
.hscene .stagebg { background: radial-gradient(90% 80% at 60% 20%, #1f242d 0%, #12151a 60%, #0d1014 100%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
.hscene .hint { color: var(--ink-2); }
.hscene .hint b { color: var(--ink); }
.tryit { color: var(--ink); }

/* SpokenKey's light UI as lit screens on the dark stage */
[data-app] .win, [data-app] .dest { box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 30px 90px -20px rgba(0, 0, 0, 0.9), 0 0 120px -30px rgba(255, 140, 90, 0.25); }
[data-app] .cuemenu { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2), 0 24px 60px -12px rgba(0, 0, 0, 0.7); }
[data-app] .kbd { background: linear-gradient(#22262d, #15181d); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 30px 60px -30px rgba(0, 0, 0, 0.9); }
[data-app] .k { background: linear-gradient(#2a2f37, #1f232a); color: #c9ced6; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 4px 0 #090a0c, 0 8px 14px rgba(0, 0, 0, 0.5); }
[data-app] .k small { color: #8d94a0; }
[data-app] .k.fn { color: #fff; }
[data-app] .k.fn::after { box-shadow: 0 0 0 3px #ff7a45, 0 0 24px 2px rgba(255, 91, 31, 0.6); }
[data-app] .menubar { background: rgba(28, 32, 39, 0.92); color: #e7e9ee; border-bottom-color: rgba(255, 255, 255, 0.06); }
[data-app] .menubar .cue { color: #e7e9ee; }

/* ---------- Films: full width, edge to edge ---------- */
.film { background: var(--paper) !important; }
.film + .film { border-top: 1px solid var(--line); }
.film__pin { position: relative; height: auto; min-height: 100svh; padding-block: clamp(32px, 5vh, 64px); }
.film__pin::before { content: ""; position: absolute; inset: 15% 10% 0; background: var(--glow); pointer-events: none; }
.film__grid { position: relative; max-width: 1520px; grid-template-columns: minmax(0, 1fr) !important; grid-template-areas: "head" "stage" "chapters" "bar"; gap: 18px !important; align-content: center; }
.film__grid > div:first-child { display: contents; }
.film__head { grid-area: head; text-align: center; justify-items: center; margin: 0 !important; gap: 10px; }
.film__head .lede { display: none; }
.film__head h2 { color: #fff; }
/* The film is the hero of its section: heading + film fill the screen; chapters sit just below */
.film__stage { grid-area: stage; width: min(100%, calc((100svh - 190px) * 1120 / 720)); justify-self: center; }
.film__stage .film__note { text-align: center; justify-content: center; display: flex; }
.stagebg { background: radial-gradient(90% 85% at 50% 0%, #20252e 0%, #12151a 55%, #0b0d10 100%) !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06) !important; }
.filmcanvas { box-shadow: 0 40px 120px -40px rgba(0, 0, 0, 0.9); }

.chapters { grid-area: chapters; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px !important; align-items: start; }
.chapters button { grid-template-columns: 26px 1fr !important; padding: 10px 12px !important; border-radius: 12px; }
.chapters button .n { width: 24px; height: 24px; font-size: 0.75rem; border-color: #3a414d; box-shadow: 0 2px 0 #000; background: #1b1f26; color: var(--ink); grid-row: auto; }
.chapters button b { font-size: 1.125rem; align-self: center; }
.chapters button span:last-child { grid-column: 1 / -1; font-size: 0.875rem; color: var(--ink-2); max-height: 0; overflow: hidden; opacity: 0; transition: max-height 300ms var(--ease-out), opacity 300ms ease; }
.chapters button[aria-current="step"] { background: var(--surface) !important; box-shadow: 0 0 0 1px var(--line), 0 20px 40px -20px rgba(0, 0, 0, 0.8) !important; }
.chapters button[aria-current="step"] .n { background: var(--signal); color: #0c0f14; border-color: #ff7a45; }
.chapters button[aria-current="step"] span:last-child { max-height: 6em; opacity: 1; margin-top: 4px; }
.chapters .text-link { color: var(--ink); }
.film__bar { grid-area: bar; max-width: 520px; width: 100%; justify-self: center; margin-top: 0 !important; background: rgba(255, 255, 255, 0.08) !important; }
/* Autoplay: no progress bar (the chapters show where the film is); a quiet pause key sits in the stage corner,
   shown on hover or keyboard focus, and always while paused. */
.film__bar { display: none !important; }
.film__toggle {
  position: absolute; right: 14px; bottom: 14px; z-index: 3; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; cursor: pointer;
  color: #fff; background: rgba(12, 15, 20, 0.62); border: 0; border-radius: 50%;
  opacity: 0; transition: opacity 200ms ease, transform 120ms var(--ease-out);
}
.film__stage:hover .film__toggle, .film__toggle:focus-visible, .film__toggle.is-paused { opacity: 1; }
@media (hover: none) { .film__toggle { opacity: 0.7; } }
.film__toggle:active { transform: scale(0.94); }
.film__toggle svg { width: 13px; height: 13px; fill: currentColor; }
.film__toggle .i-play, .film__toggle.is-paused .i-pause { display: none; }
.film__toggle.is-paused .i-play { display: block; }
.film.is-static .film__toggle { display: none; }

/* Films play as pre-rendered video; the live canvas stays in the page only for reduced motion and as a fallback */
.film__video { position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; border-radius: calc(28px * var(--s, 1)); background: var(--paper); box-shadow: 0 40px 120px -40px rgba(0, 0, 0, 0.9); }
.canvas-frame.has-video .filmcanvas { display: none; }
[data-theme="light"] .film__video { box-shadow: 0 40px 100px -40px rgba(12, 15, 20, 0.35); }

/* No layout shift between chapters: every description keeps its space; only the current one is shown. */
.chapters li { display: flex; }
.chapters button { height: 100%; }
.chapters button span:last-child { max-height: none !important; overflow: visible; opacity: 0; margin-top: 4px; transition: opacity 300ms ease; }
.chapters button[aria-current="step"] span:last-child { opacity: 1; }

/* Static films (reduced motion / no script): chapters in a column, all descriptions visible */
.film.is-static .chapters { grid-template-columns: minmax(0, 1fr); max-width: 720px; justify-self: center; width: 100%; }
.film.is-static .chapters button span:last-child { max-height: none; opacity: 1; }

/* ---------- Modes, bands, offer, FAQ, footer ---------- */
.modes { border-top-color: var(--line-strong); }
.mode h3 { color: #fff; }
.section-head h2, .h2, .offer-main h2, .page-head h1, .release-main h2, .topic h2 { color: #fff; }
.band-night { background: radial-gradient(70% 60% at 20% 0%, rgba(255, 91, 31, 0.12), rgba(255, 91, 31, 0) 70%), var(--night); }
.offer, .release { background: var(--surface); border-color: var(--line); }
.offer-side, .release-side { background: var(--surface-2); border-color: var(--line); }
.terms li { border-color: var(--line); }
.faq { border-top-color: var(--line-strong); }
.faq details { border-color: var(--line); }
.faq summary { color: #fff; }
.faq summary::after { border-color: #3a414d; box-shadow: 0 2px 0 #000; background-color: #1b1f26; background-image: linear-gradient(var(--ink), var(--ink)), linear-gradient(var(--ink), var(--ink)); }
.faq details[open] summary::after { background-color: var(--signal); background-image: linear-gradient(#0c0f14, #0c0f14), linear-gradient(#0c0f14, #0c0f14); }
.site-footer { border-top-color: var(--line); }
.foot-word { color: #fff; opacity: 0.92; }
.state-pill { border-color: var(--line-strong); }
.state-pill.is-ready { background: var(--signal); color: #0c0f14; border-color: #ff7a45; }
.install li::before { border-color: #3a414d; box-shadow: 0 2px 0 #000; background: #1b1f26; }
.toc { border-top-color: var(--line-strong); }
.toc li, .topic, .qa li { border-color: var(--line); }
.topic:first-child { border-top-color: var(--line-strong); }
.filter input { background: var(--surface); border-color: #3a414d; color: var(--ink); }
.filter input:focus-visible { border-color: var(--focus); }

/* Reviewer marks stay paper-yellow so they can never be mistaken for real UI */
.review-bar { background: #fff3c4; color: #574000; }
.held { color: #574000; }
.foot-links .is-ph::after { color: #ffd76a; }

@media (max-width: 1023px) {
  .film__grid { grid-template-areas: "stage" "head" "chapters" "bar"; }
  .film__stage { width: 100%; }
  .film__head { text-align: start; justify-items: start; }
  .chapters { grid-template-columns: minmax(0, 1fr); }
  .chapters button span:last-child { max-height: none; opacity: 1; }
  /* One chapter at a time, all stacked in the same cell so the tallest sets the height and nothing jumps */
  .film:not(.is-static) .chapters li { grid-area: 1 / 1; }
  .film:not(.is-static) .chapters button { display: grid; visibility: hidden; opacity: 0; transition: opacity 300ms ease, visibility 0s 300ms; }
  .film:not(.is-static) .chapters button[aria-current="step"] { visibility: visible; opacity: 1; transition: opacity 300ms ease; }
}

/* Keep the cue's pill above the dark menu bar (its background sits at z-index -1 inside the cue) */
[data-app] .cue { isolation: isolate; }

/* Skip links: lit orange with dark ink when focused (the ink token is light in this theme) */
.skip, .skip-film { background: var(--signal); color: #0c0f14; }
/* Placeholder chips keep their own dark ink wherever they sit */
.ph, .terms span.ph, .band-night .ph { color: #574000; }
/* Autoplay refused by the browser: a larger play key in the middle of the film, so it's obvious what to tap. */
.canvas-frame.is-blocked .film__video { cursor: pointer; }
.canvas-frame.is-blocked .film__toggle { inset: 50% auto auto 50%; width: 72px; height: 72px; transform: translate(-50%, -50%); opacity: 1; }
.canvas-frame.is-blocked .film__toggle svg { width: 26px; height: 26px; }
.canvas-frame.is-blocked .film__toggle:active { transform: translate(-50%, -50%) scale(0.94); }

/* ---------- Two apps, one price ---------- */
.two-for-one { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr); gap: 16px 48px; align-items: end; margin-bottom: 28px; }
.two-for-one h2 { font-size: calc(clamp(2.25rem, 1.3rem + 3vw, 3.75rem) * var(--head-scale)); color: var(--ink); }
.two-for-one h2 em { color: var(--signal-ink); }
.two-for-one p { color: var(--ink-2); font-size: 1.125rem; max-width: 34em; margin: 0; }
@media (max-width: 760px) { .two-for-one { grid-template-columns: minmax(0, 1fr); } }

.bundle { display: grid; gap: 0; max-width: 440px; border: 1px solid var(--line); border-radius: 16px; padding: 6px 20px 16px; background: var(--surface-2); }
.bundle-row, .bundle-total { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.bundle-row span { color: var(--ink-2); }
.bundle-row s { color: var(--ink-2); text-decoration-thickness: 1.5px; font-variant-numeric: tabular-nums; }
.bundle-row.is-sum span { font-weight: 600; color: var(--ink); }
.bundle-total { border-bottom: 0; padding-top: 16px; }
.bundle-total span { font: var(--head-w) 1.375rem/1.2 var(--serif); color: var(--ink); }
.bundle-total span em { font-style: italic; }
.bundle-total b { font: var(--head-w) clamp(2.5rem, 1.6rem + 2vw, 3.25rem)/1 var(--serif); color: var(--signal-ink); font-variant-numeric: tabular-nums; }
.bundle-save { margin: 2px 0 0; font: 600 0.875rem/1.4 var(--sans); color: var(--signal-ink); }
@media (max-width: 420px) { .bundle-total span { font-size: 1.125rem; white-space: nowrap; } .bundle { padding-inline: 16px; } }
.two-for-one { padding-top: clamp(24px, 4vw, 56px); }

/* ---------- Privacy band: speech → this Mac → text ---------- */
#privacy-history .wrap { display: block; }
/* A · Flow */
.pva-head { text-align: center; display: grid; gap: 18px; justify-items: center; margin-bottom: clamp(40px, 6vw, 72px); }
.pva-head .h2 { font-size: calc(clamp(2.75rem, 1.4rem + 4.4vw, 5.5rem) * var(--head-scale)); }
.pva-flow { display: grid; grid-template-columns: auto minmax(24px, 1fr) minmax(0, 3.2fr) minmax(24px, 1fr) auto; align-items: center; }
.pva-node { display: grid; justify-items: center; gap: 12px; text-align: center; }
.pva-node b { font: 600 0.9375rem/1.2 var(--sans); color: var(--on-night); }
.pva-ic { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--night-line); background: var(--night-2); color: var(--on-night); }
.pva-ic svg, .pva-nocloud svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.pva-line { height: 2px; margin-bottom: 30px; background: repeating-linear-gradient(90deg, var(--line-strong) 0 6px, transparent 6px 12px); }
.pva-mac { position: relative; border: 1.5px solid var(--signal); border-radius: 22px; padding: 44px clamp(16px, 2.5vw, 32px) 30px; background: radial-gradient(80% 120% at 50% 0%, rgba(255, 91, 31, 0.14), rgba(255, 91, 31, 0) 70%), var(--night-2); box-shadow: 0 40px 100px -40px rgba(255, 91, 31, 0.45); }
.pva-mac-label { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); padding: 6px 12px; border-radius: 99px; background: var(--signal); color: #0c0f14; font: 700 0.75rem/1 var(--sans); letter-spacing: 0.12em; text-transform: uppercase; }
.pva-mac-row { display: flex; align-items: center; justify-content: center; gap: clamp(10px, 1.6vw, 22px); flex-wrap: wrap; }
.pva-arrow { color: var(--signal-night); font-size: 1.25rem; }
.pva-wave { display: inline-flex; align-items: center; gap: 4px; height: 44px; }
.pva-wave i { width: 4px; border-radius: 4px; background: var(--signal); animation: pvaWave 1.2s ease-in-out infinite; }
.pva-wave i:nth-child(odd) { animation-delay: -0.4s; } .pva-wave i:nth-child(3n) { animation-delay: -0.8s; }
.pva-wave i:nth-child(1) { height: 30%; } .pva-wave i:nth-child(2) { height: 70%; } .pva-wave i:nth-child(3) { height: 45%; } .pva-wave i:nth-child(4) { height: 100%; } .pva-wave i:nth-child(5) { height: 60%; } .pva-wave i:nth-child(6) { height: 85%; } .pva-wave i:nth-child(7) { height: 40%; } .pva-wave i:nth-child(8) { height: 65%; } .pva-wave i:nth-child(9) { height: 25%; }
@keyframes pvaWave { 50% { transform: scaleY(0.45); } }
.pva-model { display: grid; gap: 4px; padding: 12px 16px; border-radius: 12px; border: 1px solid var(--night-line); background: var(--night); font: var(--head-w) 1.25rem/1.1 var(--serif); color: var(--on-night); text-align: center; }
.pva-model small { font: 500 0.75rem/1 var(--sans); color: var(--on-night-2); }
.pva-text { font: var(--head-w) 1.375rem/1.1 var(--serif); color: var(--on-night); white-space: nowrap; }
.pva-text i { display: inline-block; width: 2px; height: 1.05em; margin-inline-start: 2px; vertical-align: -0.15em; background: var(--signal); animation: pvaCaret 1s steps(1) infinite; }
@keyframes pvaCaret { 50% { opacity: 0; } }
.pva-nocloud { position: absolute; bottom: -14px; left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border-radius: 99px; background: var(--night); border: 1px solid var(--night-line); color: var(--on-night-2); font: 600 0.8125rem/1 var(--sans); white-space: nowrap; }
.pva-nocloud svg { width: 18px; height: 18px; }
.pva-facts { list-style: none; margin: clamp(48px, 6vw, 72px) 0 0; padding: 28px 0 0; border-top: 1px solid var(--night-line); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 28px; }
.pva-facts li { color: var(--on-night-2); font-size: 0.9375rem; line-height: 1.5; }
.pva-facts b { display: block; color: var(--on-night); font: var(--head-w) 1.25rem/1.2 var(--serif); margin-bottom: 6px; }
@media (prefers-reduced-motion: reduce) { .pva-wave i, .pva-text i { animation: none; } }
@media (max-width: 860px) {
  .pva-flow { grid-template-columns: minmax(0, 1fr); justify-items: center; }
  .pva-line { width: 2px; height: 32px; margin: 10px 0; background: repeating-linear-gradient(180deg, var(--line-strong) 0 6px, transparent 6px 12px); }
  .pva-mac { width: 100%; margin-block: 10px; }
  .pva-mac-row { flex-direction: column; }
  .pva-arrow { transform: rotate(90deg); }
  .pva-facts { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 520px) { .pva-facts { grid-template-columns: minmax(0, 1fr); } }

.pva-nocloud svg { flex: none; }

/* ---------- Legal pages: Privacy, Terms, Refunds ---------- */
.legal-date { margin-top: 14px; font: 500 0.875rem/1.4 var(--sans); color: var(--ink-2); }
.legal-layout { padding-top: 24px; }
.legal { max-width: 70ch; }
.legal section { padding-block: 32px; border-top: 1px solid var(--line); scroll-margin-top: 24px; }
.legal section:first-child { border-top-color: var(--line-strong); padding-top: 24px; }
.legal h2 { font: var(--head-w) clamp(1.625rem, 1.2rem + 1vw, 2.125rem)/1.15 var(--serif); letter-spacing: -0.01em; color: var(--ink); margin-bottom: 14px; }
.legal p, .legal li { color: var(--ink-2); font-size: 1.0625rem; line-height: 1.65; }
.legal p + p { margin-top: 12px; }
.legal b { color: var(--ink); font-weight: 600; }
.legal a:not(.back-top) { color: var(--ink); text-decoration: underline; text-decoration-color: var(--signal); text-underline-offset: 0.2em; }
.legal ul { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 10px; }
.legal ul li { position: relative; padding-inline-start: 22px; }
.legal ul li::before { content: ""; position: absolute; left: 2px; top: 0.72em; width: 8px; height: 2px; background: var(--signal); }
.legal-steps { list-style: none; margin: 6px 0 0; padding: 0; counter-reset: s; display: grid; gap: 14px; }
.legal-steps li { counter-increment: s; display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; align-items: start; }
.legal-steps li::before { content: counter(s); display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; border: 1.5px solid var(--line-strong); font: 600 0.9375rem/1 var(--sans); color: var(--ink); background: var(--surface); }
.legal .back-top { display: inline-block; margin-top: 28px; }
.legal-glance { list-style: none; margin: 8px 0 clamp(32px, 5vw, 56px); padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; border-block: 1px solid var(--line-strong); }
.legal-glance li { padding: 22px 22px 24px 0; display: grid; gap: 6px; align-content: start; }
.legal-glance li + li { padding-inline-start: 22px; border-inline-start: 1px solid var(--line); }
.legal-glance b { font: var(--head-w) 1.3125rem/1.2 var(--serif); color: var(--ink); }
.legal-glance span { color: var(--ink-2); font-size: 0.9375rem; line-height: 1.5; }
.refund-hero { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(20px, 4vw, 56px); align-items: center; margin: 8px 0 clamp(32px, 5vw, 56px); padding-block: 28px; border-block: 1px solid var(--line-strong); }
.refund-big { margin: 0; font: var(--head-w) clamp(5rem, 3rem + 6vw, 9rem)/1 var(--serif); letter-spacing: -0.04em; color: var(--signal-ink); padding-inline-end: 0.08em; }
.refund-big small { font: 600 0.875rem/1 var(--sans); letter-spacing: 0.12em; text-transform: uppercase; margin-inline-start: 10px; color: var(--ink-2); letter-spacing: 0.12em; }
.refund-line { margin: 0; font: var(--head-w) clamp(1.5rem, 1rem + 1.6vw, 2.25rem)/1.25 var(--serif); color: var(--ink); max-width: 26ch; text-wrap: balance; }
.refund-line em { color: var(--signal-ink); }
@media (max-width: 960px) { .legal-glance { grid-template-columns: 1fr 1fr; } .legal-glance li:nth-child(3) { padding-inline-start: 0; border-inline-start: 0; } .legal-glance li:nth-child(n+3) { border-top: 1px solid var(--line); } }
@media (max-width: 860px) { .legal-layout { grid-template-columns: minmax(0, 1fr); } .legal-layout aside { position: static; } }
@media (max-width: 560px) {
  .legal-glance { grid-template-columns: minmax(0, 1fr); }
  .legal-glance li, .legal-glance li + li { padding: 18px 0; border-inline-start: 0; }
  .legal-glance li + li { border-top: 1px solid var(--line); }
  .refund-hero { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}

/* Short legal pages: one narrow column, no sidebar */
.legal-short { padding-bottom: clamp(48px, 8vw, 96px); }
.legal-short .legal { max-width: 68ch; }
.legal-head { padding-bottom: 8px; }
.legal-short.after-hero .legal section:first-child { border-top: 0; padding-top: 0; }
.wrap:has(> .refund-hero) + .after-hero { margin-top: -8px; }
.bundle-row .inc { font-style: normal; font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.04em; color: var(--signal-ink); }