/* r17-kontakt: Rückmeldung Lucas Fichter und Julia Ulrich 16.10.2026 („Website Rückmeldung.docx“). Zuständigkeit: LIESMICH-Hauptwebsite.md, Abschnitt 16.10.2026. */

/* ---------- K1  Kontakt: Sprungziel #formular ----------
   Der Kontaktknopf der Startseite führt auf /kontakt/#formular. html trägt
   schon scroll-padding-top (Kopfhöhe + 20 px); hier nur ein kleiner Zuschlag,
   damit die Kante der Formularkarte nicht am Kopf klebt. Gilt auch für
   #anmelden auf /after-work/. */
#formular, #anmelden { scroll-margin-top: 8px; }

/* ---------- K2  Kontakt: Anliegen und Patientenblock ---------- */
/* Fünf Anliegen mit langer Unterzeile: eine Spalte, sonst brechen die
   Wortlaute des Kunden in schmalen Kacheln mehrfach um. */
[data-seite="/kontakt/"] .z-wahl.k-anliegen.r17-anliegen { grid-template-columns: minmax(0, 1fr); }
[data-seite="/kontakt/"] .z-wahl.r17-anliegen label { min-height: 48px; }

.r17-patient {
  border: 0;
  margin: 0 0 var(--m6);
  padding: var(--m5);
  min-width: 0;
  border-radius: 12px;
  background: var(--karte-hell);
  border-left: 3px solid var(--gruen-dunkel);
}
.r17-patient[hidden] { display: none; }
.r17-patient legend {
  float: left; width: 100%;          /* Legende im Kasten statt auf dem Rahmen */
  margin: 0 0 var(--m3); padding: 0;
  font-size: .96rem; font-weight: 600; color: var(--tinte);
}
.r17-patient legend + * { clear: both; }
.r17-patient .formfeld { margin-bottom: var(--m4); }
/* kein Kasten im Kasten: der Block ist schon getönt */
.z-formkarte .r17-patient .formfeld-checkbox { margin-bottom: 0; padding: 0; background: none; font-size: .84rem; line-height: 1.5; }
@media (max-width: 760px) { .r17-patient { padding: var(--m4); } }
.r17-hinweis { margin: 0 0 var(--m4); font-size: .9rem; line-height: 1.5; color: var(--tinte); }

/* Pflichtstern im Patientenblock nur mit Skript: ohne Skript sind die Felder
   im Browser optional (der Handler verlangt sie nur bei Patientenanfrage). */
.r17-stern { display: none; }
.r17-aktiv .r17-stern { display: inline; }

/* ---------- K-AW  After Work: Termine und Anmeldung nebeneinander ----------
   Kundenwunsch 16.10.: das Formular direkt neben den nächsten Termin, am
   Handy direkt darunter. */
.r17-aw-grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(32px, 5vw, 72px);
  align-items: start;
}
.r17-aw-grid > * { min-width: 0; }
.r17-aw-links .abschnitt-kopf { margin-bottom: var(--m8); }
.r17-aw-links .aw-termine { grid-template-columns: minmax(0, 1fr); }
.r17-aw-links .aw-termin { max-width: 420px; }
@media (min-width: 901px) {
  .r17-aw-links { position: sticky; top: calc(var(--kopf-hoehe) + 24px); }
}
@media (max-width: 900px) {
  .r17-aw-grid { grid-template-columns: minmax(0, 1fr); gap: var(--m8); }
  .r17-aw-links .aw-termin { max-width: none; }
}

/* „Schön, wenn Sie dabei sind“: kurzer Abschluss, Knöpfe umbrechen am Handy */
.r17-aw-dabei-kopf { max-width: 760px; }
.r17-aw-dabei .aw-telefon { display: flex; flex-wrap: wrap; gap: var(--m3); margin-top: var(--m6); }
.r17-aw-dabei .aw-telefon .btn svg { width: 16px; height: 16px; margin-right: 8px; }
@media (max-width: 520px) {
  .r17-aw-dabei .aw-telefon .btn { width: 100%; justify-content: center; }
}