/* Aufbau und Klassen aus assets/css/kontakt.css des Kids-Projekts,
   unveraendert uebernommen. Die Farben kommen ueber die Variablen aus
   der Themenschicht der Erwachsenensite. */
.hero h1 em{font-style:italic;color:var(--gold-main);font-weight:400}
.quick-tiles{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.quick-tile{display:flex;align-items:center;gap:13px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.18);border-radius:16px;padding:14px 20px;transition:all .25s;min-width:230px}
.quick-tile:hover{background:rgba(255,255,255,.15);border-color:var(--gold-main);transform:translateY(-3px)}
.qt-ic{width:42px;height:42px;border-radius:12px;background:var(--gold-main);display:flex;align-items:center;justify-content:center;font-size:19px;flex-shrink:0}
.qt-label{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-main)}
.qt-value{font-size:15.5px;font-weight:700;color:var(--white);line-height:1.3}
/* location cards */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.loc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:16px}
.loc-card h3{font-size:21px;margin:0}
.loc-kind{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;background:var(--gold-mid);color:var(--gold-deeptext);padding:4px 11px;border-radius:14px;white-space:nowrap;flex-shrink:0}
.loc-rows{display:flex;flex-direction:column;gap:2px}
.loc-item{display:grid;grid-template-columns:26px 1fr;gap:11px;padding:9px 0;border-bottom:1px solid var(--cream-border);align-items:start}
.loc-item:last-of-type{border-bottom:none}
.loc-item .li-ic{font-size:15px;line-height:1.5}
.loc-item b{display:block;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);margin-bottom:2px}
.loc-item span{font-size:13.5px;color:var(--text-mid);line-height:1.55;display:block}
.loc-item a{color:var(--cat-dark);font-weight:700}
.loc-card .btn{margin-top:16px;width:100%}
/* form */
.form-layout{display:grid;grid-template-columns:1.35fr .65fr;gap:24px;align-items:start}
.form-box{background:var(--white);border:1px solid var(--cream-border);border-radius:20px;padding:32px 30px}
.form-note{background:var(--gold-light);border:1px solid var(--gold-main);border-radius:14px;padding:14px 18px;font-size:13.5px;color:var(--gold-deeptext);margin-bottom:24px;display:flex;gap:10px;align-items:flex-start}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fgrid .span2{grid-column:1/-1}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:12.5px;font-weight:700;color:var(--green-deepest)}
.field label .req{color:var(--peach-dark)}
.field input,.field select,.field textarea{font-family:inherit;font-size:14px;color:var(--text-primary);background:var(--cream-bg);border:1.5px solid var(--cream-border);border-radius:12px;padding:11px 14px;min-height:46px;transition:all .2s;width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--cat-main);background:var(--white);box-shadow:0 0 0 3px rgba(92,138,60,.12)}
.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--peach-dark);background:#FDF3EE}
.err{font-size:12px;color:var(--peach-text);font-weight:600;display:none}
.field.invalid .err{display:block}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.consent{display:flex;gap:11px;align-items:flex-start;margin-top:20px;font-size:13px;color:var(--text-mid);line-height:1.55}
.consent input{width:20px;height:20px;min-height:20px;flex-shrink:0;margin-top:1px;accent-color:var(--green-main)}
.consent a{color:var(--cat-dark);font-weight:700;text-decoration:underline}
.consent.invalid{color:var(--peach-text)}
.form-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px}
.form-small{font-size:12.5px;color:var(--text-muted)}
.form-ok{display:none;background:var(--green-light);border:2px solid var(--green-main);border-radius:16px;padding:24px 26px;text-align:center}
.form-ok.show{display:block}
.form-ok b{display:block;font-family:'Playfair Display',serif;font-size:21px;color:var(--green-deepest);margin-bottom:6px}
.form-ok span{font-size:14px;color:var(--text-mid)}
/* side panel */
.side-card{background:var(--white);border:1px solid var(--cream-border);border-radius:18px;padding:24px 22px;margin-bottom:18px}
.side-card h3{font-size:17px;margin-bottom:14px}
.side-list{display:flex;flex-direction:column;gap:0}
.side-row{display:grid;grid-template-columns:24px 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--cream-border);align-items:start}
.side-row:last-child{border-bottom:none}
.side-row b{display:block;font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--text-muted);margin-bottom:2px}
.side-row span{font-size:13px;color:var(--text-mid);line-height:1.55;display:block}
.side-row a{color:var(--cat-dark);font-weight:700}
.quick-box{background:linear-gradient(135deg,var(--cat-light) 0%,var(--white) 55%);border:2px solid var(--cat-main);border-radius:20px;padding:26px 24px;position:relative;overflow:visible;box-shadow:0 14px 36px rgba(58,90,34,.14)}
.quick-badge{position:absolute;top:-14px;left:24px;background:var(--cat-main);color:var(--white);font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:5px 14px;border-radius:20px}
.quick-box h3{font-size:18px;margin-bottom:14px}
.qa-list{display:flex;flex-direction:column;gap:9px}
.qa-btn{display:flex;align-items:center;gap:10px;background:var(--white);border:1.5px solid var(--cream-border);border-radius:14px;padding:12px 15px;font-size:13.5px;font-weight:600;color:var(--green-deepest);min-height:48px;transition:all .22s}
.qa-btn:hover{border-color:var(--cat-main);background:var(--cat-light);transform:translateX(3px)}
/* small inline info row (not a full block) */
.info-row{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:20px;padding-top:16px;border-top:1px solid var(--cream-border)}
.info-item{display:inline-flex;align-items:baseline;gap:7px;font-size:12.5px;color:var(--text-muted);line-height:1.5}
.info-item .ic{font-size:13px}
.info-item b{color:var(--text-mid);font-weight:700}
/* maps */
.map-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.map-card{background:var(--white);border:1px solid var(--cream-border);border-radius:18px;overflow:hidden}
.map-card iframe{width:100%;height:280px;border:0;display:block;filter:saturate(.9)}
.map-cap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;flex-wrap:wrap}
.map-cap b{font-size:14.5px;color:var(--green-deepest)}
.map-cap span{font-size:12.5px;color:var(--text-muted);display:block}
.map-cap a{font-size:13px;font-weight:700;color:var(--cat-dark);white-space:nowrap}
@media(max-width:960px){
  .form-layout{grid-template-columns:1fr}
  .loc-grid,.map-grid{grid-template-columns:1fr}
}
@media(max-width:560px){.fgrid{grid-template-columns:1fr}}
@media(min-width:1280px){
  .hero{min-height:420px;display:flex;align-items:center;padding-top:40px;padding-bottom:36px}
  .hero > .wrap{width:100%}
}
@media(min-width:1600px){
  .hero{min-height:450px}
}

