/* REDLINE page only (loaded by /redline-training on top of redline.css).
   Design pass, 28 Oct 2026: two typefaces, plain section headings, colour photos, and motion kept
   to the hero and to what the visitor does (station hover, buttons, slideshow). */

/* Two typefaces, as on the homepage: Jost for headings, Lato for everything else. Barlow Condensed and Space Mono are not loaded here. */
:root { --f-display: 'Jost', system-ui, sans-serif; --f-head: 'Jost', system-ui, sans-serif; --f-mono: var(--f-body); }
.faq__item summary, .station__name { font-family: var(--f-body); font-weight: 700; }

/* Small labels in sentence case, not tracked capitals */
.hero .eyebrow,
.fact dt,
.hero__date-label,
.partner-badge__label,
.partner-badge__place,
.footer__h,
.mobile-nav__wa { text-transform: none; letter-spacing: .01em; }
.hero .eyebrow { font-size: 16px; }
.fact dt { font-size: 14px; }
.hero__date-label { font-size: 14px; font-weight: 700; }
.partner-badge__label, .partner-badge__place { font-size: 14px; }
.footer__h { font-size: 15px; }
.station__name::before { font-size: 13px; letter-spacing: .04em; }

/* The race: the intro runs full width now that the outlined 12 is gone */
.race__head { display: block; }
@media (min-width: 960px) { .race__head { grid-template-columns: none; } }

/* Comfortable reading lines, under 80 characters */
.section p, .faq__item p { max-width: 66ch; }

/* Colour photos: the people in them are the point */
.track__bg, .track:hover .track__bg, .frame img { filter: none; }

/* Motion only where it answers the visitor, plus the hero's opening */
.partner-badge { animation: none; }
.frame { rotate: -1.5deg; }
.cta__bg { top: 0; height: 100%; animation: none; translate: none; }

/* How we coach: the three points are not a sequence, so no numbers and no number column */
.feature { grid-template-columns: 1fr; }
.feature h3 { text-transform: none; letter-spacing: 0; }
/* lighter shade on the "who it's for" photos: dark only behind the words */
.track::before { background: linear-gradient(180deg, rgba(20, 16, 13, 0) 0%, rgba(20, 16, 13, .1) 38%, rgba(20, 16, 13, .86) 100%); }

/* Station cards: a one-line description under each name, on a deeper shade */
.station::after { inset: 30% 0 0; background: linear-gradient(transparent, rgba(20, 16, 13, .55) 35%, rgba(20, 16, 13, .94)); }
.station__detail { font: 400 14px/1.4 var(--f-body); color: #EDE6DC; }
@media (max-width: 639px) { .station__detail { font-size: 13px; } .station__name { left: 10px; right: 10px; bottom: 10px; } }

/* Under the stations: a race-day panel. The red edge echoes the hero's red line. */
.race-notes { display: grid; gap: 32px; margin: 32px 0 0; padding: 32px 24px; background: var(--forge); color: var(--on-forge); border-left: 6px solid var(--red); }
@media (min-width: 900px) { .race-notes { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 56px; padding: 44px 48px; } }
.race-notes p { margin: 0; max-width: 60ch; }
.race-notes__figure { display: flex; align-items: baseline; gap: 12px; font: 800 clamp(64px, 9vw, 112px)/.9 var(--f-display); color: #fff; letter-spacing: .005em; }
.race-notes__unit { font: 700 clamp(20px, 2vw, 26px)/1 var(--f-display); text-transform: uppercase; letter-spacing: .04em; color: var(--amber); }
.race-notes__caption { margin-top: 10px !important; font-size: 17px; color: var(--muted-dark); }
.race-notes__level { margin-top: 24px !important; padding-top: 20px; border-top: 1px solid rgba(243, 238, 231, .18); font-size: 15px; line-height: 1.6; color: var(--muted-dark); }
.race-notes__h { margin: 0 0 10px; font: 800 clamp(26px, 2.6vw, 32px)/1 var(--f-display); text-transform: uppercase; color: #fff; }
.race-notes__class p { font-size: 17px; line-height: 1.6; color: #EDE6DC; }
.race-notes__kit { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 28px; padding: 0; list-style: none; }
.race-notes__kit li { padding: 7px 12px; border: 1px solid rgba(243, 238, 231, .28); font-size: 14px; line-height: 1.2; color: #EDE6DC; background: rgba(243, 238, 231, .04); }
@media (max-width: 639px) { .race-notes__cta { width: 100%; text-align: center; } }

/* ---------- Homepage theme ----------
   Jost headings, rounded Lato buttons and rounded corners, as on moviin.sg. The REDLINE red line,
   the race photos and the station grid stay as this page's race-specific touches. */
:root { --radius-lg: 10px; --radius: 7px; --radius-sm: 4px; }

/* headings: Jost 700, uppercase, at the homepage's sizes */
.hero__title, .s-title, .cta__title, .track h3, .fact dd, .race-notes__figure, .race-notes__h { font-family: var(--f-display); font-weight: 700; letter-spacing: .012em; }
.s-title { font-size: clamp(34px, 4.7vw, 58px); line-height: 1.08; max-width: 22ch; }
.hero__title { letter-spacing: -.005em; }
.hero__l--md { font-size: clamp(28px, 3.6vw, 50px); line-height: 1.05; }
.hero__l--xl { font-size: clamp(46px, 7vw, 92px); line-height: 1; letter-spacing: -.01em; }
.hero__sub { font-family: var(--f-head); font-weight: 500; }
.cta__title { font-size: clamp(36px, 6vw, 76px); line-height: 1.03; }
.track h3 { font-size: clamp(24px, 2.2vw, 30px); line-height: 1.1; }
.fact dd { font-size: 24px; line-height: 1.15; }
.feature h3 { font-family: var(--f-head); font-weight: 600; font-size: 24px; }
.stations__title { font-family: var(--f-head); }
.race-notes__figure { font-size: clamp(54px, 6.4vw, 84px); line-height: 1; }
.race-notes__unit { font: 700 18px/1 var(--f-body); letter-spacing: .02em; text-transform: none; }
.race-notes__h { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.1; }

/* buttons: rounded, sentence case, Lato */
.btn, .btn--sm, .consent .btn { min-height: 52px; padding: 0 26px; border-radius: 7px; font: 700 17px/1.2 var(--f-body); letter-spacing: .005em; text-transform: none; }
.btn--sm, .consent .btn { min-height: 44px; padding: 0 18px; font-size: 15px; }

/* rounded corners on cards, photos and panels */
.station, .track, .gallery__item, .partner-badge, .slot, .frame__clip, .race-notes { border-radius: 10px; }
.pills li { border-radius: 999px; }
.race-notes { border-left: 0; box-shadow: inset 6px 0 0 var(--red); }
.hero__date { border-radius: 7px; }

/* Level 1 (women) note under the stations heading */
.stations__title:has(+ .stations__note) { margin-bottom: 6px; }
.stations__note { margin: 0 0 20px; font-size: 15px; color: var(--muted); }
