@charset "utf-8";
/* Self-hosted so the display voice never falls back to a system condensed face
   when a third-party CDN is slow or blocked. Both are variable fonts: one file
   covers every weight we use. */
@font-face {
  font-family: "Oswald";
  src: url("/fonts/oswald-latin.woff2") format("woff2");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Libre Franklin";
  src: url("/fonts/libre-franklin-latin.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
/* ============================================================================
   Bravery Details
   The home page opens on the studio's corridor — two rails of the shop's own
   jobs rushing past in perspective — with one headline, two buttons and a
   trust line in a pool of ink at the centre, then calm proof sections. The itemised sheet (ruled lines, dotted leaders, flush-right
   prices, one struck gold total) lives on /book and /pricing only.
   No cards, no pills, no shadows.
   ========================================================================= */

/* --- tokens --------------------------------------------------------------- */
:root {
  --ink: #060609;
  --ink-2: #0b0b10;
  --surface: #0f0f14;
  --surface-2: #14141a;
  --paper: #f0eee9;
  --muted: #b0aba3;
  --dim: #8d887f;
  --chrome: #b8b8c0;
  --gold: #c9a227;
  --gold-lit: #e3bd42;
  --gold-dim: #7d6518;
  --green: #4ade80;
  --red: #f87171;

  --rule: rgba(255, 255, 255, .10);
  --rule-hi: rgba(255, 255, 255, .20);
  --rule-gold: rgba(201, 162, 39, .38);

  --shell: 1180px;
  --gutter: clamp(1.15rem, 4vw, 2.75rem);
  --bar-h: 56px;

  /* one spacing rhythm, used everywhere */
  --s1: .25rem;  --s2: .5rem;   --s3: .75rem;  --s4: 1rem;
  --s5: 1.5rem;  --s6: 2rem;    --s7: 3rem;    --s8: 4.5rem;
  --s9: 6.5rem;

  --display: "Oswald", sans-serif;
  --body: "Libre Franklin", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --ease: cubic-bezier(.16, 1, .3, 1);

  color-scheme: dark;
}

/* --- reset ---------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scrollbar-color: var(--gold-dim) var(--ink);
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

body {
  background: var(--ink);
  color: var(--paper);
  font-family: var(--body);
  font-size: 1rem;
  line-height: 1.62;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, svg, video { display: block; max-width: 100%; }
img, video { height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
[hidden] { display: none !important; }

/* --- browser surfaces (these ship with defaults that belong to no system) -- */
::selection { background: var(--gold); color: var(--ink); }
input, textarea, select { caret-color: var(--gold); }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--ink); }
::-webkit-scrollbar-thumb { background: #2a2620; border: 3px solid var(--ink); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--gold-dim); }
:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
  border-radius: 1px;
}
:where(a) { color: inherit; text-decoration-color: var(--rule-gold); text-underline-offset: .22em; }
:where(a):hover { text-decoration-color: var(--gold); }

/* --- type ----------------------------------------------------------------- */
h1, h2, h3, h4, .display {
  font-family: var(--display);
  font-weight: 600;
  line-height: 1.02;
  letter-spacing: -.012em;
  text-transform: uppercase;
  text-wrap: balance;
}
h1 { font-size: clamp(2.1rem, 7.2vw, 4rem); }
h2 { font-size: clamp(1.6rem, 4.4vw, 2.6rem); }
h3 { font-size: clamp(1.15rem, 2.4vw, 1.5rem); }
p  { text-wrap: pretty; }
p, li { max-width: 68ch; }

.lede { font-size: clamp(1.02rem, 1.9vw, 1.2rem); color: var(--muted); font-weight: 300; }
.fine { font-size: .82rem; color: var(--dim); line-height: 1.55; }
.num  { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }

/* the ticket's own small label — set in the display face, not an eyebrow over
   a heading; it labels a field, the way a form does */
.field-label {
  font-family: var(--display);
  font-size: .7rem;
  font-weight: 500;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--dim);
}

/* --- layout --------------------------------------------------------------- */
.shell { width: min(100% - var(--gutter) * 2, var(--shell)); margin-inline: auto; }
.section { padding-block: clamp(var(--s7), 8vw, var(--s9)); }
.section--tight { padding-block: clamp(var(--s6), 5vw, var(--s7)); }
.section + .section { border-top: 1px solid var(--rule); }
.stack > * + * { margin-top: var(--s4); }
.section-head { margin-bottom: var(--s6); }
.section-head p { margin-top: var(--s3); }

/* --- skip link ------------------------------------------------------------ */
.skip {
  position: fixed; left: var(--s4); top: -100px; z-index: 200;
  background: var(--gold); color: var(--ink);
  padding: var(--s3) var(--s5);
  font-family: var(--display); font-weight: 600; letter-spacing: .1em;
  text-transform: uppercase; text-decoration: none;
  transition: top .18s var(--ease);
}
.skip:focus { top: var(--s4); }

/* --- chrome bar (the header rail) ----------------------------------------- */
.chrome-bar {
  position: sticky; top: 0; z-index: 100;
  height: var(--bar-h);
  display: flex; align-items: center; gap: var(--s5);
  padding-inline: var(--gutter);
  background: rgba(6, 6, 9, .93);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--rule);
}
.chrome-bar__badge { display: flex; align-items: center; gap: var(--s3); text-decoration: none; flex-shrink: 0; }
.chrome-bar__badge img { width: 40px; height: auto; }
.chrome-bar__word {
  font-family: var(--display); font-weight: 600; font-size: .95rem;
  letter-spacing: .13em; text-transform: uppercase; color: var(--paper);
}
@media (max-width: 420px) { .chrome-bar__word { display: none; } }