/* standort-abstand — Die Standortkarten standen ohne Innenabstand direkt
   an der Rahmenkante. */
.kontakt-page .loc-card{padding:24px 26px}
.kontakt-page .loc-rows{margin-top:14px}
.kontakt-page .loc-line{padding:10px 0}
.kontakt-page .loc-head{margin-bottom:14px;gap:12px}
.kontakt-page .info-col{display:flex;flex-direction:column;gap:20px}


/* kontakt-karten-abstand — Die Karten hatten keinen Innenabstand,
   der Text klebte an der Rahmenkante. */
.loc-card,.kontakt-card,.contact-card{padding:26px 28px}
.loc-card h3,.kontakt-card h3{margin-bottom:14px}
.loc-row,.loc-line{padding:10px 0}
.loc-card .btn{margin-top:16px}

/* Sehr schmale Geräte (320px): die Standortkarte wurde so breit wie ihr Inhalt.
   Die Regel muss hier stehen und nicht in site.css — diese Datei wird später
   geladen und würde eine dortige Regel überschreiben. */
@media(max-width:360px){
  .loc-card, .loc-card > *, .loc-head{min-width:0}
  .loc-kind{white-space:normal; font-size:10px; padding:3px 7px}
  .loc-grid{grid-template-columns:minmax(0,1fr)}
}



/* ══════════════════════════════════════════════════════════════
   /kontakt — Formular und Kontaktangaben.
   Aufbau und Formularklassen aus dem Kids-Projekt
   (assets/css/kontakt.css) übernommen; hier nur die Ergänzungen
   und die Farben der Erwachsenenseite.
   ══════════════════════════════════════════════════════════════ */

/* Der Fehlertext gehört zum Feld, nicht in eine eigene Zeile —
   sonst springt das Formular beim Prüfen. */
