/* FairShare Tourismus — zentrales CI (Fonts + Farb-Tokens)
   Eingebunden in ALLEN Seiten via <link rel="stylesheet" href="/theme.css">.
   Seiten nutzen ausschließlich diese Variablen — keine eigenen Hex-Farben mehr. */

@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-SemiBold.woff2") format("woff2");
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("/fonts/Inter-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}

:root {
  /* Marke — Petrol/Tiefblau mit Bernstein-Akzent */
  --brand:        #0E5A66;  /* Petrol — primäre Markenfarbe, Buttons, Links */
  --brand-deep:   #0A3D4A;  /* Tiefblau — Header, Hero, dunkle Flächen */
  --brand-ink:    #08303B;  /* fast-schwarzes Petrol — Überschriften auf hell */
  --brand-soft:   #E3EEF0;  /* helles Petrol — Hover, aktive Chips, Info-Boxen */
  --accent:       #E8A13D;  /* Bernstein — Akzente, Highlights, Wortmarken-Punkt */
  --accent-soft:  #FBF1DF;  /* helles Bernstein — Hinweis-Hintergründe */

  /* Flächen & Text */
  --bg:           #F5F8F8;  /* Seitenhintergrund */
  --card:         #FFFFFF;  /* Karten */
  --line:         #DCE6E7;  /* Rahmen/Trenner */
  --ink:          #1E2A2D;  /* Fließtext */
  --ink-soft:     #5B6B6E;  /* Sekundärtext */
  --ink-faint:    #8FA0A3;  /* Tertiärtext, Platzhalter */

  /* Ampel/Status (semantisch — bleiben unabhängig von der Marke) */
  --ok:           #2E8B57;
  --ok-soft:      #E4F3EA;
  --warn:         #C98A00;
  --warn-soft:    #FBF0D7;
  --bad:          #BE4436;
  --bad-soft:     #F9E7E4;

  /* Auf dunklen Flächen (Hero, Header) */
  --on-dark:      #F2F7F7;
  --on-dark-soft: #A9C4C9;

  /* Form */
  --radius:       10px;
  --radius-lg:    16px;
  --shadow:       0 1px 3px rgba(10, 61, 74, .08), 0 4px 16px rgba(10, 61, 74, .06);
  --font:         "Inter", -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body { font-family: var(--font); }

/* Wortmarke: <span class="wordmark">FairShare<i>·</i> Tourismus</span> */
.wordmark { font-weight: 700; letter-spacing: -.3px; color: var(--brand-ink); }
.wordmark i { font-style: normal; color: var(--accent); font-weight: 700; }
.wordmark small { font-weight: 400; color: var(--ink-soft); font-size: .8em; letter-spacing: 0; }
.wordmark.on-dark { color: var(--on-dark); }
.wordmark.on-dark small { color: var(--on-dark-soft); }