.chrome-bar__nav { display: flex; align-items: center; gap: var(--s5); margin-left: auto; min-width: 0; }
.chrome-bar__links { display: flex; gap: var(--s5); }
@media (max-width: 900px) { .chrome-bar__links { display: none; } }
.chrome-bar__links a {
  font-family: var(--display); font-size: .8rem; font-weight: 500;
  letter-spacing: .11em; text-transform: uppercase;
  color: var(--muted); text-decoration: none;
  padding-block: var(--s2);
  border-bottom: 1px solid transparent;
  transition: color .16s var(--ease), border-color .16s var(--ease);
}
.chrome-bar__links a:hover { color: var(--paper); border-bottom-color: var(--rule-hi); }
.chrome-bar__links a[aria-current="page"] { color: var(--gold); border-bottom-color: var(--gold); }

.chrome-bar__call {
  display: inline-flex; align-items: center; gap: var(--s2);
  font-family: var(--display); font-size: .85rem; font-weight: 600;
  letter-spacing: .07em; color: var(--paper); text-decoration: none;
  white-space: nowrap;
}
.chrome-bar__call svg { width: 15px; height: 15px; stroke: var(--gold); }
.chrome-bar__call:hover { color: var(--gold); }

/* --- buttons -------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s2);
  font-family: var(--display); font-weight: 600; font-size: .92rem;
  letter-spacing: .13em; text-transform: uppercase;
  padding: var(--s3) var(--s6);
  border: 1px solid var(--gold);
  background: var(--gold); color: var(--ink);
  text-decoration: none; cursor: pointer;
  transition: background .16s var(--ease), border-color .16s var(--ease), color .16s var(--ease);
}
.btn:hover { background: var(--gold-lit); border-color: var(--gold-lit); }
.btn:active { background: var(--gold-dim); border-color: var(--gold-dim); color: var(--paper); }
.btn[disabled], .btn[aria-disabled="true"] {
  background: transparent; border-color: var(--rule); color: var(--dim);
  cursor: not-allowed; pointer-events: none;
}
.btn--ghost { background: transparent; color: var(--paper); border-color: var(--rule-hi); }
.btn--ghost:hover { background: transparent; border-color: var(--chrome); color: var(--paper); }
.btn--wide { width: 100%; }
.btn--sm { padding: var(--s2) var(--s4); font-size: .78rem; }

/* --- hero (home) ---------------------------------------------------------- */
/* The studio's corridor, ported from ericolsen.studio: two rails of the shop's
   own jobs rush toward the viewer in perspective while the headline sits in a
   pool of ink at the centre. Cards are portrait because every photo the shop
   takes is a phone shot; the rail geometry (x / z / rotateY) is the studio's,
   unchanged, and is expressed in cqw against .hero so it scales with the frame.
   10 cards per rail on a 20s loop — one card every 2s per rail. */
.hero {
  position: relative; overflow: hidden;
  container-type: inline-size;
  display: grid; place-items: center; text-align: center;
  min-height: min(92svh, 900px);
  padding: clamp(var(--s8), 12vw, var(--s9)) var(--gutter);
}
/* Stacking is explicit and positive (stream 0, veil 1, copy 2). Safari will
   not paint images inside a 3D subtree that sits at a negative z-index, and
   it fetches but never paints lazy-loaded images there either — so the cards
   are eager and the layers count up from zero, exactly as on the studio site. */
.hero-stream {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  perspective: 30cqw; perspective-origin: 50% 55%;
}
.stream-rail { position: absolute; inset: 0; transform-style: preserve-3d; }
.stream-card {
  position: absolute; left: 50%; top: 55%;
  width: 18cqw; height: 24cqw; margin-left: -9cqw; margin-top: -12cqw;
  overflow: hidden;
  background: var(--surface); border: 1px solid var(--rule-hi);
  animation-duration: 20s; animation-timing-function: linear; animation-iteration-count: infinite;
}
.stream-card img { width: 100%; height: 100%; object-fit: cover; }
.stream-rail--right .stream-card { animation-name: eos-rail-right; }
.stream-rail--left  .stream-card { animation-name: eos-rail-left; }
/* Negative delays drop each card mid-flight, so the corridor is already full
   on the first painted frame. */
