/* Presentation-only B/D experiment. Loaded by public templates on the preview branch,
   not by any private admin page. Production styles remain intact underneath. */
:root,
html[data-accent="gold"],
html[data-accent="yellow"] {
  --yellow: #cda434;
  --yellow-2: #d8b452;
  --red: #f80000;
  --white: #f5f4ef;
  --muted: #c2bfb7;
  --line: #353535;
}

/* The logo and header dimensions stay unchanged. */
header { border-bottom-width: 1px; }
header .navlinks a {
  position: relative;
  letter-spacing: .065em;
  text-decoration: none;
}
header .navlinks a[aria-current="page"],
.js header .navlinks a[aria-current="page"] {
  color: var(--yellow);
  text-decoration: none;
}
header .navlinks a[aria-current="page"]::after {
  content: "";
  position: absolute;
  bottom: 3px;
  left: calc(50% - 2px);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--red);
}

/* Race-programme display type is limited to the hero and major page titles. */
.home-intro h1,
.section-head h1,
.meeting-hero h1 {
  font-family: "Kanit", Racing, "Arial Black", Arial, sans-serif;
  font-style: italic;
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.05;
}
.home-intro h1 {
  font-size: clamp(2.45rem, 6vw, 5.25rem);
  margin: 16px 0 12px;
}
.tagline { font-size: clamp(1.1rem, 1.7vw, 1.4rem); }
.kicker { font-size: .75rem; letter-spacing: .16em; }
.kicker::before { width: 3px; height: 13px; background: var(--red); }
.eyebrow { font-size: .75rem; letter-spacing: .14em; }
.section-head h1 { font-size: clamp(2.3rem, 4.8vw, 4rem); }
.section-head p { line-height: 1.65; }

