/* ==========================================================================
   Hausstil: zentrale Stelle fuer Schrift und Akzentfarbe
   Liegt auf allen 21 Seiten und wird als letzte Datei geladen, damit die
   Werte hier gelten. Aenderungen also nur hier, nicht in den Einzelseiten.
   ========================================================================== */

:root {
  /* Der kursive Teil in Ueberschriften. Gemessen gegen den Seitenton
     #F8F5EE: 5,08 zu 1, das genuegt der strengsten Stufe fuer grosse
     Schrift. Gegen das Schwarz der Ueberschrift 3,02 zu 1, dadurch ist der
     Unterschied deutlich sichtbar, ohne dass es bunt wirkt. */
  --forest-akzent: #3F7355;
}

/* --------------------------------------------------------------------------
   Kursiv in Ueberschriften: bekommt den Akzentton.
   Ausgenommen bleiben die Stellen auf dunklem Grund, dort steht Gold.
   -------------------------------------------------------------------------- */
.hero h1 em,
.section-title em,
.about-content h2 em,
.termin-phase-title em,
.termin-success h3 em,
.rezept-inline-title em,
.karriere-content h2 em,
.standort-hero h1 em,
.standort-section h2 em,
.leistung-hero h1 em,
.gt-section h2 em,
.dgr-section h2 em,
.notfall h2 em,
.services h2 em,
.team h2 em,
.ts-section h2 em,
.standorte h2 em,
.rezept h2 em,
.termin h2 em {
  color: var(--forest-akzent);
  font-style: italic;
}

/* --------------------------------------------------------------------------
   Einheitliche Achsen der Hausschrift

   Fraunces ist eine variable Schrift. Wer sie nutzt, ohne die Achsen zu
   setzen, bekommt die Werkseinstellung (Textgrad statt Anzeigengrad). Auf
   der Startseite betraf das 147 Elemente: Menuekacheln, Modulueberschriften,
   Zahlen in den Widgets. Sie standen dadurch sichtbar anders da als die
   Ueberschriften. Diese Zeile zieht alles auf denselben Stand.
   -------------------------------------------------------------------------- */
*,
*::before,
*::after {
  font-variation-settings: "opsz" 144, "SOFT" 50;
}

/* --------------------------------------------------------------------------
   Staerke in den Modulen

   Die Ueberschrift der Startseite steht auf Stufe 600. Zahlen und Titel in
   den Modulen standen auf 300, der duennsten Stufe der Schrift. Bei einer
   52 Pixel grossen Uhrzeit wirkt das ausgezehrt und wie eine fremde Schrift.
   Eine Stufe kraeftiger, dann passt es zum Rest.
   -------------------------------------------------------------------------- */
.live-widget .live-time,
.live-widget .live-time span,
.live-widget .live-time-colon,
.live-time, .live-time span, .live-time-colon,
.live-widget .live-next strong,
.live-next strong,
.dgr-agg-num,
.mega-reviews-num,
.mega-notfall-number,
.countdown-value {
  font-weight: 500;
}

/* Modulueberschriften: nicht duenner als der Fliesstext daneben */
.gt-karte-titel,
.dgr-title,
.pm-ovl-title,
.standort-overlay-name,
.termin-location-name,
.notfall-pharmacy-overlay-row-name,
.mega-tile-title,
.mega-card-title,
.mega-leistung-title,
.mega-job-title {
  font-weight: 500;
}

/* --------------------------------------------------------------------------
   Akzentfarbe durchsetzen

   Die Regeln der Einzelseiten sind teils enger gefasst als die obige Liste
   und haben sie geschlagen. Auf den Standort- und Leistungsseiten stand der
   kursive Teil der Hauptueberschrift dadurch in Gold auf hellem Grund, das
   sind nur rund 2,5 zu 1 und damit schlecht lesbar. Diese Datei ist die
   zentrale Stelle fuer den Hausstil, deshalb setzt sie sich hier bewusst
   durch.
   -------------------------------------------------------------------------- */
h1 em,
h2 em,
h3 em,
h4 em {
  color: var(--forest-akzent) !important;
  font-style: italic;
}