.stream-card:nth-child(1) { animation-delay: -0.00s; }
.stream-card:nth-child(2) { animation-delay: -2.00s; }
.stream-card:nth-child(3) { animation-delay: -4.00s; }
.stream-card:nth-child(4) { animation-delay: -6.00s; }
.stream-card:nth-child(5) { animation-delay: -8.00s; }
.stream-card:nth-child(6) { animation-delay: -10.00s; }
.stream-card:nth-child(7) { animation-delay: -12.00s; }
.stream-card:nth-child(8) { animation-delay: -14.00s; }
.stream-card:nth-child(9) { animation-delay: -16.00s; }
.stream-card:nth-child(10) { animation-delay: -18.00s; }
@keyframes eos-rail-right {
  0.00% { transform: translate3d(-11.00cqw, 0, -143.08cqw) rotateY(-6.00deg); }
  4.17% { transform: translate3d(-3.79cqw, 0, -124.13cqw) rotateY(-6.92deg); }
  8.33% { transform: translate3d(2.73cqw, 0, -107.26cqw) rotateY(-7.83deg); }
  12.50% { transform: translate3d(8.60cqw, 0, -92.24cqw) rotateY(-8.75deg); }
  16.67% { transform: translate3d(13.87cqw, 0, -78.86cqw) rotateY(-9.67deg); }
  20.83% { transform: translate3d(18.56cqw, 0, -66.94cqw) rotateY(-10.58deg); }
  25.00% { transform: translate3d(22.72cqw, 0, -56.33cqw) rotateY(-11.50deg); }
  29.17% { transform: translate3d(26.37cqw, 0, -46.88cqw) rotateY(-12.42deg); }
  33.33% { transform: translate3d(29.57cqw, 0, -38.47cqw) rotateY(-13.33deg); }
  37.50% { transform: translate3d(32.34cqw, 0, -30.97cqw) rotateY(-14.25deg); }
  41.67% { transform: translate3d(34.71cqw, 0, -24.30cqw) rotateY(-15.17deg); }
  45.83% { transform: translate3d(36.73cqw, 0, -18.36cqw) rotateY(-16.08deg); }
  50.00% { transform: translate3d(38.42cqw, 0, -13.06cqw) rotateY(-17.00deg); }
  54.17% { transform: translate3d(39.81cqw, 0, -8.35cqw) rotateY(-17.92deg); }
  58.33% { transform: translate3d(40.94cqw, 0, -4.15cqw) rotateY(-18.83deg); }
  62.50% { transform: translate3d(41.84cqw, 0, -0.41cqw) rotateY(-19.75deg); }
  66.67% { transform: translate3d(42.53cqw, 0, 2.92cqw) rotateY(-20.67deg); }
  70.83% { transform: translate3d(43.06cqw, 0, 5.88cqw) rotateY(-21.58deg); }
  75.00% { transform: translate3d(43.43cqw, 0, 8.52cqw) rotateY(-22.50deg); }
  79.17% { transform: translate3d(43.69cqw, 0, 10.87cqw) rotateY(-23.42deg); }
  83.33% { transform: translate3d(43.85cqw, 0, 12.96cqw) rotateY(-24.33deg); }
  87.50% { transform: translate3d(43.94cqw, 0, 14.83cqw) rotateY(-25.25deg); }
  91.67% { transform: translate3d(43.98cqw, 0, 16.49cqw) rotateY(-26.17deg); }
  95.83% { transform: translate3d(44.00cqw, 0, 17.97cqw) rotateY(-27.08deg); }
  100.00% { transform: translate3d(44.00cqw, 0, 19.29cqw) rotateY(-28.00deg); }
}
@keyframes eos-rail-left {
  0.00% { transform: translate3d(11.00cqw, 0, -143.08cqw) rotateY(6.00deg); }
  4.17% { transform: translate3d(3.79cqw, 0, -124.13cqw) rotateY(6.92deg); }
  8.33% { transform: translate3d(-2.73cqw, 0, -107.26cqw) rotateY(7.83deg); }
  12.50% { transform: translate3d(-8.60cqw, 0, -92.24cqw) rotateY(8.75deg); }
  16.67% { transform: translate3d(-13.87cqw, 0, -78.86cqw) rotateY(9.67deg); }
  20.83% { transform: translate3d(-18.56cqw, 0, -66.94cqw) rotateY(10.58deg); }
  25.00% { transform: translate3d(-22.72cqw, 0, -56.33cqw) rotateY(11.50deg); }
  29.17% { transform: translate3d(-26.37cqw, 0, -46.88cqw) rotateY(12.42deg); }
  33.33% { transform: translate3d(-29.57cqw, 0, -38.47cqw) rotateY(13.33deg); }
  37.50% { transform: translate3d(-32.34cqw, 0, -30.97cqw) rotateY(14.25deg); }
  41.67% { transform: translate3d(-34.71cqw, 0, -24.30cqw) rotateY(15.17deg); }
  45.83% { transform: translate3d(-36.73cqw, 0, -18.36cqw) rotateY(16.08deg); }
  50.00% { transform: translate3d(-38.42cqw, 0, -13.06cqw) rotateY(17.00deg); }
  54.17% { transform: translate3d(-39.81cqw, 0, -8.35cqw) rotateY(17.92deg); }
  58.33% { transform: translate3d(-40.94cqw, 0, -4.15cqw) rotateY(18.83deg); }
  62.50% { transform: translate3d(-41.84cqw, 0, -0.41cqw) rotateY(19.75deg); }
  66.67% { transform: translate3d(-42.53cqw, 0, 2.92cqw) rotateY(20.67deg); }
  70.83% { transform: translate3d(-43.06cqw, 0, 5.88cqw) rotateY(21.58deg); }
  75.00% { transform: translate3d(-43.43cqw, 0, 8.52cqw) rotateY(22.50deg); }
  79.17% { transform: translate3d(-43.69cqw, 0, 10.87cqw) rotateY(23.42deg); }
  83.33% { transform: translate3d(-43.85cqw, 0, 12.96cqw) rotateY(24.33deg); }
  87.50% { transform: translate3d(-43.94cqw, 0, 14.83cqw) rotateY(25.25deg); }
  91.67% { transform: translate3d(-43.98cqw, 0, 16.49cqw) rotateY(26.17deg); }
  95.83% { transform: translate3d(-44.00cqw, 0, 17.97cqw) rotateY(27.08deg); }
  100.00% { transform: translate3d(-44.00cqw, 0, 19.29cqw) rotateY(28.00deg); }
}
/* Pool of ink under the headline; the corridor fades in toward the edges and
   hands off to the page ground at the bottom. */
.hero-veil {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background:
    radial-gradient(42% 38% at 50% 52%, rgba(6, 6, 9, .96) 0%, rgba(6, 6, 9, .88) 46%, rgba(6, 6, 9, .42) 74%, rgba(6, 6, 9, 0) 100%),
    linear-gradient(180deg, var(--ink) 0%, rgba(6, 6, 9, 0) 14%, rgba(6, 6, 9, 0) 78%, var(--ink) 100%);
}
/* The global reduced-motion rule collapses every animation to 0.01ms, which
   would snap all 20 cards onto the vanishing point. Pausing instead freezes a
   full, finished corridor — each card is already mid-flight via its delay. */
@media (prefers-reduced-motion: reduce) {
  .stream-card {
    animation-duration: 20s !important;
    animation-iteration-count: infinite !important;
    animation-play-state: paused !important;
  }
}
.hero__body { position: relative; z-index: 2; max-width: 46rem; }
.hero h1 { font-size: clamp(2.6rem, 8vw, 5rem); font-weight: 700; letter-spacing: .01em; }
.hero__sub {
  margin: var(--s4) auto 0; max-width: 34ch;
  font-size: clamp(1.02rem, 1.9vw, 1.2rem); font-weight: 300; color: var(--paper); opacity: .88;
}
.hero__actions { margin-top: var(--s6); display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s3); }
.hero .btn { min-width: 12rem; padding-block: var(--s4); }
.hero .btn--ghost { border-color: rgba(240, 238, 233, .45); }
.hero .btn--ghost:hover { border-color: var(--paper); }
.hero__trust {
  margin-top: var(--s5); display: flex; flex-wrap: wrap; justify-content: center;
  gap: var(--s2) var(--s4); font-size: .82rem; color: var(--muted);
}
.hero__trust strong { color: var(--paper); font-weight: 500; }
@media (max-width: 560px) {
  .hero__actions { flex-direction: column; align-items: stretch; }
}
/* Phone: the copy takes the top, the corridor drops to a band underneath, and
   the rails open wider so the ribbon sweeps across the screen instead of
   hugging the bezels (the studio's -sm geometry). */
