/* =========================================================================
   Nuvario Sports · V5-Designsprache in Gruen
   Gemeinsame Gestaltungssprache fuer /sports, alle /sports/<sportart> und
   /sports/ratgeber. Orientiert an der freigegebenen V5-Startseite
   (css/glasklar-startseite.css), Blau -> Sports-Gruen. Gekapselt auf
   .theme-sports, damit nur die Sports-Welt betroffen ist.

   Prinzipien aus V5:
   - ruhige, flache helle Flaechen; keine Verlaeufe, keine Hintergrund-Blobs
   - grosse, kraeftige, eng gesetzte Ueberschriften; Eyebrow-Kicker (gesperrt)
   - flache Karten mit Haarlinie statt Glas/Schatten; Radius 16; Hover hebt an
   - grosszuegige, klar getrennte Abschnitte
   Der Hero (Haupt- wie Unterseiten) wird hier NICHT angefasst.
   ========================================================================= */

.theme-sports {
  --v5-line: #DBE9E1;      /* Haarlinie (Analog zu --v5-line #dbe5f3) */
  --v5-card-bd: #D8E7DF;   /* Kartenrand (Analog #e2eaf5) */
  --v5-tint: #D0ECE1;      /* flaches helles Band, hell aus dem Band-Gruen #0F4A34 abgeleitet (H=158) */
  --v5-tint2: #E6F5EF;     /* sekundaeres helles Feld, gleicher Farbton, heller */
  --v5-eyebrow: #276B4D;   /* gesperrter Kicker, etwas dunkler fuer Kontrast auf gruenem Band */
  --v5-icon-bg: #ECF5EF;   /* Icon-Kachel (Analog #f0f6ff) */
  --v5-icon-bd: #CFE6D8;   /* Icon-Kachelrand (Analog #d9e8ff) */
}

/* ---------- Hintergrund: ruhig, flach, keine Blobs, keine Verlaeufe ---------- */
body.theme-sports { background: #fff; }
.theme-sports .bg { display: none; }

/* ---------- Abschnittsrhythmus wie V5 (110/84/66) ---------- */
.theme-sports section { padding-block: 104px; }
.theme-sports .section--tight { padding-block: 96px; }

/* ---------- Ueberschriften wie V5: gross, kraeftig, eng ---------- */
.theme-sports .sec-head h2,
.theme-sports .sp-head h2,
.theme-sports .sp-faq-head h2 {
  font-size: clamp(34px, 3.6vw, 60px); line-height: 1.07; letter-spacing: -0.05em;
  font-weight: 800; color: var(--ink); text-wrap: balance;
}
.theme-sports .sp-more h2 {
  font-size: clamp(27px, 2.8vw, 42px); line-height: 1.1; letter-spacing: -0.04em; font-weight: 800; color: var(--ink);
}
.theme-sports h2 .soft, .theme-sports h2 .accent { color: var(--brand); }

/* ---------- Eyebrow-Kicker (gesperrt, ohne Punkt) · nur unterhalb des Heros ----------
   Hero-Kicker (.kicker-pill) bleiben unangetastet. */
.theme-sports .kicker:not(.kicker-pill) {
  display: inline-flex; align-items: center;
  font-size: 11px; letter-spacing: .2em; font-weight: 750; text-transform: uppercase;
  color: var(--v5-eyebrow); margin: 0 0 18px;
}
.theme-sports .kicker:not(.kicker-pill) .dot { display: none; }

/* ---------- Lead wie V5 ---------- */
.theme-sports .lead { font-size: clamp(16px, 1.2vw, 18px); line-height: 1.7; color: var(--ink2); }

/* ---------- Abschnittskopf: etwas enger als Standard ---------- */
.theme-sports .sec-head { margin-bottom: 46px; }

/* ---------- Karten wie V5: flach, Haarlinie, kein Schatten, Radius 16 ---------- */
.theme-sports .cards .card {
  background: #fff; border: 1px solid var(--v5-card-bd); border-radius: 16px; padding: 32px;
  box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none;
  transition: transform .5s var(--ease-out), border-color .3s var(--ease);
}
.theme-sports .cards .card.glass::before,
.theme-sports .cards .card.glass::after { display: none; }
@media (hover: hover) and (pointer: fine) {
  .theme-sports .cards .card:hover { transform: translateY(-6px); border-color: var(--brand-light); }
}
.theme-sports .cards .card h3 {
  font-size: 22px; font-weight: 680; letter-spacing: -0.03em; line-height: 1.25; color: var(--ink); margin: 0 0 10px;
}
.theme-sports .cards .card p { color: var(--ink2); font-size: 15.5px; line-height: 1.65; }

/* ---------- Icon-Kachel wie V5 ---------- */
.theme-sports .card .icon {
  width: 60px; height: 60px; margin-bottom: 22px; border-radius: 16px; display: inline-grid; place-items: center;
  background: var(--v5-icon-bg); border: 1px solid var(--v5-icon-bd); color: var(--brand); box-shadow: none;
}
.theme-sports .card .icon svg { width: 27px; height: 27px; }

/* ---------- FAQ an V5 angleichen: flach, Haarlinie ---------- */
.theme-sports .faq-item { background: #fff; border: 1px solid var(--v5-card-bd); box-shadow: none; }
.theme-sports .faq-item.glass::before, .theme-sports .faq-item.glass::after { display: none; }

/* ---------- Callout: flaches helles Feld ---------- */
.theme-sports .callout { background: var(--v5-tint); border: 1px solid var(--v5-card-bd); box-shadow: none; }

/* ---------- Bildrahmen: flacher, mit Haarlinie statt schwerem Schatten ---------- */
.theme-sports .media-frame {
  border: 1px solid var(--v5-card-bd); box-shadow: 0 22px 50px rgba(15, 74, 52, .12);
}

/* ---------- Abschluss (Kontakt) als FLACHES dunkles Gruen (kein Verlauf) ---------- */
.theme-sports .final { background: var(--brand-deep); box-shadow: 0 40px 90px rgba(15, 74, 52, .28); }
.theme-sports .final::before { display: none; }

/* ---------- Buttons: V5-Proportionen (Pill, gruen) · Hero ausgenommen ---------- */
.theme-sports main .btn:not(.btn-white) { font-weight: 650; }

/* ---------- Responsiv wie V5 ---------- */
@media (max-width: 1000px) {
  .theme-sports section { padding-block: 84px; }
  .theme-sports .section--tight { padding-block: 76px; }
}
@media (max-width: 600px) {
  .theme-sports section { padding-block: 64px; }
  .theme-sports .section--tight { padding-block: 60px; }
  .theme-sports .sec-head { margin-bottom: 34px; }
}