/* Public website typography. Keep the existing mobile/tablet layout through 1100px.
   Loaded after controls.css; the member portal does not load this stylesheet. */
@media (min-width:1101px) {
  body {
    --action-font:16px;
    --type-body:16px;
    --type-small:14px;
    --type-label:12px;
    --type-card:22px;
    font-size:var(--type-body);
    line-height:1.65;
  }

  h1,.hero-copy h1 {font-size:56px;line-height:1.12;letter-spacing:-1.8px}
  h2 {font-size:36px;line-height:1.2;letter-spacing:-1px}
  h3,.team-intro h3,.competition h3,.card h3,.social-card h3,
  .open-invitation h3,.application-guide>h3,.training-overview h3,
  .club-news-card h3 {font-size:var(--type-card);line-height:1.3;letter-spacing:-.35px}
  h4 {font-size:var(--type-body);line-height:1.4}
  .hero-club h2 {font-size:28px}

  .lead,.large,.team-intro .large,.club-copy .large,.join-copy .large {
    font-size:18px;line-height:1.75;
  }
  .section-heading>p:not(.eyebrow),.team-intro p,.competition p,
  .card p:not(.eyebrow),.open-invitation p,.club-copy p:not(.eyebrow):not(.large),
  .steps p,.social-card p:not(.eyebrow),.club-news-preview,
  .training-days,.training-timeline>div,.empty {
    font-size:var(--type-body);line-height:1.65;
  }
  .hero-note,.hero-club p,.hero-leagues li,.section-bottom p,
  .join-note,.application-tip,.training-note,.social-notice,
  .instagram-embed,.muted,.club-news-meta,.club-table-source,
  .club-league th,.status-pill {
    font-size:var(--type-small);line-height:1.6;
  }
  .eyebrow,.card .eyebrow,.social-card .eyebrow,.tag {
    font-size:var(--type-label);line-height:1.5;letter-spacing:1.5px;
  }
  .training-days strong {font-size:18px}
  .club-league table {font-size:var(--type-small)}

  body .club-bar {font-size:var(--type-small)}
  .club-bar .text-link {--action-font:14px}
  .brand {--action-font:18px}
  body .brand b {font-size:var(--type-small);letter-spacing:.6px}
  body footer p {font-size:var(--type-small);line-height:1.7}
  body .footer-links {gap:8px 24px;max-width:720px}
  /* .text-link otherwise uses inline-block, placing its text above adjacent flex links. */
  body .footer-links a {--action-font:14px;display:inline-flex;align-items:center}
  .club-table-source .text-link {--action-font:14px}

  /* Inline links align with the copy while retaining the shared 44px hit area. */
  body .text-link {padding-inline:0}
  .social-card p:not(.eyebrow) {margin:14px 0 16px}
}