/*
 * athletes.css — /athletes page composition only.
 * Story 29.5 (2026-09-26): /athletes on standard v1, Dark Poster family.
 *
 * Loaded AFTER /public/tlt-site.css. Components (buttons, eyebrow, headings,
 * bullet rows, torn edge, section surfaces, footer CTA) come from the
 * standard; this file only places them. Rules it keeps:
 *   - tokens only: no hex, no font names, spacing from the --space-* scale;
 *   - no media query for layout: the one 760px breakpoint lives in
 *     tlt-site.css;
 *   - no restyling of standard components.
 */

/* Anchor jumps (#how, #hero): smooth only when the visitor allows motion. */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }
}

/* Hero: logo, brush tagline, copper swash, lead, one primary CTA -------- */

.ath-hero {
  padding-block: var(--space-48) var(--space-96);
  background: radial-gradient(ellipse at 50% 30%, var(--surface) 0%, var(--night) 70%);
}

/* Centred poster (standard v1.4.0 centred default; supersedes the 29.5
   left-aligned hero). On narrow phones the centred CTA may leave the sled
   too little room; the figure's own minimum-room rule then skips it. */
.ath-hero__in {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.ath-hero__logo {
  width: 260px;
}

.ath-hero__title {
  margin-top: var(--space-32);
  text-wrap: balance;
}

.ath-accent {
  color: var(--c-accent);
}

.ath-swash {
  display: block;
  width: 200px;
  max-width: 60%;
  height: var(--space-4);
  margin-top: var(--space-16);
  border-radius: var(--space-4);
  background: var(--copper);
  transform: rotate(-3deg);
}

.ath-hero__lead {
  margin-block: var(--space-32);
}

/* Section heads: eyebrow + h2 + lead ------------------------------------ */

.ath-head {
  max-width: 760px;
  margin: 0 auto var(--space-48);
}

.ath-head .lead {
  margin-top: var(--space-16);
}

/* CTA: the copper band ---------------------------------------------------- */

.ath-cta {
  text-align: center;
}

.ath-cta__body {
  max-width: 52ch;
  margin: var(--space-24) auto var(--space-32);
  font-size: var(--fs-body-lg);
  color: var(--c-muted);
}

.ath-cta__coach {
  margin-top: var(--space-48);
}
