/* Dundalk Stadium · One Lap
   One continuous place at night: the ground drifts through a single navy
   family while the visitor runs one lap of the oval. Chalk lines, teal for
   the map, Dundalk red for the runner and the one action. */

:root {
  --navy: #13194A;
  --night: #0B0F2E;
  --deep: #070920;
  --chalk: #F3F1EA;
  --chalk-soft: #B8BDD8;
  --teal: #84CBBB;
  --red: #DC4462;
  --red-lift: #FF7C93;
  --sky-ink: #13194A;

  --sc-canvas: var(--night);
  --sc-surface: #141A4A;
  --sc-ink: var(--chalk);
  --sc-ink-soft: var(--chalk-soft);
  --sc-accent: var(--red);
  --sc-accent-ink: #fff;
  --sc-font-display: "Newsreader", Georgia, serif;
  --sc-font-text: "Geist", system-ui, sans-serif;
  --sc-font-mono: "Geist Mono", ui-monospace, monospace;
  --sc-shadow-color: 232 60% 4%;
  --bar-h: 4rem;
}

html { background: var(--night); }
body { background: var(--sc-canvas); color: var(--chalk); font-family: var(--sc-font-text); }
::selection { background: var(--red); color: #fff; }
:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; border-radius: 4px; }

.sr-only { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: fixed; left: 1rem; top: -4rem; z-index: 100; background: var(--red); color: #fff; padding: .6rem 1rem; border-radius: 8px; }
.skip:focus { top: 1rem; }

.display {
  font-family: var(--sc-font-display); font-weight: 500; font-optical-sizing: auto;
  font-size: clamp(2.3rem, 1.5rem + 3.2vw, 4.4rem); line-height: 1.02; letter-spacing: -0.022em;
  margin: 0; text-wrap: balance; max-width: 16ch;
}
.display--xl { font-size: clamp(3.4rem, 2rem + 7vw, 8.5rem); letter-spacing: -0.035em; line-height: .92; }
.point {
  font-family: var(--sc-font-mono); font-size: var(--sc-t-xs); letter-spacing: .14em; text-transform: uppercase;
  color: var(--teal); margin: 0;
}
.sc-body { color: var(--chalk-soft); }
.textlink { color: var(--chalk); text-decoration: underline; text-decoration-color: var(--teal); text-underline-offset: .25em; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 2.9rem; padding: .7rem 1.25rem; border-radius: 999px;
  font-weight: 600; font-size: .95rem; text-decoration: none; letter-spacing: .005em;
  transition: background-color var(--sc-d-base) var(--sc-ease-out), color var(--sc-d-base) var(--sc-ease-out), border-color var(--sc-d-base) var(--sc-ease-out);
}
.btn--red { background: var(--red); color: #fff; box-shadow: var(--sc-e1); }
.btn--red:hover { background: #C8345A; }
.btn--line { border: 1px solid color-mix(in oklab, var(--chalk) 40%, transparent); color: var(--chalk); }
.btn--line:hover { border-color: var(--chalk); }

/* ------------------------------------------------------------- the bar -- */
.bar {
  position: fixed; inset: 0 0 auto 0; z-index: 70; height: var(--bar-h);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--sc-gutter); pointer-events: none;
  color: var(--chalk); transition: color 300ms var(--sc-ease-out);
}
.bar > * { pointer-events: auto; }
.bar[data-ground="sky"] { color: var(--sky-ink); }
.bar__brand { display: inline-flex; align-items: center; gap: .6rem; text-decoration: none; font-weight: 600; letter-spacing: .01em; }
.bar__mark { width: 1.9rem; height: 1.9rem; }
.mk-a { fill: currentColor; }
.bar__cta { min-height: 2.6rem; padding: .55rem 1.1rem; }

/* ----------------------------------------------------------- the reader -- */
.reader {
  position: fixed; z-index: 65; right: clamp(1rem, 2.4vw, 2.25rem); bottom: clamp(1rem, 2.4vw, 2rem);
  width: min(20rem, 30vw);
  display: grid; grid-template-columns: 1fr; gap: .55rem;
  padding: .85rem 1rem 1rem;
  background: color-mix(in oklab, var(--deep) 84%, transparent);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  border: 1px solid color-mix(in oklab, var(--chalk) 14%, transparent);
  border-radius: 16px; box-shadow: var(--sc-e3);
}
.reader__toggle { all: unset; display: block; cursor: default; border-radius: 8px; }
.reader__map { width: 100%; height: auto; max-height: 4.6rem; overflow: visible; }
.map__base { fill: none; stroke: color-mix(in oklab, var(--chalk) 22%, transparent); stroke-width: 16; }
.map__run { fill: none; stroke: var(--teal); stroke-width: 16; stroke-linecap: round; stroke-dasharray: 1 2; stroke-dashoffset: calc(1 - var(--lap, 0)); }
.map__ticks line { stroke: color-mix(in oklab, var(--chalk) 55%, transparent); stroke-width: 5; }
.map__post { stroke: var(--red-lift); stroke-width: 9; }
.map__marks a circle { fill: var(--deep); stroke: var(--chalk); stroke-width: 7; transition: fill 200ms; }
.map__marks a:hover circle, .map__marks a:focus-visible circle { fill: var(--teal); }
.map__marks a[aria-current="true"] circle { fill: var(--chalk); }
.map__runner { fill: var(--red); stroke: #fff; stroke-width: 7; }
.reader__text { min-width: 0; }
.reader__meta {
  display: flex; justify-content: space-between; gap: 1rem; margin: 0 0 .3rem;
  font-family: var(--sc-font-mono); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--teal);
}
.reader__left { color: var(--chalk); font-variant-numeric: tabular-nums; }
.reader__call {
  margin: 0; min-height: 2.7em;
  font-family: var(--sc-font-display); font-style: italic; font-size: 1.04rem; line-height: 1.3; color: var(--chalk);
}
.reader__caret { display: inline-block; width: .5em; height: 2px; margin-left: .15em; vertical-align: .15em; background: var(--red-lift); animation: caret 900ms steps(2, start) infinite; }
@keyframes caret { to { visibility: hidden; } }
.reader__list { display: none; }
.reader__list ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .1rem; }
.reader__list a { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem .2rem; text-decoration: none; border-bottom: 1px solid color-mix(in oklab, var(--chalk) 10%, transparent); font-weight: 500; }
.reader__list small { color: var(--chalk-soft); font-weight: 400; }
.reader[data-hidden="true"] { opacity: 0; transform: translateY(12px); pointer-events: none; }
.reader { transition: opacity 320ms var(--sc-ease-out), transform 320ms var(--sc-ease-out); }

/* ----------------------------------------------------------------- hero -- */
.hero__stage { background: #d6e8ea; }
.hero__skyfill { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
.scene {
  --sw: max(100vw, calc(100svh * 1.7774));
  position: absolute; bottom: 0; left: calc((100vw - var(--sw)) / 2);
  width: var(--sw); aspect-ratio: 1900 / 1069; pointer-events: none;
}
.scene img { max-width: none; }
.scene__sky {
  position: absolute; top: 0; left: 0; width: 100%; height: auto;
  transform: translate3d(0, calc(var(--sc-p, 0) * -1.5%), 0);
}
.hero__dusk {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, #050719 0%, #0B0F2E 45%, #24204A 78%, #3A2A4E 100%);
  opacity: clamp(0, calc((var(--sc-p, 0) - 0.31) * 3.2), 0.94);
}
.hero__title { color: var(--sky-ink); position: absolute; z-index: 3; left: var(--sc-gutter); top: calc(var(--bar-h) + clamp(.5rem, 3vh, 2.5rem)); }
.hero__title h1 {
  margin: 0; font-family: var(--sc-font-display); font-weight: 500; font-optical-sizing: auto;
  font-size: clamp(3.6rem, 1rem + 7.2vw, 9rem); line-height: .9; letter-spacing: -0.035em;
  color: var(--sky-ink);
}
.scene--front { z-index: 4; }
.scene__land {
  position: absolute; left: 0; width: 100%; top: 33.4%; height: 66.6%;
  transform-origin: 50% 100%;
  transform: translate3d(0, calc(var(--sc-p, 0) * -11%), 0) scale(calc(1 + var(--sc-p, 0) * 0.06));
}
.scene__land img { position: absolute; inset: 0; width: 100%; height: 100%; }
.scene__landdusk {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(7, 9, 32, .92) 0%, rgba(7, 9, 32, .62) 22%, rgba(7, 9, 32, .6) 50%, rgba(7, 9, 32, .9) 100%);
  -webkit-mask: url(assets/hero-land2.webp) center / 100% 100% no-repeat; mask: url(assets/hero-land2.webp) center / 100% 100% no-repeat;
  opacity: clamp(0, calc((var(--sc-p, 0) - 0.31) * 2.8), 0.84);
}
.scene__line { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.line__glow, .line__ink { fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1 2;
  stroke-dashoffset: calc(1 - clamp(0, (var(--sc-p, 0) - 0.03) / 0.55, 1)); }
.line__glow { stroke: rgba(7, 9, 32, .55); stroke-width: 11; }
.line__ink { stroke: var(--chalk); stroke-width: 4.5; }
.line__lamps circle { fill: url(#lamp); opacity: clamp(0, calc((var(--sc-p, 0) - 0.42) * 3.2), 1); }
.hero__floor {
  position: absolute; inset: auto 0 0 0; height: 34%; z-index: 5; pointer-events: none;
  background: linear-gradient(to top, var(--night) 0%, color-mix(in oklab, var(--night) 70%, transparent) 40%, transparent 100%);
  opacity: clamp(0.25, calc(var(--sc-p, 0) * 2), 1);
}
.hero__sub { position: absolute; z-index: 6; left: var(--sc-gutter); top: calc(var(--bar-h) + clamp(1rem, 5vh, 3.5rem)); max-width: min(40rem, 62vw); }
.hero__kicker { margin: 0 0 .7rem; font-family: var(--sc-font-mono); font-size: var(--sc-t-xs); letter-spacing: .14em; text-transform: uppercase; color: #A9E3D5; }
.hero__line { margin: 0; font-family: var(--sc-font-display); font-size: clamp(1.6rem, 1.1rem + 1.8vw, 2.9rem); line-height: 1.08; letter-spacing: -0.015em; color: var(--chalk); text-wrap: balance; }
.hero__date { margin: 1rem 0 0; font-family: var(--sc-font-mono); font-size: .85rem; color: var(--chalk); }

/* ------------------------------------------------------------ the start -- */
.start { padding-block: clamp(4rem, 8vw, 8rem) clamp(4rem, 8vw, 9rem); }
.start__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 4vw, 4.5rem); align-items: start; }
.start__copy { padding-top: clamp(0rem, 3vw, 3rem); }
.start__photo { margin: 0; grid-row: span 2; }
.start__photo img { width: 100%; height: auto; border-radius: 6px; box-shadow: var(--sc-e3); }
.board {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.4rem 2rem;
  border-top: 2px solid var(--chalk); padding-top: 1.2rem;
}
.board h3 { margin: 0 0 .7rem; font-size: 1.05rem; font-weight: 600; }
.board h3 span { display: block; margin-top: .15rem; font-weight: 400; font-size: .85rem; color: var(--teal); font-family: var(--sc-font-mono); letter-spacing: .02em; }
.board dl, .menu { margin: 0; display: grid; }
.board dl > div, .menu > div {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  padding: .5rem 0; border-bottom: 1px dashed color-mix(in oklab, var(--chalk) 22%, transparent);
}
.board dt, .menu dt { color: var(--chalk-soft); }
.board dd, .menu dd { margin: 0; font-family: var(--sc-font-mono); font-variant-numeric: tabular-nums; color: var(--chalk); white-space: nowrap; }
.board__note { grid-column: 1 / -1; margin: 0; color: var(--chalk-soft); font-size: .92rem; }

/* -------------------------------------------------------- back straight -- */
.straight__stage { background: var(--sc-canvas); display: flex; align-items: center; }
.straight__rail { align-items: center; gap: clamp(1.25rem, 2.5vw, 2.5rem); padding-inline: var(--sc-gutter) 0; height: 100%; }
.straight__rail > * { flex: 0 0 auto; }
.straight__head { width: min(30rem, 80vw); }
.straight__head .display { margin-bottom: 1.1rem; }
.frame { margin: 0; position: relative; }
.frame img { height: 100%; width: auto; object-fit: cover; border-radius: 4px; box-shadow: var(--sc-e2); }
.frame figcaption {
  position: absolute; left: 0; top: calc(100% + .7rem);
  font-family: var(--sc-font-mono); font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--chalk-soft);
}
.frame--a { height: 48vh; translate: 0 -8vh; }
.frame--b { height: 58vh; translate: 0 4vh; }
.frame--c { height: 44vh; translate: 0 -10vh; }
.frame--d { height: 56vh; translate: 0 6vh; }
.frame--e { height: 50vh; translate: 0 -4vh; }
.straight__tail { width: min(24rem, 78vw); padding-right: var(--sc-gutter); }
.straight__next { margin: .5rem 0 .9rem; font-family: var(--sc-font-display); font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.8rem); line-height: 1.05; }
.straight__tail .sc-body { margin-bottom: 1rem; }
.straight__railline {
  position: absolute; left: 0; right: 0; top: calc(50% + 36vh); height: 2px;
  background: repeating-linear-gradient(90deg, var(--chalk) 0 60px, transparent 60px 64px);
  opacity: .35; pointer-events: none;
}
@media (prefers-reduced-motion: no-preference) {
  .straight .frame { opacity: max(0.55, min(1, calc(var(--sc-p, 0) * 6 - var(--i, 0) * 0.9 + 1))); }
}

/* ------------------------------------------------------------- far turn -- */
.turn__stage { background: var(--deep); }
.turn__stage video, .turn__stage .sc-stage__poster { object-position: 80% 50%; }
.turn__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  /* copy top and bottom-left */
  background: linear-gradient(180deg, rgba(5, 7, 25, .9) 0%, rgba(5, 7, 25, .55) 28%, transparent 52%),
              linear-gradient(0deg, rgba(5, 7, 25, .94) 0%, rgba(5, 7, 25, .82) 26%, transparent 48%); }
.turn__copy { position: absolute; z-index: 3; left: var(--sc-gutter); top: calc(var(--bar-h) + clamp(1rem, 4vh, 3rem)); max-width: 44rem; }
.turn__copy .display { max-width: 18ch; }
.turn__facts { position: absolute; z-index: 3; left: var(--sc-gutter); bottom: clamp(2rem, 7vh, 4.5rem); max-width: min(30rem, 52vw); display: grid; gap: .6rem; }
.turn__facts p { margin: 0; font-size: var(--sc-t-lg); line-height: 1.4; color: var(--chalk); text-wrap: pretty; }

/* ------------------------------------------------------------ home turn -- */
.view { padding-block: clamp(4rem, 8vw, 8rem); }
.view__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; padding-left: var(--sc-gutter); }
.view__room { margin: 0; height: min(86vh, 54rem); }
.view__room img { width: 100%; height: 100%; object-fit: cover; object-position: 30% 50%; }
.view__copy .display { max-width: 13ch; }
.menu { margin-top: 1.4rem !important; border-top: 2px solid var(--chalk); }
.menu dd { font-size: 1.05rem; }
.also { list-style: none; padding: 0; margin-top: 1.4rem !important; display: grid; gap: .65rem; color: var(--chalk-soft); font-size: .95rem; }
.also b { color: var(--chalk); font-weight: 600; }

