/* =========================================================================
   Schachclub Heilsbronn – Design Tokens (Richtung „Lebendig")
   In ein Kadence-Child-Theme einbinden (style.css) ODER als eigenes Stylesheet
   per wp_enqueue_style laden. Werte 1:1 aus der genehmigten HTML-Referenz.
   ========================================================================= */
:root {
  /* Flächen & Text */
  --sc-paper:        #FBF7EF; /* Seitenhintergrund (warmes Papierweiß) */
  --sc-surface:      #FFFFFF; /* Karten / Boxen */
  --sc-surface-alt:  #F4ECDD; /* getönte Bänder / Chips */
  --sc-ink:          #1C1A16; /* Haupttext / Überschriften */
  --sc-sub:          #6A6256; /* Sekundärtext */
  --sc-line:         #E8DECC; /* Trennlinien / Rahmen */

  /* Akzente (aus dem Vereinswappen) */
  --sc-accent:       #C1121F; /* Wappen-Rot – Buttons, Kicker, Hervorhebung */
  --sc-accent-2:     #E0A21C; /* Wappen-Gold – Zug-Markierung am Brett */

  /* Schachbrett */
  --sc-board-light:  #EAD8B4; /* helle Felder (Nussbaum/Creme) */
  --sc-board-dark:   #9C6B36; /* dunkle Felder */
  --sc-board-hl:     rgba(224,162,28,.42); /* Markierung letzter Zug / Lösung */

  /* Form & Tiefe */
  --sc-radius:       16px;
  --sc-radius-sm:    10px;
  --sc-pill:         999px;
  --sc-card-border:  1px solid #EFE6D6;
  --sc-card-shadow:  0 14px 34px -22px rgba(60,40,10,.45);

  /* Typografie (Google Fonts -> bitte lokal hosten, siehe README/OMGF) */
  --sc-font-display: 'Hanken Grotesk', system-ui, sans-serif; /* Überschriften: 800 */
  --sc-font-body:    'Hanken Grotesk', system-ui, sans-serif; /* Fließtext: 400–700 */
  --sc-font-mono:    'JetBrains Mono', ui-monospace, monospace; /* Labels/Kicker/Brett-Koordinaten */
}

/* --- Empfohlene Kadence-Globaleinstellungen (Customizer) ---
   Palette 1 = #C1121F, 2 = #E0A21C, 3 = #1C1A16, 4 = #6A6256,
   5 = #F4ECDD, 6 = #FBF7EF, 7 = #FFFFFF, 8 = #E8DECC
   Body-Font = Hanken Grotesk 400/500/700 · Headings = Hanken Grotesk 800
   Buttons = Hintergrund var(--sc-accent), Radius 999px, Text #fff
   ----------------------------------------------------------------- */

/* Hilfsklassen, die zur HTML-Referenz passen (optional fürs Child-Theme) */
.sc-kicker {
  font-family: var(--sc-font-mono);
  font-size: 12px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--sc-accent); font-weight: 600;
}
.sc-h2 {
  font-family: var(--sc-font-display); font-weight: 800;
  letter-spacing: -.025em; line-height: 1.08;
  font-size: clamp(26px, 3.4vw, 40px); color: var(--sc-ink); margin: 0;
}
.sc-card {
  background: var(--sc-surface); border: var(--sc-card-border);
  border-radius: var(--sc-radius); box-shadow: var(--sc-card-shadow);
}
.sc-btn-primary {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--sc-accent); color: #fff; border: 0;
  border-radius: var(--sc-pill); padding: 13px 22px;
  font-family: var(--sc-font-body); font-weight: 700; font-size: 15px;
  text-decoration: none; cursor: pointer;
}
.sc-btn-ghost {
  display: inline-flex; align-items: center; gap: 8px;
  background: transparent; color: var(--sc-ink);
  border: 1.5px solid var(--sc-line); border-radius: var(--sc-pill);
  padding: 11px 20px; font-weight: 700; font-size: 15px;
  text-decoration: none; cursor: pointer;
}