/* Three interaction styles: gold filled, quiet outline, and text/navigation. */
.btn {
  gap: 16px;
  border-radius: 3px;
  letter-spacing: .025em;
  text-transform: none;
  font-size: .9rem;
  font-weight: 800;
  box-shadow: none;
}
.btn::after { content: "→"; font-size: 1.15em; }
.btn.secondary { background: transparent; border-color: #84744b; }
.btn:hover,
.btn:focus-visible { background: #d8b452; border-color: #d8b452; color: #101010; }
.btn.secondary:hover,
.btn.secondary:focus-visible { background: #252219; color: var(--white); border-color: var(--yellow); }
.text-link { gap: 10px; font-size: .95rem; text-decoration-thickness: 1px; }
.text-link:hover,
.text-link:focus-visible { color: var(--yellow); text-decoration-color: currentColor; }
:focus-visible { outline: 3px solid var(--yellow); outline-offset: 4px; }
.standings :focus-visible { outline-color: #735800; }

/* Keep the same homepage order and footprints, but reduce competing box edges. */
.home-hero { border-bottom-width: 2px; }
.hero-track { border: 0; border-left: 2px solid var(--yellow); background: #101010b8; }
.hero-track:hover,
.hero-track:focus-visible { background: #202020e8; }
#Discover { gap: 24px; }
#Discover .audience {
  padding: 24px 28px;
  border: 0;
  border-top: 1px solid #454545;
  background: #191919;
}
#Discover .audience h2 { margin: 12px 0 20px; font-size: 1.6rem; }
#Discover .audience p { line-height: 1.7; margin-bottom: 0; }
#Discover .eyebrow,
.community-copy .eyebrow {
  display: flex;
  align-items: center;
  gap: 9px;
}
#Discover .eyebrow::before,
.community-copy .eyebrow::before {
  content: "";
  width: 3px;
  height: 11px;
  flex: 0 0 3px;
  background: var(--red);
}
.racing-toolkit {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid #3e3e3e;
}
.toolkit-link {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 16px;
  gap: 10px;
  align-items: center;
  min-height: 56px;
  padding: 12px 10px 12px 0;
  border-bottom: 1px solid #3e3e3e;
  text-decoration: none;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.3;
}
.toolkit-link:nth-child(even) { padding-left: 14px; border-left: 1px solid #3e3e3e; }
.toolkit-icon { width: 20px; height: 20px; fill: none; stroke: var(--yellow); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.toolkit-arrow { color: var(--yellow); text-align: right; }
.toolkit-link:hover,
.toolkit-link:focus-visible { background: #28251b; color: var(--yellow); }
.community-feature figure { border-bottom-width: 2px; }
.community-copy { border: 0; border-top: 1px solid #454545; background: #191919; }
.community-copy p { line-height: 1.7; }
.community-copy .audience-links { margin-top: 4px; }
.home-meeting { border-bottom: 1px solid var(--line); }
.home-meeting h2 { font-size: 1.55rem; line-height: 1.25; }
.home-meeting .meeting-separator { color: var(--muted); }
.home-gallery-heading h2 { font-size: clamp(1.55rem, 2.8vw, 2rem); letter-spacing: -.015em; }

/* Internal-page surfaces: no structure, table sizing, or behaviour changes. */
.cms-venue { border-top-width: 2px; }
.cms-venue .tag { letter-spacing: .14em; font-size: .72rem; }
.fixture { border-bottom: 1px solid #373737; background: #1d1d1d; }
.fixture h3 { line-height: 1.2; letter-spacing: -.015em; }
.previous-races { border-color: #424242; }
.fixture-replay { font-size: .875rem; font-weight: 700; text-decoration-thickness: 1px; }
.standing-tools .chip { border-radius: 3px; font-size: .85rem; }
.standing-tools .search { border-radius: 3px; }
.formula-heading { font-size: 1.35rem; letter-spacing: .015em; }
.rule-formula { border-left-width: 2px; }
.rule-formula summary { font-size: 1.2rem; letter-spacing: .015em; }
.honour-group { border-top-width: 2px; }
.honour-group h2 { letter-spacing: .025em; font-size: 1.25rem; }
.archive-card { border-color: #373737; }
.archive-date { font-size: .75rem; letter-spacing: .14em; }
.archive-copy h2 { font-size: clamp(1.65rem, 3.4vw, 2.6rem); line-height: 1.12; }
.archive-action { text-transform: none; letter-spacing: .025em; font-size: .9rem; }
.archive-header .archive-intro { line-height: 1.65; }
.meeting-hero { border-bottom-width: 2px; }
.meeting-meta { font-size: .875rem; letter-spacing: .025em; }
.meeting-section-head h2 { font-size: 1.75rem; letter-spacing: -.015em; }
.meeting-video { border-color: #373737; }
.video-channels { border-left-width: 2px; }
.foot-links a { font-size: .8rem; text-underline-offset: 4px; }

@media (max-width: 1000px) and (min-width: 821px) {
  .racing-toolkit { grid-template-columns: 1fr; }
  .toolkit-link:nth-child(even) { padding-left: 0; border-left: 0; }
}
@media (max-width: 820px) {
  header .navlinks a[aria-current="page"]::after { left: auto; right: 10px; bottom: calc(50% - 2px); }
  header .navlinks a[aria-current="page"],
  .js header .navlinks a[aria-current="page"] { text-decoration: none; }
}
@media (max-width: 600px) {
  .home-intro h1 { font-size: clamp(2.25rem, 10.2vw, 3.5rem); line-height: 1; }
  .hero-tracks { margin-top: 22px; }
  #Discover .audience { padding: 20px; }
  #Discover .audience h2 { margin-bottom: 14px; }
  .toolkit-link { min-height: 58px; gap: 8px; font-size: .82rem; }
  .toolkit-link:nth-child(even) { padding-left: 10px; }
  .community-copy { padding: 24px; }
  .home-meeting h2 { font-size: 1.4rem; }
  .section-head h1 { font-size: clamp(2rem, 8vw, 2.6rem); }
}
@media (max-width: 360px) {
  .racing-toolkit { grid-template-columns: 1fr; }
  .toolkit-link:nth-child(even) { padding-left: 0; border-left: 0; }
}

/* World Final qualification process */
.qualifier-intro-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.qualifier-intro-row p {
  flex: 1 1 auto;
}

.world-final-process-trigger {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 9px 12px;
  border: 1px solid #333;
  border-left: 3px solid var(--yellow);
  background: #242424;
  color: #fff;
  font: 800 .875rem/1.3 Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  letter-spacing: .025em;
  cursor: pointer;
}

.world-final-process-trigger:hover,
.world-final-process-trigger:focus-visible {
  background: #101010;
  outline: 2px solid var(--yellow);
  outline-offset: 3px;
}

.world-final-process-panel {
  display: grid;
  gap: 10px;
  padding: 16px;
}

.world-final-process-trigger span {color:var(--yellow)}
.world-final-process-dialog {max-height:calc(100dvh - 24px)}
.world-final-process-panel .driver-detail-heading {margin:0;gap:12px}
.world-final-process-panel .driver-detail-heading h2 {font-size:clamp(1.25rem,3vw,1.6rem);line-height:1.15;margin-top:3px}

.world-final-process-total {
  display: flex;
  align-items: baseline;
  gap: 10px;
  padding: 8px 12px;
  border-left: 4px solid var(--yellow);
  background: #171717;
  color: var(--white);
}

.world-final-process-total strong {
  color: var(--yellow);
  font-family: "Kanit", Racing, "Arial Black", Arial, sans-serif;
  font-size: 2.4rem;
  font-style: italic;
  line-height: 1;
}

.world-final-process-total span {
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.world-final-process-routes {
  border-top: 1px solid #d8d8d2;
}

.world-final-process-route {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 9px 0;
  border-bottom: 1px solid #d8d8d2;
}

.world-final-process-route > strong {
  color: #735800;
  font-family: "Kanit", Racing, "Arial Black", Arial, sans-serif;
  font-size: 1.4rem;
  font-style: italic;
  line-height: 1.1;
}

.world-final-process-route h3 {
  margin: 0 0 3px;
  font-size: .9rem;
  line-height: 1.2;
  text-transform: uppercase;
}

.world-final-process-route p {
  margin: 0;
  color: #55534d;
  font-size: .9rem;
  line-height: 1.3;
}

.world-final-process-notice {
  display: grid;
  gap: 4px;
  padding: 9px 12px;
  border-left: 4px solid var(--red);
  background: #f4e8e6;
}

.world-final-process-notice span {
  color: #8a211b;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.world-final-process-notice strong {
  color: #39110e;
  font-size: .95rem;
}

@media (max-width: 760px) {
  .qualifier-intro-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .world-final-process-trigger {
    margin-top: 2px;
  }

  .world-final-process-route {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 10px;
  }
  .world-final-process-panel {padding:12px 14px max(12px,env(safe-area-inset-bottom));gap:8px}
}

@media (max-height: 720px) {
  .world-final-process-panel {gap:6px}
  .world-final-process-route {padding:6px 0}
  .world-final-process-total {padding:6px 10px}
  .world-final-process-notice {padding:7px 10px;gap:2px}
}