@media (max-width: 760px) {
  .hero { min-height: 94svh; align-items: start; padding-top: var(--s8); padding-bottom: var(--s6); }
  .hero-stream { perspective-origin: 50% 80%; }
  .stream-card {
    top: 80%; width: 26cqw; height: 34.6cqw; margin-left: -13cqw; margin-top: -17.3cqw;
  }
  .stream-rail--right .stream-card { animation-name: eos-rail-right-sm; }
  .stream-rail--left  .stream-card { animation-name: eos-rail-left-sm; }
  .hero-veil {
    background:
      linear-gradient(180deg, var(--ink) 0%, rgba(6, 6, 9, 0) 12%, rgba(6, 6, 9, 0) 86%, var(--ink) 100%),
      radial-gradient(80% 32% at 50% 30%, rgba(6, 6, 9, .92) 0%, rgba(6, 6, 9, .6) 60%, rgba(6, 6, 9, 0) 100%);
  }
}
@keyframes eos-rail-right-sm {
  0.00% { transform: translate3d(-13.00cqw, 0, -146.47cqw) rotateY(-6.00deg); }
  4.17% { transform: translate3d(-5.01cqw, 0, -128.32cqw) rotateY(-6.83deg); }
  8.33% { transform: translate3d(2.23cqw, 0, -112.04cqw) rotateY(-7.67deg); }
  12.50% { transform: translate3d(8.74cqw, 0, -97.43cqw) rotateY(-8.50deg); }
  16.67% { transform: translate3d(14.58cqw, 0, -84.32cqw) rotateY(-9.33deg); }
  20.83% { transform: translate3d(19.78cqw, 0, -72.56cqw) rotateY(-10.17deg); }
  25.00% { transform: translate3d(24.39cqw, 0, -62.01cqw) rotateY(-11.00deg); }
  29.17% { transform: translate3d(28.45cqw, 0, -52.55cqw) rotateY(-11.83deg); }
  33.33% { transform: translate3d(32.00cqw, 0, -44.06cqw) rotateY(-12.67deg); }
  37.50% { transform: translate3d(35.07cqw, 0, -36.44cqw) rotateY(-13.50deg); }
  41.67% { transform: translate3d(37.70cqw, 0, -29.61cqw) rotateY(-14.33deg); }
  45.83% { transform: translate3d(39.93cqw, 0, -23.48cqw) rotateY(-15.17deg); }
  50.00% { transform: translate3d(41.81cqw, 0, -17.98cqw) rotateY(-16.00deg); }
  54.17% { transform: translate3d(43.35cqw, 0, -13.04cqw) rotateY(-16.83deg); }
  58.33% { transform: translate3d(44.61cqw, 0, -8.62cqw) rotateY(-17.67deg); }
  62.50% { transform: translate3d(45.60cqw, 0, -4.64cqw) rotateY(-18.50deg); }
  66.67% { transform: translate3d(46.38cqw, 0, -1.08cqw) rotateY(-19.33deg); }
  70.83% { transform: translate3d(46.95cqw, 0, 2.12cqw) rotateY(-20.17deg); }
  75.00% { transform: translate3d(47.37cqw, 0, 4.98cqw) rotateY(-21.00deg); }
  79.17% { transform: translate3d(47.66cqw, 0, 7.56cqw) rotateY(-21.83deg); }
  83.33% { transform: translate3d(47.84cqw, 0, 9.87cqw) rotateY(-22.67deg); }
  87.50% { transform: translate3d(47.94cqw, 0, 11.94cqw) rotateY(-23.50deg); }
  91.67% { transform: translate3d(47.98cqw, 0, 13.79cqw) rotateY(-24.33deg); }
  95.83% { transform: translate3d(48.00cqw, 0, 15.46cqw) rotateY(-25.17deg); }
  100.00% { transform: translate3d(48.00cqw, 0, 16.96cqw) rotateY(-26.00deg); }
}
@keyframes eos-rail-left-sm {
  0.00% { transform: translate3d(13.00cqw, 0, -146.47cqw) rotateY(6.00deg); }
  4.17% { transform: translate3d(5.01cqw, 0, -128.32cqw) rotateY(6.83deg); }
  8.33% { transform: translate3d(-2.23cqw, 0, -112.04cqw) rotateY(7.67deg); }
  12.50% { transform: translate3d(-8.74cqw, 0, -97.43cqw) rotateY(8.50deg); }
  16.67% { transform: translate3d(-14.58cqw, 0, -84.32cqw) rotateY(9.33deg); }
  20.83% { transform: translate3d(-19.78cqw, 0, -72.56cqw) rotateY(10.17deg); }
  25.00% { transform: translate3d(-24.39cqw, 0, -62.01cqw) rotateY(11.00deg); }
  29.17% { transform: translate3d(-28.45cqw, 0, -52.55cqw) rotateY(11.83deg); }
  33.33% { transform: translate3d(-32.00cqw, 0, -44.06cqw) rotateY(12.67deg); }
  37.50% { transform: translate3d(-35.07cqw, 0, -36.44cqw) rotateY(13.50deg); }
  41.67% { transform: translate3d(-37.70cqw, 0, -29.61cqw) rotateY(14.33deg); }
  45.83% { transform: translate3d(-39.93cqw, 0, -23.48cqw) rotateY(15.17deg); }
  50.00% { transform: translate3d(-41.81cqw, 0, -17.98cqw) rotateY(16.00deg); }
  54.17% { transform: translate3d(-43.35cqw, 0, -13.04cqw) rotateY(16.83deg); }
  58.33% { transform: translate3d(-44.61cqw, 0, -8.62cqw) rotateY(17.67deg); }
  62.50% { transform: translate3d(-45.60cqw, 0, -4.64cqw) rotateY(18.50deg); }
  66.67% { transform: translate3d(-46.38cqw, 0, -1.08cqw) rotateY(19.33deg); }
  70.83% { transform: translate3d(-46.95cqw, 0, 2.12cqw) rotateY(20.17deg); }
  75.00% { transform: translate3d(-47.37cqw, 0, 4.98cqw) rotateY(21.00deg); }
  79.17% { transform: translate3d(-47.66cqw, 0, 7.56cqw) rotateY(21.83deg); }
  83.33% { transform: translate3d(-47.84cqw, 0, 9.87cqw) rotateY(22.67deg); }
  87.50% { transform: translate3d(-47.94cqw, 0, 11.94cqw) rotateY(23.50deg); }
  91.67% { transform: translate3d(-47.98cqw, 0, 13.79cqw) rotateY(24.33deg); }
  95.83% { transform: translate3d(-48.00cqw, 0, 15.46cqw) rotateY(25.17deg); }
  100.00% { transform: translate3d(-48.00cqw, 0, 16.96cqw) rotateY(26.00deg); }
}

