/* =========================================================
   FARBVARIANTE „MEHR BLAU"  ·  styles-blue.css
   ---------------------------------------------------------
   Vorschlag angelehnt an die aktuelle Live-Seite
   (Navy + Mittelblau #3377bb). Wird NACH styles.css und
   styles-warm.css geladen und überschreibt nur die Farben —
   Layout, Typografie und Struktur bleiben unverändert.
   Warme Akzente (Notfall, Avatare) bleiben als freundlicher
   Kontrast erhalten.
   ========================================================= */
:root {
  /* --- Flächen: kühles, helles Blau statt Mint/Creme --- */
  --bg:        oklch(0.994 0.004 250);   /* nahezu weiß, kühl */
  --bg-soft:   oklch(0.977 0.011 248);   /* sehr helles Blaugrau */
  --bg-mint:   oklch(0.957 0.026 240);   /* helles Frischblau (Hero/Strips) */
  --bg-warm:   oklch(0.970 0.013 250);   /* kühl neutralisiert */

  /* --- Primärblau (Navy/Royal) — ersetzt Petrol --- */
  --petrol:        oklch(0.460 0.098 253);  /* ~ #335f93  Markenblau */
  --petrol-deep:   oklch(0.360 0.082 255);  /* dunkles Navy */
  --petrol-ink:    oklch(0.275 0.055 257);  /* Überschriften */

  /* --- Akzentblau (Azur) — ersetzt Teal-Grün --- */
  --teal:          oklch(0.545 0.118 250);  /* kräftiges Azur (AA-tauglich als Text) */
  --teal-soft:     oklch(0.780 0.085 240);  /* helles Himmelblau */
  --mint:          oklch(0.865 0.060 238);  /* zartes Blau (Aufzählungen) */

  /* --- Text & Linien leicht ins Blau gezogen --- */
  --ink:        oklch(0.272 0.022 252);
  --ink-soft:   oklch(0.462 0.022 250);
  --ink-faint:  oklch(0.515 0.020 248);
  --line:       oklch(0.900 0.013 246);
  --coral:      oklch(0.500 0.150 33);  /* dunkleres Koralle (AA) */
}

/* Kontrast-Feinschliff (WCAG AA) */
.utility-date { color: rgba(255,255,255,.86); }
.btn-coral { background: #a8331c !important; }
.btn-coral:hover { background: #8f2a15 !important; }

/* Statische OpenStreetMap-Karte (DSGVO-konform, lokal gehostet) */
.map-frame { position: relative; }
.map-frame .map-static { display: block; width: 100%; height: 100%; }
.map-frame .map-static img { width: 100%; height: 100%; object-fit: cover; display: block; }
.map-frame .map-route { position: absolute; right: 14px; bottom: 14px; background: #34598c; color: #fff; padding: 9px 16px; border-radius: 999px; font-weight: 700; font-size: 14px; box-shadow: 0 4px 14px rgba(20,40,70,.3); }
.map-frame .map-static:hover .map-route, .map-frame .map-static:focus-visible .map-route { background: #27496e; }
.map-frame .map-credit { position: absolute; left: 8px; bottom: 6px; font-size: 11px; color: #2b3a48; background: rgba(255,255,255,.82); padding: 1px 7px; border-radius: 5px; }
.map-frame .map-credit a { color: #1d4e89; }

/* Sprechzeiten-Karte (Startseite) + „nach Vereinbarung"-Badge */
.byappt { display:inline-block; font-size:11px; font-weight:700; color:#7a4d00; background:#fff3df; border-radius:999px; padding:1px 8px; white-space:nowrap; }
.hours-card .hc-title { display:flex; align-items:center; gap:9px; font-family:var(--serif); font-size:18px; color:var(--petrol-ink); margin:0 0 12px; }
.hours-card .hc-title svg { width:20px; height:20px; color:var(--teal); flex:none; }
.hours-card .hc-table { width:100%; border-collapse:collapse; }
.hours-card .hc-table td { padding:6px 0; font-size:14px; color:var(--ink-soft); vertical-align:top; border-bottom:1px solid var(--line); line-height:1.35; }
.hours-card .hc-table td:first-child { font-weight:700; color:var(--ink); width:48px; }
.hours-card .hc-table tr:last-child td { border-bottom:0; }
.hours-card .hc-table .closed { color:var(--ink-faint); }
.hours-card .hc-note { font-size:12px; color:var(--ink-faint); margin:10px 0 14px; }
.hours-card .btn { width:100%; justify-content:center; }