.err{font-size:12px;color:#A32D2D;font-weight:600;display:none}
.field.invalid .err{display:block}
.field.invalid input,.field.invalid select,.field.invalid textarea{
  border-color:#A32D2D;background:#FCEBEB}

/* Zustimmung nach DSGVO. Auf der Wix-Seite fehlt sie — ein Formular,
   das Gesundheitsangaben aufnimmt, darf ohne ausdrückliche Zustimmung
   nicht abgeschickt werden. */
.consent{display:flex;gap:11px;align-items:flex-start;margin-top:20px;
  font-size:13px;color:var(--text-mid);line-height:1.55}
.consent input{width:20px;height:20px;min-height:20px;flex-shrink:0;
  margin-top:1px;accent-color:var(--gold-main)}
.consent a{color:var(--cat-dark);font-weight:700;text-decoration:underline}
.consent.invalid{color:#A32D2D}

/* Kästen der rechten Spalte */
.info-col{display:flex;flex-direction:column;gap:20px}
.side-box{background:var(--white);border:1px solid var(--cream-border);
  border-radius:20px;padding:26px 24px}
.side-box h3{font-family:'Playfair Display',serif;font-size:18px;
  color:var(--green-deepest);margin-bottom:16px}
.k-zeile{display:grid;grid-template-columns:34px 1fr;gap:12px;
  padding:12px 0;border-bottom:1px solid var(--cream-border)}
.k-zeile:last-of-type{border-bottom:none}
.k-zeile i{font-style:normal;font-size:17px;line-height:1.3}
.k-zeile b{display:block;font-size:11px;font-weight:700;letter-spacing:.07em;
  text-transform:uppercase;color:var(--text-muted);margin-bottom:3px}
.k-zeile span{display:block;font-size:13.5px;color:var(--text-mid);
  line-height:1.55}
.k-zeile a{color:var(--cat-dark);font-weight:700}
.k-zeile a:hover{color:var(--gold-dark)}

.qa-list{display:flex;flex-direction:column;gap:9px}
.qa-btn{display:flex;align-items:center;gap:10px;background:var(--white);
  border:1.5px solid var(--cream-border);border-radius:14px;padding:12px 15px;
  font-size:13.5px;font-weight:600;color:var(--green-deepest);min-height:48px;
  transition:all .22s}
.qa-btn:hover{border-color:var(--cat-main);background:var(--cat-light);
  transform:translateX(3px)}

/* Bestätigung nach dem Absenden */
.form-ok{display:none;background:var(--cat-light);
  border:2px solid var(--cat-main);border-radius:16px;padding:24px 26px;
  text-align:center}
.form-ok.show{display:block}
.form-ok b{display:block;font-family:'Playfair Display',serif;font-size:21px;
  color:var(--green-deepest);margin-bottom:6px}
.form-ok span{font-size:14px;color:var(--text-mid)}

/* Der Hinweis zu den Standorten: er entscheidet, ob jemand überhaupt
   den richtigen Ort anfragt, und steht deshalb über dem Formular. */
.form-note{background:var(--gold-light);border:1px solid var(--gold-main);
  color:var(--gold-deeptext)}

/* ══════════════════════════════════════════════════════════════
   Kleine Bildschirme
   ══════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
  .form-layout{grid-template-columns:1fr}
  /* Die Kontaktangaben zuerst: wer schnell anrufen will, soll nicht
     an einem Formular vorbeiscrollen müssen. */
  .info-col{order:-1;display:grid;grid-template-columns:1fr 1fr;gap:20px;
    align-items:start}
}
@media(max-width:700px){
  .info-col{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr}
  .form-box{padding:24px 20px}
  .form-actions .btn{width:100%}
}

/* ── Plakette in der Standortkarte ───────────────────────────────────── */
/* „Headquarter" beziehungsweise „Standort" — sie sass in der ersten
   Fassung der Karte und kommt hier zurueck, jetzt im gemeinsamen
   Baustein `.location-card`. */
.loc-top{display:flex;align-items:flex-start;gap:14px}
.loc-kind{margin-left:auto;flex-shrink:0;background:var(--cat-light);
  border:1px solid var(--cat-mid);color:var(--cat-dark);font-size:10.5px;
  font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  padding:5px 12px;border-radius:14px;white-space:nowrap}
@media(max-width:520px){
  .loc-top{flex-wrap:wrap}
  .loc-kind{margin-left:0;order:3}
}