/* --- page header (interior pages) ----------------------------------------- */
.masthead { padding-block: clamp(var(--s7), 8vw, var(--s8)) var(--s5); }
.masthead h1 { max-width: 16ch; }
.masthead h1 em { font-style: normal; color: var(--gold); }
.masthead__sub { margin-top: var(--s4); max-width: 60ch; }
.masthead__actions { margin-top: var(--s5); display: flex; flex-wrap: wrap; gap: var(--s3); }

/* --- team ----------------------------------------------------------------- */
/* three portrait frames read as one strip at every width */
.team { display: grid; gap: var(--s2); grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (min-width: 760px) { .team { gap: var(--s4); } }
.team img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border: 1px solid var(--rule); background: var(--surface); }

/* --- closing call to action ------------------------------------------------ */
.cta { text-align: center; }
.cta > * { margin-inline: auto; }
.cta .lede { margin-top: var(--s3); max-width: 52ch; }
.cta__actions { margin-top: var(--s6); display: flex; flex-wrap: wrap; justify-content: center; gap: var(--s3); }
.cta .fine { margin-top: var(--s6); max-width: 60ch; }
.cta .fine a { color: var(--muted); }
.cta .fine a:hover { color: var(--gold); }

/* --- the sheet (two-column ticket body) ----------------------------------- */
.sheet { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s6); }
@media (min-width: 900px) {
  .sheet { grid-template-columns: 320px minmax(0, 1fr); gap: var(--s7); align-items: start; }
}

/* vehicle class stubs — the tear-off strip down the left */
.stubs { display: flex; flex-direction: column; }
.stubs__head { padding-bottom: var(--s3); border-bottom: 1px solid var(--rule-hi); }
.stub {
  display: flex; align-items: center; gap: var(--s4);
  width: 100%; text-align: left;
  padding: var(--s4) var(--s3) var(--s4) 0;
  background: none; border: 0; border-bottom: 1px solid var(--rule);
  color: var(--muted); cursor: pointer;
  position: relative;
  transition: color .16s var(--ease), background .16s var(--ease);
}
.stub::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: -1px; width: 3px;
  background: var(--gold); transform: scaleX(0); transform-origin: left;
  transition: transform .2s var(--ease);
}
.stub:hover { color: var(--paper); }
.stub[aria-pressed="true"] { color: var(--paper); }
.stub[aria-pressed="true"]::before { transform: scaleX(1); }
.stub__icon { width: 34px; height: 34px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 1.4; }
.stub[aria-pressed="true"] .stub__icon { stroke: var(--gold); }
.stub__body { min-width: 0; }
.stub__name {
  display: block; font-family: var(--display); font-weight: 500; font-size: .95rem;
  letter-spacing: .05em; text-transform: uppercase; color: inherit;
}
.stub__note { display: block; font-size: .78rem; color: var(--dim); line-height: 1.4; margin-top: 2px; }

/* ruled line items — the ticket's core texture */
.lines__head {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--s4);
  padding-bottom: var(--s3); border-bottom: 1px solid var(--rule-hi);
}
.lines { list-style: none; padding: 0; margin: 0; }
.lines > li { border-bottom: 1px solid var(--rule); }

.line {
  display: flex; align-items: baseline; gap: var(--s3);
  width: 100%; text-align: left;
  padding: var(--s4) 0;
  background: none; border: 0; color: inherit; cursor: pointer;
  transition: opacity .16s var(--ease);
}
.line__box {
  flex-shrink: 0; width: 17px; height: 17px;
  border: 1px solid var(--rule-hi);
  position: relative; top: 3px;
  transition: border-color .16s var(--ease), background .16s var(--ease);
}
.line__box::after {
  content: ""; position: absolute; inset: 3px;
  background: var(--gold);
  opacity: 0; transform: scale(.4);
  transition: opacity .14s var(--ease), transform .14s var(--ease);
}
.line[aria-pressed="true"] .line__box { border-color: var(--gold); }
.line[aria-pressed="true"] .line__box::after { opacity: 1; transform: scale(1); }
.line:hover .line__box { border-color: var(--chrome); }

