/* Kontaktseite (Seitensitzung Kontaktseite, 02.11.2026).
   Kopf, Knöpfe, Fußleiste und Grundwerte aus unterseiten-basis.css (erzeugt aus startseite.html),
   Seitenkopf, Personenzeile und aktuelle Seite aus unterseiten.css. Hier nur, was die Kontaktseite allein hat. */

/* Kopf: Text links, rechts die Karte zum Anrufen mit Live-Status und Tagesleiste */
.seitenkopf--kontakt h1{max-width:14ch}
/* Karte und Textspalte gleich hoch: Oberkante auf der Überzeile, Unterkante auf der Personenzeile */
.seitenkopf--kontakt .innen{align-items:stretch}
.anruf{display:flex;flex-direction:column;padding:clamp(26px,2.8vw,40px);background:#fff;border:1px solid var(--linie);border-radius:24px}
.anruf h2{font-size:1.625rem;line-height:1.15;letter-spacing:-.015em}
.anruf .status{margin-top:16px;font-size:14px;white-space:normal}
.anruf__nummer{display:block;width:fit-content;margin-top:12px;padding-bottom:4px;border-bottom:2px solid var(--p700);font:400 clamp(2.375rem,1.9rem + 1vw,2.75rem)/1.1 "Familjen Grotesk",system-ui,sans-serif;letter-spacing:-.035em;color:var(--tinte);text-decoration:none;white-space:nowrap}
.anruf__nummer:hover{border-bottom-color:transparent}
.anruf__nummer:focus-visible{outline:2px solid var(--p600);outline-offset:4px;border-radius:4px}
.anruf__zeiten{margin:24px 0 18px;padding-top:20px;border-top:1px solid var(--linie);font-size:1rem;line-height:1.55;color:var(--text)}
.anruf__zeiten b{display:block;margin-bottom:2px;font-weight:600;color:var(--tinte)}
.anruf .tagesleiste{max-width:350px;margin-top:auto}

/* Lage: Anschrift und Route links, rechts die Lagekarte (eigene Grafik aus OpenStreetMap-Daten) */
.lage{padding-block:clamp(56px,7vw,104px);border-top:1px solid var(--linie)}
.lage .innen{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(24px,4vw,72px);align-items:center}
.lage h2{max-width:12ch;text-wrap:balance}
.lage address{margin-top:24px;font-style:normal;font-size:1.0625rem;line-height:1.6;color:var(--text)}
.lage address b{display:block;font-weight:600;color:var(--tinte)}
.lage__anfahrt{margin-top:12px;font-size:1.0625rem;line-height:1.6;color:var(--text);max-width:34em}
.lage .pfeillink{display:inline-block;margin-top:24px;color:var(--tinte)}
.lage__hinweis{margin-top:10px;font-size:.875rem;line-height:1.45;color:var(--leise)}
/* Karte rechts bis an den Fensterrand wie die Grafik im ersten Bildschirm; der Quellenhinweis bleibt im Raster */
.lage__karte{--bis-rand:calc(max(0px, (100vw - var(--breit)) / 2) + var(--rand));margin:0 calc(-1 * var(--bis-rand)) 0 0;min-width:0}
.lage__karte .lk{max-width:900px}
.lage__karte figcaption{margin:4px var(--bis-rand) 0 0;font-size:.8125rem;line-height:1.4;color:var(--leise);text-align:right}
.lage__karte figcaption a{color:inherit;text-underline-offset:2px}

/* Formular „Mandant werden“ (Stil in kontakt-formular.css, erzeugt aus kontakt.html): gleiche Haarlinie wie über der
   Lage, Schrittüberschrift und Fehlerliste nicht unter dem Kopf (scroll-padding wie in kontakt.html) */
html{scroll-padding-top:96px}
.kt{border-top:1px solid var(--linie)}

/* Schlanker Fuß: nur der Sockel, die Linie oben trägt der Fuß selbst */
.fuss1--schlank .fuss1__sockel .innen::before{display:none}
.fuss1--schlank .fuss1__sockel .innen{padding-top:56px}

/* Tablet und Handy */
/* Unter 1100 px steht die Karte unter der Anschrift, sonst würden die Straßennamen zu klein */
@media (max-width:1100px){
  .lage .innen{grid-template-columns:1fr;gap:28px}
  .lage h2{max-width:none}
  .lage__karte{margin-inline:calc(-1 * var(--rand))}
  .lage__karte .lk{max-width:820px;margin-inline:auto}
  .lage__karte figcaption{margin:4px var(--rand) 0}
}
@media (max-width:900px){
  .anruf{width:100%;max-width:560px}
  .fuss1--schlank .fuss1__sockel .innen{padding-top:44px}
}
@media (max-width:560px){
  .anruf{padding:24px 20px}
  .anruf__nummer{font-size:2.375rem}
}