/* --------------------------------------------------------- furlong pole -- */
.pole { padding-block: clamp(4rem, 8vw, 8rem) clamp(5rem, 9vw, 10rem); overflow: clip; }
.pole__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.pole__copy .display { max-width: 15ch; }
.menu--xmas dd { font-size: .95rem; }
.pole__contact { margin: 0; display: flex; flex-wrap: wrap; gap: .4rem .8rem; align-items: baseline; }
.pole__contact a { color: var(--chalk); font-weight: 600; text-decoration-color: var(--red-lift); text-underline-offset: .25em; }
.pole__contact span { color: var(--chalk-soft); }
.pole__photos { position: relative; height: min(46rem, 88vh); }
.pp { position: absolute; margin: 0; box-shadow: var(--sc-e3); }
.pp img { width: 100%; height: 100%; object-fit: cover; border-radius: 4px; }
.pp--a { left: 4%; top: 6%; width: 74%; aspect-ratio: 3 / 2; }
.pp--b { right: 0; top: 46%; width: 50%; aspect-ratio: 3 / 2; z-index: 2; }
.pp--c { left: 0; top: 62%; width: 44%; aspect-ratio: 3 / 2; z-index: 1; }

/* ------------------------------------------------- final furlong (peak) -- */
.run__stage { background: var(--deep); }
.run__stage video, .run__stage .sc-stage__poster { object-position: 50% 22%; }
.run__scrim { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, rgba(5, 7, 25, .82) 0%, rgba(5, 7, 25, .45) 30%, transparent 55%),
              linear-gradient(0deg, rgba(5, 7, 25, .7) 0%, transparent 35%),
              radial-gradient(60% 45% at 0% 100%, rgba(5, 7, 25, .9) 0%, rgba(5, 7, 25, .6) 45%, transparent 100%),
              radial-gradient(50% 50% at 0% 0%, rgba(5, 7, 25, .85) 0%, rgba(5, 7, 25, .55) 50%, transparent 100%); }