.line__label { flex-shrink: 0; max-width: 60%; }
.line__name {
  display: block; font-family: var(--display); font-weight: 500;
  font-size: 1.02rem; letter-spacing: .045em; text-transform: uppercase;
  color: var(--paper); line-height: 1.2;
}
.line__note { display: block; font-size: .8rem; color: var(--dim); margin-top: 3px; max-width: 44ch; }
.line__leader {
  flex: 1 1 auto; min-width: var(--s5);
  border-bottom: 1px dotted var(--rule-hi);
  transform: translateY(-.3em);
}
.line__price {
  flex-shrink: 0; font-family: var(--display); font-weight: 600;
  font-size: 1.02rem; letter-spacing: .03em; color: var(--paper);
  font-variant-numeric: tabular-nums;
}
.line__price small { display: block; font-size: .73rem; font-weight: 400; color: var(--dim); letter-spacing: .1em; text-align: right; }
.line[aria-pressed="true"] .line__price { color: var(--gold); }

/* the struck total block */
.total {
  margin-top: var(--s5);
  border: 1px solid var(--rule-gold);
  /* The gold wash rides on an opaque ink ground. These must be one shorthand:
     a `background-color` declared before `background:` is reset to transparent
     by it, and a sticky block with no ground lets the ruled lines scroll
     straight through the total. */
  background:
    linear-gradient(180deg, rgba(201, 162, 39, .07), rgba(201, 162, 39, .02)),
    var(--ink);
  padding: var(--s5);
}
/* Sticky only where there is room for it. Below 760px the fixed dock owns the
   bottom of the viewport, and a sticky total would park behind it. */
@media (min-width: 761px) {
  .total { position: sticky; bottom: var(--s4); }
}
.total__row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s4); }
.total__row + .total__row { margin-top: var(--s3); padding-top: var(--s3); border-top: 1px solid var(--rule); }
.total__label { font-family: var(--display); font-size: .82rem; font-weight: 500; letter-spacing: .17em; text-transform: uppercase; color: var(--muted); }
.total__value {
  font-family: var(--display); font-weight: 700;
  font-size: clamp(1.9rem, 5vw, 2.9rem); line-height: 1;
  color: var(--gold); font-variant-numeric: tabular-nums; letter-spacing: -.01em;
}
.total__value--sm { font-size: 1.05rem; color: var(--paper); font-weight: 500; }
.total__tokens { font-size: .84rem; color: var(--muted); }
.total__tokens strong { color: var(--gold); font-weight: 600; }
.total .btn { margin-top: var(--s5); }
.total__fine { margin-top: var(--s3); }

/* The one authored moment: the total re-strikes character by character, the
   way a mechanical counter rolls. The old glyph travels up and out of its cell
   while the new one arrives from below, staggered left to right. No fade and
   no blur — this is a machine settling, not a transition. */