/* Ausnahme: auf dunklem Grund bleibt es golden, dort waere Gruen zu dunkel */
.rezept-side h3 em,
.modal-side h3 em,
.karriere-visual-inner h3 em,
.notfall-dark em,
[class*="-dark"] h2 em,
[class*="-dark"] h3 em {
  color: var(--gold-soft, #C9AD77) !important;
}

/* ==========================================================================
   Nachbesserungen aus der Pruefung vom 13.08.2026
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Titelbereich der Standortseiten wurde beim ersten Besuch weichgezeichnet

   consent-banner.css legt einen Weichzeichner ueber main, footer, header,
   topbar und nav, solange der Datenschutzhinweis offen steht. Die
   Standortseiten packen ihre Hauptueberschrift in <header class="head-band">,
   dadurch war "Hausarzt in Soemmerda" beim ersten Besuch unscharf und nicht
   anklickbar. Auf der Startseite passiert das nicht, weil ihr Titelbereich
   kein header ist. Der Titel gehoert zum Inhalt, nicht zur Seitenkopfleiste.
   -------------------------------------------------------------------------- */
.rc-blur-active header.head-band,
.rc-blur-active .head-band {
  filter: none !important;
  pointer-events: auto !important;
}

/* --------------------------------------------------------------------------
   2. Vorzeilen der Standortseiten waren zu schwach

   .block-eyebrow stand in Gold #A88948 auf hellem Grund, gemessen 3,0 zu 1.
   Die Startseite nutzt an derselben Stelle .section-eyebrow in Waldgruen mit
   9,0 zu 1. Jetzt beide gleich.
   -------------------------------------------------------------------------- */
.block-eyebrow {
  color: var(--forest, #2A4A38);
}

/* --------------------------------------------------------------------------
   3. Fliesstext der Standortseiten war kleiner und blasser

   Gemessen 14,5px in #676E68 (4,8 zu 1) gegen 15,5 bis 18px in #2C332E
   (11,9 zu 1) auf der Startseite. Bei einer Arztpraxis ist Lesbarkeit kein
   Geschmack, sondern Anforderung.
   -------------------------------------------------------------------------- */
.standort-seite p,
.head-band p,
.zeiten-karte p,
.stblock p,
.block-text p {
  font-size: 16px;
  color: var(--text, #2C332E);
}

/* --------------------------------------------------------------------------
   4. Grosse Ueberschrift der Startseite hielt am alten Gruen fest

   depth-shadows.css Zeile 22 setzt .hero h1 em auf #2A4A38 mit !important.
   Diese Regel ist enger gefasst und schlaegt die allgemeine. Hier wird sie
   gezielt aufgehoben, damit der kursive Teil ueberall dieselbe Farbe hat.
   Die Ueberschrift selbst bleibt im dunklen Ton, nur der kursive Teil nicht.
   -------------------------------------------------------------------------- */
section.hero h1 em,
.hero h1 em,
html body .hero h1 em {
  color: var(--forest-akzent) !important;
}

/* --------------------------------------------------------------------------
   5. Wortmarke stand in zwei verschiedenen Gruentoenen
   -------------------------------------------------------------------------- */
.logo {
  color: var(--forest, #2A4A38);
}

/* --------------------------------------------------------------------------
   6. Drei Bedienelemente hatten keine Rueckmeldung beim Ueberfahren

   Gefunden ueber alle Seiten: der Logo-Link in der Kopfleiste, die
   Standortreiter im Sprechzeiten-Widget und der Knopf "Weiter zur Arztwahl".
   Nur fuer echte Zeigegeraete, auf Tippgeraeten bleibt ein Hover sonst
   kleben.
   -------------------------------------------------------------------------- */
@media (hover: hover) and (pointer: fine) {
  .logo {
    transition: opacity 0.25s ease, transform 0.25s ease;
  }
  .logo:hover {
    opacity: 0.72;
    transform: translateY(-1px);
  }

  .location-tab {
    transition: background 0.25s ease, color 0.25s ease;
  }
  .location-tab:not(.active):hover {
    background: rgba(42, 74, 56, 0.09);
    color: var(--forest, #2A4A38);
  }

  .termin-btn-next {
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
  }
  .termin-btn-next:hover {
    background: var(--forest-mist, #3D5D4A);
    transform: translateY(-1px);
    box-shadow: 0 10px 24px rgba(42, 74, 56, 0.26);
  }
}

/* ==========================================================================
   Fussbereich: auf allen Seiten derselbe

   Die Formatierung lag bisher verstreut in index.html, legal-chrome.css,
   standort.css und notfall-uebernahme.css. Dadurch sah der Fussbereich je
   nach Seite anders aus. Hier steht sie einmal zentral.

   Bewusst NICHT uebernommen: die Einblende-Regel footer .footer-col
   {opacity: 0}. Sie gehoert zu einem Beobachter, der nur auf der Startseite
   laeuft. Auf allen anderen Seiten bliebe der Fussbereich sonst dauerhaft
   unsichtbar.
   ========================================================================== */
footer {
  background: var(--forest-ink, #1C3125);
  color: var(--cream, #F8F5EE);
  padding: 64px 48px 28px;
  position: relative;
  overflow: hidden;
}

footer .footer-grid {
  max-width: 1280px;
  margin: 0 auto 13px;
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
  gap: 40px;
  position: relative;
  z-index: 1;
}

footer .footer-brand p {
  font-size: 14px;
  line-height: 1.7;
  color: rgba(248, 245, 238, 0.55);
  max-width: 340px;
  margin: 0 0 26px;
}

footer .footer-brand h4 {
  font-family: Fraunces, Georgia, serif;
  font-size: 22px;
  font-weight: 500;
  color: var(--cream, #F8F5EE);
  margin: 0 0 12px;
}

footer .footer-col h5 {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-soft, #C9AD77);
  /* B6 (15.08.2026): volle margin-Kurzform statt nur margin-bottom.
     Impressum und Datenschutz haben keinen globalen margin-Reset, dort
     bluteten Browser-Vorgaben und Seitenstile in den Fussbereich und
     machten die Spalten hoeher als auf den uebrigen Seiten. */
  margin: 0 0 14px;
  line-height: 1.4;
}

footer .footer-col ul { list-style: none; margin: 0; padding: 0; }
footer .footer-col li { margin: 0 0 2px; line-height: 20px; }

footer .footer-col a {
  color: rgba(248, 245, 238, 0.55);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.4s ease, padding-left 0.4s ease;
}
footer .footer-col a:hover { color: var(--cream, #F8F5EE); padding-left: 6px; }

footer .footer-loc-addr p {
  font-size: 14px;
  color: rgba(248, 245, 238, 0.55);
  line-height: 20px;
  margin: 0 0 2px;
  max-width: none;
}
footer .footer-loc-addr a {
  color: rgba(248, 245, 238, 0.55);
  text-decoration: none;
  transition: color 0.4s ease;
}
footer .footer-loc-addr a:hover { color: var(--cream, #F8F5EE); }

footer .footer-bottom {
  max-width: 1280px;
  margin: 0 auto;
  padding-top: 20px;
  border-top: 1px solid rgba(248, 245, 238, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  position: relative;
  z-index: 1;
}

footer .footer-bottom p {
  font-size: 13px;
  color: rgba(248, 245, 238, 0.45);
  opacity: 1;
}

/* Sicherheitsnetz: der Fussbereich bleibt sichtbar, auch wenn der
   Einblende-Beobachter der Startseite auf einer Seite nicht laeuft */
footer .footer-col,
footer .footer-bottom > *,
footer .footer-brand { opacity: 1; }

@media (max-width: 1039px) {
  footer .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}

@media (max-width: 768px) {
  footer { padding: 48px 20px 24px; }
  footer .footer-grid { grid-template-columns: 1fr; gap: 28px; }
}

/* Vorrang gegen legal-chrome.css, standort.css und notfall-uebernahme.css.
   Sie setzen eigene Polster am Fussbereich und liessen ihn je nach Seite
   319 bis 361 Pixel hoch werden. */
html body footer {
  padding: 64px 48px 28px;
  background: var(--forest-ink, #1C3125);
}
html body footer .footer-grid {
  max-width: 1280px;
  grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
  gap: 40px;
  margin: 0 auto 13px;
}
html body footer .footer-bottom {
  padding-top: 20px;
  gap: 20px;
}
html body footer .footer-brand p { margin-bottom: 26px; }

@media (max-width: 1039px) {
  html body footer .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 768px) {
  html body footer { padding: 48px 20px 24px; }
  html body footer .footer-grid { grid-template-columns: 1fr; gap: 28px; }
}

/* Die goldene Pille um die Copyright-Zeile stand nur in index.html und
   legal-chrome.css. Dadurch war der Fussbereich dort 19 Pixel hoeher als
   auf den Standort- und Leistungsseiten. Jetzt ueberall gleich. */
html body footer .footer-bottom p:last-child {
  color: var(--gold-soft, #C9AD77);
  font-style: italic;
  font-family: Fraunces, Georgia, serif;
  text-align: center;
  padding: 10px 28px;
  border-radius: 100px;
  background: rgba(248, 245, 238, 0.04);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3),
              inset 0 0 0 1px rgba(201, 173, 119, 0.2);
  margin: 0;
}

/* Zeilenabstand der Spalten: auf den Rechtstexten stand er hoeher,
   dadurch war das Raster dort 21 Pixel tiefer. */
html body footer .footer-col li {
  margin-bottom: 2px;
  line-height: 20px;
  font-size: 14px;
}
html body footer .footer-col a { font-size: 14px; line-height: 20px; }
html body footer .footer-loc-addr p {
  font-size: 14px;
  line-height: 20px;
  margin: 0 0 2px;
}
html body footer .footer-brand h4 { font-size: 22px; margin-bottom: 12px; line-height: 1.3; }

/* legal-chrome.css setzt die Verweise im Fussbereich auf inline-block.
   Dadurch rechnet der Browser die Zeilen anders und das Raster wurde auf
   Impressum, Datenschutz und Barrierefreiheit 21 Pixel tiefer. */
html body footer .footer-col a {
  display: inline;
  line-height: 20px;
}