.run__callscrim { position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: linear-gradient(0deg, rgba(5, 7, 25, .92) 0%, rgba(5, 7, 25, .8) 32%, rgba(5, 7, 25, .4) 55%, transparent 72%);
  opacity: clamp(0, calc((var(--sc-p, 0) - 0.72) * 9), 1); }
.run__post {
  position: absolute; z-index: 2; top: 0; bottom: 0; left: 0; width: 6px; margin-left: -3px;
  background: linear-gradient(180deg, #fff 0%, #fff 100%);
  box-shadow: 2px 0 10px rgba(0, 0, 0, .35);
  transform: translate3d(calc(var(--post-x, 110) * 1vw), 0, 0);
  will-change: transform;
}
.run__disc { position: absolute; top: 18%; left: 50%; width: 4.5rem; height: 4.5rem; margin-left: -2.25rem; border-radius: 50%;
  background: radial-gradient(circle, #fff 0 34%, var(--red) 35% 100%); border: 3px solid #fff; box-shadow: 3px 4px 14px rgba(0, 0, 0, .35); }
.run__count .point { color: #A9E3D5; }
.run__count { position: absolute; z-index: 3; left: var(--sc-gutter); top: calc(var(--bar-h) + clamp(1rem, 4vh, 3rem)); }
.run__yards { margin: .9rem 0 0; display: grid; gap: .6rem; }
.run__n { font-family: var(--sc-font-display); font-weight: 500; font-size: clamp(5rem, 3rem + 10vw, 13rem); line-height: .85; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.run__u { font-family: var(--sc-font-mono); font-size: .9rem; letter-spacing: .12em; text-transform: uppercase; color: var(--chalk); }
.run__call {
  position: absolute; z-index: 4; left: var(--sc-gutter); right: var(--sc-gutter); bottom: clamp(9rem, 22vh, 14rem);
  margin: 0; font-family: var(--sc-font-display); font-style: italic; font-weight: 600;
  font-size: clamp(3.4rem, 1.4rem + 8vw, 10rem); line-height: .9; letter-spacing: -0.03em; color: #fff;
  text-shadow: 0 4px 30px rgba(5, 7, 25, .55);
}
.run__call span { display: block; }

/* ---------------------------------------------------------- winning post -- */
.post { padding-top: clamp(4rem, 8vw, 8rem); }
.post__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(2rem, 5vw, 5rem); align-items: start; padding-bottom: clamp(4rem, 8vw, 7rem); }
.post__head .sc-body { max-width: 30ch; }
.nights { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; }
.nights fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.nights__legend { padding: 0; margin-bottom: .8rem; font-family: var(--sc-font-mono); font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--teal); }
.nights__list { display: grid; gap: .4rem; }
.night { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .1rem .8rem; align-items: center; padding: .7rem .9rem; border-radius: 10px; border: 1px solid color-mix(in oklab, var(--chalk) 14%, transparent); cursor: pointer; }
.night:hover { border-color: color-mix(in oklab, var(--chalk) 40%, transparent); }
.night input { grid-row: span 2; accent-color: var(--red); width: 1.1rem; height: 1.1rem; margin: 0; }
.night b { font-weight: 600; }
.night small { color: var(--chalk-soft); font-size: .85rem; }
.night:has(input:checked) { border-color: var(--chalk); background: color-mix(in oklab, var(--chalk) 6%, transparent); }
.ticket { align-self: start; position: sticky; top: calc(var(--bar-h) + 1rem); padding: 1.4rem 1.4rem 1.5rem; border-radius: 14px; background: var(--chalk); color: var(--night); box-shadow: var(--sc-e3); }
.ticket p { margin: 0; }
.ticket__kind { font-family: var(--sc-font-mono); font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: #9B2340; }
.ticket__date { margin-top: .35rem !important; font-family: var(--sc-font-display); font-size: 2rem; line-height: 1.05; letter-spacing: -0.02em; }
.ticket__when { margin-top: .7rem !important; color: #3A3F63; }
.ticket__price { margin-top: .9rem !important; padding-top: .8rem; border-top: 1px dashed rgba(19, 25, 74, .35); font-family: var(--sc-font-mono); font-size: .88rem; color: var(--night); }
.ticket__actions { display: grid; gap: .55rem; margin-top: 1.2rem; }
.ticket .btn--line { color: var(--night); border-color: rgba(19, 25, 74, .35); }
.ticket .btn--line:hover { border-color: var(--night); }

.foot { border-top: 1px solid color-mix(in oklab, var(--chalk) 14%, transparent); padding: 2.5rem 0 calc(2rem + env(safe-area-inset-bottom)); font-size: .9rem; color: var(--chalk-soft); }
.foot__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; padding-right: calc(min(20rem, 30vw) + 2rem); }
.foot p { margin: 0 0 .35rem; }
.foot a { color: var(--chalk); text-decoration-color: color-mix(in oklab, var(--chalk) 35%, transparent); }
.foot__brand { display: flex; align-items: center; gap: .5rem; color: var(--chalk); font-weight: 600; }
.foot__mark { width: 1.4rem; height: 1.4rem; }
.foot__social { display: flex; flex-wrap: wrap; gap: .4rem 1rem; align-content: start; }
.foot__small { margin-top: 1.6rem !important; font-size: .8rem; }

/* ---------------------------------------------------------------- phone -- */
@media (max-width: 860px) {
  :root { --bar-h: 3.5rem; }
  .bar__brand span { font-size: .95rem; }
  .bar__cta { min-height: 2.5rem; padding: .5rem .95rem; font-size: .88rem; }

  .reader {
    left: .6rem; right: .6rem; bottom: calc(.6rem + env(safe-area-inset-bottom)); width: auto;
    grid-template-columns: 5.6rem minmax(0, 1fr); align-items: center; gap: .75rem;
    padding: .6rem .8rem; border-radius: 14px;
  }
  .reader__toggle { cursor: pointer; padding: .25rem; margin: -.25rem; min-height: 44px; display: flex; align-items: center; }
  .map__marks { display: none; }
  .reader__meta { margin-bottom: .15rem; font-size: .66rem; }
  .reader__call { font-size: .98rem; min-height: 2.6em; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .reader__list { grid-column: 1 / -1; }
  .reader[data-open="true"] .reader__list { display: block; }

  .scene { --sw: 210vw; left: -49vw; bottom: 5.5rem; }
  .scene__sky { display: none; }
  .hero__skyfill { object-position: 50% 0; }
  .hero__title { top: calc(var(--bar-h) + 2rem); }
  .hero__title h1 { font-size: clamp(3.4rem, 17vw, 5.5rem); }
  .hero__floor { height: 52%; }
  .hero__sub { right: var(--sc-gutter); max-width: none; top: calc(var(--bar-h) + 1.5rem); }
  .hero__line { font-size: 1.55rem; }

  .start__grid { grid-template-columns: minmax(0, 1fr); }
  .start__photo { grid-row: auto; }
  .board { grid-template-columns: minmax(0, 1fr); }

  .frame--a { height: 34vh; } .frame--b { height: 40vh; } .frame--c { height: 32vh; } .frame--d { height: 40vh; } .frame--e { height: 36vh; }
  .straight__head { width: 82vw; }
  .straight__railline { top: calc(50% + 26vh); }

  .turn__stage video, .turn__stage .sc-stage__poster { object-position: 50% 50%; }
  .turn__facts { max-width: none; right: var(--sc-gutter); bottom: 7.5rem; }
  .turn__facts p { font-size: 1.05rem; }

  .view__grid { grid-template-columns: minmax(0, 1fr); padding: 0; }
  .view__room { order: -1; }
  .view__room { height: 62vh; }
  .view__copy { padding-inline: var(--sc-gutter); }

  .pole__grid { grid-template-columns: minmax(0, 1fr); }
  .pole__photos { height: 26rem; }

  .run__stage video, .run__stage .sc-stage__poster { object-position: 60% 50%; }
  .run__scrim { background: linear-gradient(180deg, rgba(5, 7, 25, .9) 0%, rgba(5, 7, 25, .78) 30%, rgba(5, 7, 25, .3) 46%, transparent 58%), linear-gradient(0deg, rgba(5, 7, 25, .82) 0%, transparent 40%); }
  .run__n { font-size: clamp(4.5rem, 26vw, 7rem); }
  .run__call { bottom: 7.5rem; font-size: clamp(3rem, 15vw, 4.6rem); }
  .run__disc { width: 3.2rem; height: 3.2rem; margin-left: -1.6rem; }

  .post__grid { grid-template-columns: minmax(0, 1fr); }
  .nights { grid-template-columns: minmax(0, 1fr); }
  .ticket { position: static; }
  .foot__grid { grid-template-columns: minmax(0, 1fr); padding-right: 0; }
  .foot { padding-bottom: calc(7.5rem + env(safe-area-inset-bottom)); }
}

@media (max-width: 860px) and (max-height: 700px) {
  .hero__title h1 { font-size: 3rem; }
  .hero__line { font-size: 1.3rem; }
  .hero__sub { top: calc(var(--bar-h) + 1rem); }
  .turn__copy .display, .view__copy .display { font-size: 2rem; }
  .run__n { font-size: 4rem; }
  .run__call { font-size: 2.6rem; bottom: 6.5rem; }
  .turn__facts { bottom: 6.5rem; }
  .turn__facts p { font-size: .95rem; }
}

/* ------------------------------------------------------- reduced motion -- */
@media (prefers-reduced-motion: reduce) {
  .scene__sky, .scene__land { transform: none; }
  .line__glow, .line__ink { stroke-dashoffset: 0; }
  .reader__caret { animation: none; }
  .run__post { display: none; }
  .straight__rail { gap: 1.5rem; }
}