.total__value { display: inline-flex; overflow: hidden; line-height: 1.05; }
.roll {
  position: relative;
  display: inline-block;
  overflow: hidden;
  min-width: 1ch;
}
.roll__in { display: block; }
.roll__out {
  display: block;
  position: absolute;
  left: 0; top: 0; right: 0;
}
.roll--go > .roll__out { animation: roll-out .28s var(--ease) both; }
.roll--go > .roll__in { animation: roll-in .28s var(--ease) both; }
@keyframes roll-out {
  from { transform: translateY(0); }
  to   { transform: translateY(-110%); }
}
@keyframes roll-in {
  from { transform: translateY(110%); }
  to   { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .roll--go > .roll__out { display: none; }
  .roll--go > .roll__in { animation: none; }
}

/* --- before / after ------------------------------------------------------- */
/* four pairs read as a set, so they sit 2x2 rather than 3-up with an orphan */
.pairs { display: grid; gap: var(--s6); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 760px) { .pairs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pair { min-width: 0; }
.pair__frame {
  position: relative; overflow: hidden;
  aspect-ratio: 4 / 3; background: var(--surface);
  border: 1px solid var(--rule);
  touch-action: pan-y;
  cursor: ew-resize;
}
.pair__frame img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pair__after { clip-path: inset(0 0 0 var(--wipe, 50%)); }
.pair__handle {
  position: absolute; top: 0; bottom: 0; left: var(--wipe, 50%);
  width: 2px; background: var(--gold);
  transform: translateX(-1px);
  pointer-events: none;
}
.pair__handle::after {
  content: ""; position: absolute; top: 50%; left: 50%;
  width: 38px; height: 38px; transform: translate(-50%, -50%);
  border: 1px solid var(--gold); background: rgba(6, 6, 9, .72);
  backdrop-filter: blur(3px);
}
.pair__handle::before {
  content: ""; position: absolute; top: 50%; left: 50%;
  width: 13px; height: 9px; transform: translate(-50%, -50%);
  background: var(--gold);
  clip-path: polygon(0 50%, 38% 0, 38% 100%, 62% 0, 62% 100%, 100% 50%);
  z-index: 1;
}
.pair__range {
  position: absolute; inset: 0; width: 100%; height: 100%;
  opacity: 0; cursor: ew-resize; margin: 0;
}
.pair__range:focus-visible { opacity: 1; }
.pair__tag {
  position: absolute; bottom: var(--s3); z-index: 2;
  font-family: var(--display); font-size: .73rem; font-weight: 500;
  letter-spacing: .17em; text-transform: uppercase;
  padding: 3px var(--s3); background: rgba(6, 6, 9, .8); color: var(--muted);
  pointer-events: none;
}
.pair__tag--b { left: var(--s3); }
.pair__tag--a { right: var(--s3); color: var(--gold); }
.pair__cap { margin-top: var(--s3); display: flex; align-items: baseline; gap: var(--s3); flex-wrap: wrap; }
.pair__cap strong {
  font-family: var(--display); font-weight: 600; font-size: .92rem;
  letter-spacing: .08em; text-transform: uppercase; color: var(--paper);
}
.pair__cap span { font-size: .84rem; color: var(--dim); }

/* --- gallery -------------------------------------------------------------- */
/* two-up on a phone, four-up on a desk — never a single-column wall of photos */
.gallery { display: grid; gap: var(--s2); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 760px) { .gallery { gap: var(--s4); grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.shot { position: relative; overflow: hidden; border: 1px solid var(--rule); background: var(--surface); }
.shot img { aspect-ratio: 4 / 3; width: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.shot:hover img { transform: scale(1.035); }
.shot figcaption {
  position: absolute; left: 0; right: 0; bottom: 0;
  padding: var(--s5) var(--s3) var(--s3);
  background: linear-gradient(180deg, transparent, rgba(6, 6, 9, .9));
  font-family: var(--display); font-size: .76rem; font-weight: 500;
  letter-spacing: .13em; text-transform: uppercase; color: var(--paper);
}

/* --- club (membership) ---------------------------------------------------- */
/* Plans are ruled stub rows on the sheet, not cards. The featured plan is
   marked by rule weight and a gold stub edge, never by a background wash. */
.plans { border-top: 1px solid var(--rule-hi); }
.plan {
  display: grid; gap: var(--s2) var(--s5);
  grid-template-columns: minmax(0, 1fr);
  padding: var(--s5) 0 var(--s5) var(--s5);
  border-bottom: 1px solid var(--rule);
  position: relative;
}
@media (min-width: 780px) {
  .plan { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: baseline; }
  /* name | price | action across the top of the stub, everything else beneath */
  .plan__name { grid-column: 1; grid-row: 1; }
  .plan__price { grid-column: 2; grid-row: 1; }
  .plan__cta-wrap { grid-column: 3; grid-row: 1 / span 2; justify-self: end; align-self: center; }
  .plan__tokens { grid-column: 1 / 3; grid-row: 2; }
  .plan__pitch { grid-column: 1 / 3; grid-row: 3; }
  .plan__best { grid-column: 1 / 3; grid-row: 4; }
}
.plan::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: -1px; width: 1px;
  background: var(--rule);
}
.plan--featured { border-bottom-width: 2px; border-bottom-color: var(--rule-gold); }
.plan--featured::before { width: 3px; background: var(--gold); }
.plan__name { font-family: var(--display); font-size: 1.25rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.plan__price { display: flex; align-items: baseline; gap: var(--s2); }
.plan__amount { font-family: var(--display); font-weight: 700; font-size: 2.1rem; line-height: 1; color: var(--gold); font-variant-numeric: tabular-nums; }
.plan__per { font-size: .84rem; color: var(--dim); }
.plan__tokens { font-size: .92rem; color: var(--paper); }
.plan__tokens strong { color: var(--gold); font-weight: 600; }
.plan__pitch { color: var(--muted); font-size: .92rem; grid-column: 1 / -1; max-width: 60ch; }
.plan__best { font-size: .82rem; color: var(--dim); grid-column: 1 / -1; }
.plan__cta-wrap { align-self: center; }

.packs { border-top: 1px solid var(--rule-hi); }
.pack { padding: var(--s4) 0; border-bottom: 1px solid var(--rule); display: flex; align-items: baseline; justify-content: space-between; gap: var(--s4); }
.pack__n { font-family: var(--display); font-weight: 600; font-size: 1.5rem; color: var(--gold); font-variant-numeric: tabular-nums; }
.pack__name { font-family: var(--display); font-size: .8rem; letter-spacing: .15em; text-transform: uppercase; color: var(--dim); }
.pack__price { font-family: var(--display); font-weight: 600; font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.pack__save { display: block; font-size: .72rem; color: var(--green); text-align: right; letter-spacing: .08em; }

/* --- proof ---------------------------------------------------------------- */
.quotes { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); }
.quote { border-top: 1px solid var(--rule-gold); padding-top: var(--s4); }
.quote blockquote { font-size: .96rem; color: var(--muted); font-weight: 300; }
.quote figcaption { margin-top: var(--s4); font-size: .82rem; color: var(--dim); }
.quote figcaption strong { display: block; color: var(--paper); font-weight: 500; font-size: .88rem; }

.press { display: grid; gap: var(--s6); align-items: center; }
@media (min-width: 860px) { .press { grid-template-columns: 1.1fr 1fr; gap: var(--s7); } }
.press__video { border: 1px solid var(--rule); background: #000; }
.press__video video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.press__logo { width: 170px; filter: brightness(0) invert(1); opacity: .85; }

/* --- pricing tables (crawlable, real text) -------------------------------- */
.table-wrap { overflow-x: auto; border: 1px solid var(--rule); }
table.price { width: 100%; border-collapse: collapse; min-width: 560px; }
table.price caption {
  text-align: left; padding: var(--s5);
  font-family: var(--display); font-size: 1.05rem; font-weight: 600;
  letter-spacing: .09em; text-transform: uppercase; color: var(--paper);
  border-bottom: 1px solid var(--rule-hi);
}
table.price th, table.price td { padding: var(--s3) var(--s5); text-align: left; border-bottom: 1px solid var(--rule); vertical-align: top; }
table.price thead th {
  font-family: var(--display); font-size: .72rem; font-weight: 500;
  letter-spacing: .16em; text-transform: uppercase; color: var(--dim);
  border-bottom: 1px solid var(--rule-hi); white-space: nowrap;
}
table.price tbody th { font-weight: 400; color: var(--paper); }
table.price tbody th small { display: block; color: var(--dim); font-size: .78rem; margin-top: 2px; }
table.price td { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--paper); }
table.price td.tok { color: var(--gold); }
table.price tbody tr:last-child th, table.price tbody tr:last-child td { border-bottom: 0; }

/* --- faq ------------------------------------------------------------------ */
.faq { border-top: 1px solid var(--rule); }
.faq details { border-bottom: 1px solid var(--rule); }
.faq summary {
  padding: var(--s5) var(--s6) var(--s5) 0; cursor: pointer; list-style: none;
  font-family: var(--display); font-size: 1.05rem; font-weight: 500;
  letter-spacing: .04em; text-transform: uppercase;
  position: relative;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: ""; position: absolute; right: var(--s2); top: 50%;
  width: 11px; height: 11px; margin-top: -6px;
  border-right: 1px solid var(--gold); border-bottom: 1px solid var(--gold);
  transform: rotate(45deg); transition: transform .2s var(--ease);
}
.faq details[open] summary::after { transform: rotate(-135deg); }
.faq details > div { padding-bottom: var(--s5); color: var(--muted); }
.faq details > div > * + * { margin-top: var(--s3); }

/* --- forms ---------------------------------------------------------------- */
.field { display: block; }
.field + .field { margin-top: var(--s4); }
.field > span { display: block; margin-bottom: var(--s2); }
.field input, .field textarea, .field select {
  width: 100%; padding: var(--s3) var(--s4);
  background: var(--surface); color: var(--paper);
  border: 1px solid var(--rule-hi); border-radius: 0;
  transition: border-color .16s var(--ease);
}
.field input::placeholder, .field textarea::placeholder { color: var(--dim); }
.field input:hover, .field textarea:hover, .field select:hover { border-color: var(--chrome); }
.field input:focus, .field textarea:focus, .field select:focus { border-color: var(--gold); outline: none; }
.field textarea { min-height: 130px; resize: vertical; }
.field--half { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s4); }
@media (max-width: 560px) { .field--half { grid-template-columns: 1fr; } }
.field__err { color: var(--red); font-size: .82rem; margin-top: var(--s2); }

/* --- misc ----------------------------------------------------------------- */
.areas { display: grid; gap: var(--s5); grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.area { border-top: 1px solid var(--rule-gold); padding-top: var(--s4); }
.area h3 { font-size: 1.1rem; }
.area p { margin-top: var(--s2); font-size: .9rem; color: var(--dim); }
.area a { font-family: var(--display); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); text-decoration: none; display: inline-block; margin-top: var(--s3); }
.area a:hover { text-decoration: underline; text-underline-offset: .3em; }

.split { display: grid; gap: var(--s6); align-items: center; }
@media (min-width: 860px) { .split { grid-template-columns: 1fr 1fr; gap: var(--s7); } }
.split--wide { grid-template-columns: 1fr; }
@media (min-width: 860px) { .split--wide { grid-template-columns: 1.25fr 1fr; } }
.split img { width: 100%; border: 1px solid var(--rule); }

.checks { list-style: none; padding: 0; }
.checks li { position: relative; padding-left: var(--s5); font-size: .95rem; color: var(--muted); }
.checks li + li { margin-top: var(--s3); }
.checks li::before {
  content: ""; position: absolute; left: 0; top: .55em;
  width: 9px; height: 5px; border-left: 1.5px solid var(--gold); border-bottom: 1.5px solid var(--gold);
  transform: rotate(-45deg);
}

.notice { border: 1px solid var(--rule-gold); background: rgba(201, 162, 39, .05); padding: var(--s5); }
.notice--ok { border-color: rgba(74, 222, 128, .35); background: rgba(74, 222, 128, .05); }

/* --- footer --------------------------------------------------------------- */
.foot { border-top: 1px solid var(--rule); padding-block: var(--s7) var(--s6); }
.foot__grid { display: grid; gap: var(--s6); grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr)); }
.foot h2 { font-size: .78rem; letter-spacing: .17em; color: var(--dim); font-weight: 500; }
.foot ul { list-style: none; padding: 0; margin-top: var(--s4); }
.foot li + li { margin-top: var(--s2); }
.foot a { color: var(--muted); text-decoration: none; font-size: .9rem; }
.foot a:hover { color: var(--gold); }
.foot__base {
  margin-top: var(--s7); padding-top: var(--s5); border-top: 1px solid var(--rule);
  display: flex; flex-wrap: wrap; gap: var(--s4); justify-content: space-between;
  font-size: .8rem; color: var(--dim);
}
.foot__social { display: flex; gap: var(--s4); }
.foot__social a { display: inline-flex; }
.foot__social svg { width: 18px; height: 18px; fill: var(--dim); transition: fill .16s var(--ease); }
.foot__social a:hover svg { fill: var(--gold); }

/* --- sticky mobile action ------------------------------------------------- */
.dock {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  display: none; gap: 1px;
  background: var(--rule);
  border-top: 1px solid var(--rule-hi);
}
.dock a {
  flex: 1; padding: var(--s4) var(--s2); text-align: center; text-decoration: none;
  background: var(--ink-2);
  font-family: var(--display); font-size: .82rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--paper);
}
.dock a.is-primary { background: var(--gold); color: var(--ink); }
@media (max-width: 760px) {
  .dock { display: flex; }
  body { padding-bottom: 60px; }
}

/* --- drawn star (the icon system, not a Unicode glyph) -------------------- */
.stars { display: inline-flex; gap: 1px; vertical-align: -.12em; }
.star { width: 13px; height: 13px; fill: var(--gold); }
.quote .star { width: 12px; height: 12px; }

/* --- provisional marker --------------------------------------------------- */
/* These prices are not confirmed by the client yet and must not read as
   settled fact. Removed the moment they are signed off. */
.prov {
  font-family: var(--display); font-size: .73rem; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase;
  color: var(--ink); background: var(--chrome);
  padding: 1px 5px; margin-left: var(--s2);
  text-decoration: none; border-bottom: 0; cursor: help;
}

/* --- sheet dock (mobile: the estimate stays on screen while ticking) ------ */
.dock--sheet { align-items: stretch; }
.dock__sum {
  flex: 1; display: flex; flex-direction: column; justify-content: center;
  gap: 1px; padding: var(--s2) var(--s4); background: var(--ink-2);
}
.dock__sum strong {
  font-family: var(--display); font-weight: 700; font-size: 1.25rem;
  line-height: 1; color: var(--gold);
}
.dock--sheet a.is-primary { flex: 0 0 auto; display: flex; align-items: center; padding-inline: var(--s5); }
.dock--sheet a[aria-disabled="true"] { background: var(--surface-2); color: var(--dim); }

/* --- screen-reader only ---------------------------------------------------- */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* Legal links sit under the copyright line, quieter than the nav but reachable
   from every page — the terms page carries the token rules. */
.foot__base a { color: var(--dim); text-decoration-color: var(--rule); }
.foot__base a:hover { color: var(--gold); }