/* =====================================================================
   Design v2 – Rahmen (Kopf, Brotkrumen, Fuß, Menü, Aktionsleiste)
   Ergänzt css/v2/system.css; funktioniert auch neben dem bisherigen CSS (Laravel-Seiten, Rechner),
   deshalb eigene Grundwerte und Zurücksetzungen innerhalb der Rahmen-Bausteine.
   ===================================================================== */

.v2-kopf, .v2-brotkrumen, .v2-fuss, .v2-menue, .v2-aktionsleiste {
  font-family: var(--font); color: var(--c-text); font-size: var(--fs-text); line-height: var(--lh-text);
  -webkit-font-smoothing: antialiased; box-sizing: border-box;
}
.v2-kopf *, .v2-brotkrumen *, .v2-fuss *, .v2-menue *, .v2-aktionsleiste * { box-sizing: border-box; }
.v2-kopf ul, .v2-fuss ul, .v2-menue ul { list-style: none; margin: 0; padding: 0; }
.v2-kopf a, .v2-fuss a, .v2-menue a, .v2-brotkrumen a { text-decoration: none; }
.v2-icon-btn svg, .v2-btn svg { width: 24px; height: 24px; flex: none; }
.v2-btn { font-family: var(--font); font-weight: 600; border-radius: var(--radius-pill); border-width: 2px; border-style: solid; text-decoration: none; line-height: 1.2; }  /* Randfarbe aus system.css (Varianten) */
.v2-btn:hover, .v2-btn:focus { text-decoration: none; }
.v2-icon-btn svg { width: 24px; height: 24px; }

/* ---------- Kopf (Raster-Überarbeitung 04.10.2026; Messung 14_design/werkzeuge/kopf_messen.mjs, kanten.mjs) ----------
   Eine gemeinsame linke Kante: Servicezeile, Kopf, Brotkrumen, Inhalt und Fuß stehen im selben Container (--breite).
   Handy/Tablet < 64rem: Logo · Telefon · Anmelden · Menü-Knopf; Hauptknopf und Hilfe in der Aktionsleiste unten.
   Ab 64rem: Servicezeile (Telefon, E-Mail, Unternehmen, Kontakt) über dem Kopf.
   Kompakt 64–75.99rem: Logo · Anmelden · „Elterngeld berechnen“ · Menü-Knopf (Menü als Seitenleiste).
   Voll ab 76rem: Logo · Navigation · Anmelden · „Elterngeld berechnen“.
   Passt die volle Navigation trotzdem nicht (z. B. langer Name im Konto-Menü, englische Texte, andere Schrift),
   schaltet js/v2/kopf.js auf kompakt. E-Mail und „Registrieren“ stehen zusätzlich im Menü und im Fuß. */
.v2-kopf { position: sticky; top: 0; }
/* Handy/Tablet (< 64rem), Inhaber 09.10.2026: Kopf als schwebende Karte wie auf der bisherigen Seite (Abstand zum Rand, Rundung, Schatten)
   statt eines Streifens an der Decke */
@media (max-width: 63.99rem) {
  .v2-kopf { top: 10px; margin: 10px 10px 0; border: 0; border-radius: 10px; background: rgba(255,255,255,.98); box-shadow: 0 2px 12px rgba(0,0,0,.16); }
}
.v2-kopf__logo picture { display: block; }
.v2-kopf__logo img, .v2-kopf__logo svg { height: 44px !important; width: auto !important; max-width: none !important; display: block; }
.v2-kopf__kontakt-text { display: none; }
.v2-kopf__kontakt--mail { display: none; }
.v2-kopf__konto { display: flex; align-items: center; gap: var(--s-1); }
.v2-kopf__konto > li > a { display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--s-3); border-radius: var(--radius-pill); color: var(--c-text); font-weight: 600; font-size: .9375rem; }
.v2-kopf__konto > li > a:hover { background: var(--ee-grau-100); color: var(--ee-rot); }
.v2-kopf__konto .hidden-xs { display: inline !important; }
.v2-kopf__konto > li.person { display: none; }
.v2-kopf__konto .dropdown { position: relative; }
.v2-kopf__konto .dropdown-menu { position: absolute; right: 0; top: 100%; min-width: 14rem; background: #fff; border: 1px solid var(--c-linie); border-radius: var(--radius); box-shadow: var(--schatten-hoch); padding: var(--s-2) 0; display: none; z-index: 70; }
.v2-kopf__konto .dropdown.open .dropdown-menu, .v2-kopf__konto .dropdown:focus-within .dropdown-menu { display: block; }
.v2-kopf__konto .dropdown-menu a { display: block; padding: var(--s-2) var(--s-4); min-height: 44px; color: var(--c-text); }
.v2-kopf__konto .dropdown-menu a:hover { background: var(--ee-grau-100); color: var(--ee-rot); }
.v2-kopf__konto .dropdown-toggle .hidden-xs { display: inline-block !important; max-width: 14rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* Servicezeile: erstes Element im Kopf nach dem Sprunglink. Der Kopf klebt um ihre Höhe nach oben versetzt –
   beim Scrollen gleitet nur die Servicezeile weg, die Hauptzeile bleibt stehen (Sprunglink bleibt erstes Element). */
.v2-servicezeile { display: none; }
@media (min-width: 64rem) {
  .v2-kopf { top: -37px; }
  .v2-servicezeile { display: block; height: 37px; background: var(--ee-grau-100); border-bottom: 1px solid var(--c-linie); font-family: var(--font); font-size: .875rem; line-height: 1.4; -webkit-font-smoothing: antialiased; }
  .v2-servicezeile ul { list-style: none; margin: 0; padding: 0; display: flex; justify-content: flex-end; align-items: center; gap: 0 var(--s-5); min-height: 36px; }
  .v2-servicezeile li { margin: 0; }
  .v2-servicezeile a { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; color: var(--c-text-2); text-decoration: none; white-space: nowrap; }
  .v2-servicezeile a:hover, .v2-servicezeile a[aria-current] { color: var(--ee-rot); }
  .v2-servicezeile svg { width: 16px; height: 16px; flex: none; }
}

/* Stufen. Menü-Knopf (Burger) auf dem Handy oben rechts im Kopf (Seitenkonzept SK-2, Anmerkung Inhaber 05.10.2026);
   die Aktionsleiste unten behält Hauptknopf und Hilfe. */
.v2-kopf__nav, .v2-kopf__cta, .v2-kopf__kontakt--mail, .v2-kopf__konto > li.person { display: none !important; }
.v2-kopf__menue { display: inline-grid; flex: none; }
.v2-kopf .v2-kopf__aktionen .v2-kopf__kontakt--tel { display: inline-grid; }
@media (max-width: 63.99rem) { body.v2-rahmen { padding-bottom: 0; } }   /* Aktionsleiste unten entfällt (09.10.2026), nur noch die schwebende Hilfe-Kugel */
@media (min-width: 64rem) {
  .v2-kopf { --kopf-h: 72px; }
  .v2-kopf__innen { height: 72px; gap: var(--s-2); }
  .v2-kopf .v2-kopf__aktionen .v2-kopf__kontakt--tel { display: none !important; }   /* steht in der Servicezeile */
  .v2-kopf__cta { display: inline-flex !important; margin-left: var(--s-2); }
  .v2-kopf__menue { display: inline-grid !important; }
  .v2-rahmen .v2-aktionsleiste, .v2-aktionsleiste { display: none !important; }
  body.v2-seite:has(.v2-aktionsleiste) { padding-bottom: 0; }
  /* Menü als Seitenleiste rechts statt Bottom-Sheet */
  .v2-menue { inset: 0 0 0 auto; margin: 0 0 0 auto; width: min(26rem, 100%); height: 100dvh; max-height: 100dvh; border-radius: 0; box-shadow: var(--schatten-hoch); }
}
@media (min-width: 76rem) {
  .v2-kopf:not(.v2-kopf--kompakt) .v2-kopf__nav { display: block !important; margin-left: var(--s-6); margin-right: auto; min-width: 0; }
  .v2-kopf:not(.v2-kopf--kompakt) .v2-kopf__aktionen { margin-left: 0; }
  .v2-kopf:not(.v2-kopf--kompakt) .v2-kopf__menue { display: none !important; }
}

/* Hauptnavigation: ruhig, aktueller Bereich mit roter Linie */
.v2-kopf__nav > ul { display: flex; align-items: center; gap: 0; position: relative; }
.v2-kopf__nav > ul > li { position: static; }
.v2-kopf__nav > ul > li > a, .v2-kopf__gruppe { position: relative; display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 10px; color: var(--c-text); font-weight: 600; font-size: .9375rem;
  border-radius: var(--radius-s); cursor: pointer; white-space: nowrap; text-decoration: none; background: none; }
.v2-kopf__nav > ul > li > a:hover, .v2-kopf__gruppe:hover, .v2-hat-unter:hover > a, .v2-hat-unter:hover > .v2-kopf__gruppe { color: var(--ee-rot); background: var(--ee-grau-100); }
.v2-hat-unter > a::after, .v2-hat-unter > .v2-kopf__gruppe::after { content: ""; width: 7px; height: 7px; margin-left: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.v2-kopf__nav > ul > li.v2-aktiv > a, .v2-kopf__nav > ul > li.v2-aktiv > .v2-kopf__gruppe { color: var(--ee-rot); }
.v2-kopf__nav > ul > li.v2-aktiv > a::before, .v2-kopf__nav > ul > li.v2-aktiv > .v2-kopf__gruppe::before {
  content: ""; position: absolute; left: 10px; right: 10px; bottom: 4px; height: 2px; border-radius: 2px; background: var(--ee-rot); }
.v2-hat-unter.v2-aktiv > a::before, .v2-hat-unter.v2-aktiv > .v2-kopf__gruppe::before { right: 25px; }

/* Untermenü als Tafel mit Spalten (Spaltentitel = Eintrag mit Unterpunkten; einzelne Einträge in einer eigenen Spalte).
   Links bündig unter der Navigation, damit keine Tafel über den Rand ragt. */
.v2-kopf__unter { display: none; position: absolute; left: 0; top: calc(100% + 12px); z-index: 70; width: max-content; max-width: min(56rem, calc(100vw - 2 * var(--rand)));
  background: #fff; border: 1px solid var(--c-linie); border-radius: var(--radius); box-shadow: var(--schatten-hoch); padding: var(--s-5) var(--s-6);
  grid-auto-flow: column; grid-auto-columns: minmax(12rem, 15rem); gap: var(--s-6); }
.v2-kopf__unter::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }  /* Hover-Brücke */
.v2-hat-unter:hover > .v2-kopf__unter, .v2-hat-unter:focus-within > .v2-kopf__unter { display: grid; }
.v2-kopf__spalte { min-width: 0; }
.v2-kopf__spalte ul { list-style: none; margin: var(--s-2) 0 0; padding: 0; display: grid; gap: 2px; }
.v2-kopf__unter a { display: flex; align-items: center; min-height: 36px; padding: 0; color: var(--c-text-2); font-size: .9375rem; font-weight: 400; line-height: 1.3; text-decoration: none; white-space: normal; }
.v2-kopf__unter a:hover { color: var(--ee-rot); }
.v2-kopf__unter a.v2-kopf__unter-titel { color: var(--c-text); font-weight: 600; }
.v2-kopf__spalte > .v2-kopf__unter-titel { padding-bottom: var(--s-2); border-bottom: 1px solid var(--c-linie); }
.v2-kopf__spalte--einzeln { background: var(--ee-grau-100); border-radius: var(--radius-s); padding: var(--s-3) var(--s-4); margin: calc(-1 * var(--s-2)) 0; align-self: start; }
.v2-kopf__spalte--einzeln ul { margin: 0; }
.v2-kopf__spalte--einzeln a.v2-kopf__unter-titel::after { content: "→"; margin-left: auto; padding-left: var(--s-3); color: var(--ee-rot); font-weight: 400; }

/* Konto-Bereich im Menü */
.v2-menue__konto { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); margin-top: var(--s-5); }
.v2-menue__konto .v2-btn { width: 100%; }
.v2-menue__konto .v2-btn:only-child { grid-column: 1 / -1; }

/* ---------- Brotkrumen ---------- */
.v2-brotkrumen { padding-block: var(--s-3); font-size: var(--fs-klein); color: var(--c-text-2); overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.v2-brotkrumen::-webkit-scrollbar { display: none; }
.v2-brotkrumen .by-breadcrumb { position: static; background: none; padding: 0; margin: 0; color: inherit; font-size: inherit; }
.v2-brotkrumen a { color: var(--c-text-2); display: inline-flex; align-items: center; min-height: 32px; }
.v2-brotkrumen a:hover { color: var(--ee-rot); }
.v2-brotkrumen .current-page { color: var(--c-text); }

/* ---------- Fuß ---------- */
.v2-fuss { background: var(--ee-grau-100); border-top: 1px solid var(--c-linie); padding-block: var(--s-7) var(--s-6); margin-top: var(--abschnitt); font-size: .9375rem; }
.v2-fuss__raster { display: grid; gap: var(--s-6); grid-template-columns: 1fr; }
@media (min-width: 40rem) { .v2-fuss__raster { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 64rem) { .v2-fuss__raster { grid-template-columns: repeat(4, 1fr); } }
.v2-fuss__titel { font-weight: 600; margin: 0 0 var(--s-3); font-size: 1rem; color: var(--c-text); }
.v2-fuss li a, .v2-fuss__recht a { display: inline-flex; align-items: center; min-height: 40px; color: var(--c-text-2); }
.v2-fuss a:hover { color: var(--ee-rot); }
.v2-fuss__bewertung { margin-top: var(--s-4); color: var(--c-text-2); font-size: var(--fs-klein); }
.v2-fuss__siegel { margin-top: var(--s-4); }
.v2-fuss__siegel img { width: 150px; height: auto; }
.v2-fuss__auszeichnungen { display: grid; gap: var(--s-5); margin-top: var(--s-7); padding-top: var(--s-6); border-top: 1px solid var(--c-linie); grid-template-columns: 1fr; color: var(--c-text-2); }
@media (min-width: 64rem) { .v2-fuss__auszeichnungen { grid-template-columns: repeat(3, 1fr); } }
.v2-fuss__box p { margin: 0 0 var(--s-2); }
.v2-fuss__logos { display: flex; flex-wrap: wrap; gap: var(--s-4); align-items: center; margin: var(--s-2) 0; }
.v2-fuss__logos img, .v2-fuss__foerderung img { height: auto; max-height: 72px; width: auto; max-width: 220px; }
/* Auszeichnungen im Fuß (09.10.2026): Familien-Logo und ProvenExpert-Siegel gleich hoch */
.v2-fuss__auszeichnungen .v2-fuss__logos img { height: 100px; max-height: none; width: auto; max-width: 220px; }
.v2-fuss__auszeichnungen .v2-fuss__logos .v2-fuss__pe img { border-radius: 6px; }
.v2-fuss__unten { margin-top: var(--s-6); padding-top: var(--s-5); border-top: 1px solid var(--c-linie); display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); align-items: center; color: var(--c-text-2); font-size: var(--fs-klein); }
.v2-fuss__copy { margin: 0; flex-basis: 100%; }
.v2-fuss__recht { display: flex; flex-wrap: wrap; gap: 0 var(--s-4); }
.v2-fuss__recht a { color: var(--c-text-2); }
.v2-fuss__sprache ul, .v2-fuss__sprache li { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--s-2); }
.v2-fuss__sprache ul { gap: var(--s-4); }
.v2-fuss__sprache a { gap: var(--s-2); }
.v2-fuss__sprache a[aria-current] { color: var(--c-text); font-weight: 600; }
/* Sprachwahl (Fuß, Handy-Menü): kleine selbst gezeichnete Flaggen vor dem Sprachnamen (E1-1), Maße der Flagge 3:5 bzw. 1:2 */
.v2-rahmen .v2-flagge { flex: none; display: inline-block; width: 20px; height: 12px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.14); }
.v2-rahmen .v2-flagge--en { width: 24px; }
.v2-fuss .by-social-icons, .v2-fuss .social-icons { display: flex; gap: var(--s-2); }
.v2-fuss .v2-fuss__social { flex-wrap: wrap; gap: 0 var(--s-4); list-style: none; margin: 0; padding: 0; }
.v2-fuss .v2-fuss__social a { display: inline-flex; align-items: center; min-height: 44px; }

/* ---------- Handy-Menü (Bottom-Sheet) ---------- */
.v2-menue { position: fixed; inset: auto 0 0 0; }
/* Schließen-Knopf: beim Öffnen fokussiert – ruhiger Fokusring statt dickem schwarzem Kreis, nicht am Rand abgeschnitten */
.v2-menue__kopf { padding: var(--s-3) var(--s-3) var(--s-3) var(--s-4) !important; }
.v2-menue__kopf .v2-icon-btn:focus-visible { outline: 2px solid var(--ee-rot); outline-offset: -2px; box-shadow: none; }
.v2-menue__kopf .v2-icon-btn:focus:not(:focus-visible) { outline: none; box-shadow: none; }
/* Knöpfe im Menü: Text immer mittig (wie Anmelden/Registrieren) */
.v2-menue nav > a.v2-btn { justify-content: center; text-align: center; border-bottom-width: 2px; }
.v2-menue[open] { display: block; }
.v2-menue nav > a:not(.v2-btn) { border-bottom: 1px solid var(--c-linie); }
.v2-menue__tief a { padding-left: var(--s-6) !important; font-size: .9375rem; color: var(--c-text-2) !important; }
.v2-menue__btn { margin-top: var(--s-3); width: 100%; }
.v2-menue__recht { margin-top: var(--s-5); font-size: var(--fs-klein); color: var(--c-text-2); }
.v2-menue__recht a { color: var(--c-text-2); }

/* ---------- Aktionsleiste: Platz am Seitenende, auch auf Seiten mit bisherigem CSS ---------- */
.v2-aktionsleiste .v2-btn { color: #fff; }

/* ---------- Bisherige schwebende Elemente im neuen Rahmen aus ---------- */
.v2-rahmen #by-whatsapp, .v2-rahmen .by-whatsapp, .v2-rahmen .pe-siegel-statisch { display: none !important; }

/* ---------- Kollisionen mit dem bisherigen CSS ---------- */
body.v2-rahmen { padding-top: 0 !important; }                      /* Platz für den früheren festen Kopf */
.v2-kopf__konto a::before, .v2-kopf__kontakt::before { content: none !important; display: none !important; }
/* .v2-rahmen davor: stärker als die bisherige Knopf-Regel [type="button"]:not(.default):not(.close) */
.v2-rahmen .v2-kopf .v2-icon-btn, .v2-rahmen .v2-menue .v2-icon-btn, .v2-rahmen .v2-aktionsleiste .v2-icon-btn {
  background: #fff; color: var(--ee-text); border: 1px solid transparent; box-shadow: none; padding: 0; border-radius: var(--radius-pill); width: var(--tap); height: var(--tap); }
.v2-rahmen .v2-aktionsleiste .v2-icon-btn { border-color: var(--c-linie); }
.v2-rahmen .v2-aktionsleiste .v2-icon-btn { box-shadow: 0 4px 14px rgba(0,0,0,.2); }   /* schwebende Kugel: Schatten statt Leiste */
.v2-rahmen .v2-kopf .v2-icon-btn:hover, .v2-rahmen .v2-aktionsleiste .v2-icon-btn:hover { background: var(--ee-grau-100); color: var(--ee-rot); }
.v2-rahmen .v2-btn--primaer, .v2-rahmen .v2-btn--primaer:hover, .v2-rahmen .v2-btn--primaer:focus { color: #fff !important; }
.v2-rahmen .v2-btn--sekundaer, .v2-rahmen .v2-btn--sekundaer:hover { color: var(--ee-text); }   /* zweite Stufe (SK-8): Textfarbe statt Rot */
.v2-kopf__konto li::before, .v2-kopf__konto li::after, .v2-kopf__konto a > *::before { content: none !important; display: none !important; }
.v2-kopf__konto li { list-style: none; margin: 0; padding: 0; }

/* Grundschriftgröße: Bootstrap 3 setzt html auf 10px; das bisherige Theme stellte 16px ein. Neue CMS-Seiten laden das
   Theme nicht mehr → hier wie bisher 16px (rem-Werte des Designs beziehen sich darauf). */
html:has(body.v2-seite) { font-size: 16px; }

.v2-kopf__logo .referrer-logo { display: block; }
.v2-kopf__logo .referrer-logo img, .v2-kopf__logo .referrer-logo svg { height: 44px !important; width: auto !important; }

/* Tap-Größen ≥ 44 px (Messung 04.10.2026: Fußlinks 40 px, Brotkrumen 32 px), Fußschrift 16 px */
.v2-fuss { font-size: 1rem; }
.v2-fuss li a, .v2-fuss__recht a, .v2-menue__recht a { min-height: 44px; }
.v2-brotkrumen a { min-height: 44px; }

/* Login-Fenster: „Daten merken“ – natives Kästchen (das alte CSS blendet es ein und zeichnet zusätzlich ein eigenes) */
.v2-rahmen #login-form__remember-wrapper { display: flex; align-items: center; gap: 10px; min-height: 44px; }
.v2-rahmen #login_remember { width: 22px; height: 22px; margin: 0; accent-color: var(--ee-rot); flex: none; }
.v2-rahmen #login_remember + label.for-checkbox { height: auto; margin: 0; padding: 0; cursor: pointer; }
.v2-rahmen #login_remember + label.for-checkbox::before, .v2-rahmen #login_remember + label.for-checkbox::after { content: none !important; display: none !important; }
/* DK-13 das Kästchen selbst war unsichtbar (ein zweites app.css des Rahmens blendet input[name=remember] aus) – nur „Daten
   merken“ stand da; zweiter Knopf ohne Bootstrap-Abstand links (untereinander auf dem Handy 5 px eingerückt) */
.v2-rahmen #login-form__remember-wrapper #login_remember { display: block; }
.v2-rahmen .modal-footer-login .btn + .btn { margin-left: 0; }

/* Kostenloser Elterngeldrechner im neuen Rahmen (Etappe E5): Fragen in Lesegröße statt sehr großer roter Überschriften
   (nur Gestaltung – Überschriften-Struktur und Texte unverändert; px, weil diese Seiten die 10px-Grundschrift behalten) */
body.v2-rahmen #form-container h2 { font-size: 26px; line-height: 1.25; color: var(--c-text); font-weight: 600; }
body.v2-rahmen #form-container .tile h4, body.v2-rahmen #form-container .tile h5 { font-size: 20px; line-height: 1.3; color: var(--c-text); font-weight: 600; margin-bottom: 8px; }
body.v2-rahmen #form-container .tile p, body.v2-rahmen #form-container .tile li { font-size: 16px; line-height: 1.55; }
@media (min-width: 64rem) { body.v2-rahmen #form-container .tile h4, body.v2-rahmen #form-container .tile h5 { font-size: 22px; } }

/* ---------- Nutzerführung (Prüfung 04.10.2026, EE/14_design/audit/nutzerfuehrung_2026-10-04.md; Skript js/v2/fuehrung.js) ---------- */
/* N-06 Handy-Menü: aktuelle Seite bzw. aktueller Bereich erkennbar, ihre Gruppe ist aufgeklappt */
.v2-menue nav a.v2-menue__hier:not(.v2-btn), .v2-menue nav a.v2-menue__bereich:not(.v2-btn) { color: var(--ee-rot) !important; border-left-color: var(--ee-rot) !important; }
.v2-menue nav > a.v2-menue__hier:not(.v2-btn) { box-shadow: inset 3px 0 0 var(--ee-rot); padding-left: var(--s-3); }
.v2-menue nav a.v2-menue__hier:not(.v2-btn) { font-weight: 600; }
.v2-menue details.v2-menue__gruppe--hier > summary { color: var(--ee-rot); }

/* N-11 „Nach oben“ auf langen Seiten: über der Aktionsleiste (Handy), unten rechts (Desktop) */
.v2-rahmen .v2-nachoben { position: fixed; right: var(--s-3); bottom: calc(76px + var(--s-3) + env(safe-area-inset-bottom)); z-index: 59; display: grid; place-items: center;
  width: var(--tap); height: var(--tap); padding: 0; margin: 0; border: 1px solid var(--c-linie); border-radius: 50%; background: #fff; color: var(--ee-text);
  box-shadow: var(--schatten-hoch); cursor: pointer; font: inherit; }
.v2-rahmen .v2-nachoben[hidden] { display: none; }
.v2-rahmen .v2-nachoben svg { width: 24px; height: 24px; }
.v2-rahmen .v2-nachoben:hover { color: var(--ee-rot); background: #fff; }
@media (min-width: 64rem) { .v2-rahmen .v2-nachoben { right: var(--s-5); bottom: var(--s-5); } }
@media print { .v2-rahmen .v2-nachoben { display: none !important; } }

/* N-03 Symbole der nicht geladenen Schrift „Material Symbols“ (Rechner): eigene Linien-Symbole statt Wörtern wie „info“ */
.v2-rahmen .v2-symbol { display: inline-flex; width: 1.25em; height: 1.25em; vertical-align: -.25em; font-size: inherit !important; overflow: visible; }
.v2-rahmen .v2-symbol svg { width: 100%; height: 100%; }
.v2-rahmen .v2-symbol--leer { display: none !important; }
/* N-04 Rechner: „Schritt 2 von 4“ mit Balken über der Schrittüberschrift (px: Rechnerseiten behalten die 10px-Grundschrift) */
body.v2-rahmen #form-container .v2-schrittanzeige { display: flex; align-items: center; gap: 12px; margin: 0 0 8px; font-size: 14px; font-weight: 600; color: var(--c-text-2); }
body.v2-rahmen #form-container .v2-schrittanzeige__balken { flex: 0 1 160px; height: 6px; border-radius: 3px; background: var(--ee-grau-200); overflow: hidden; }
body.v2-rahmen #form-container .v2-schrittanzeige__balken > span { display: block; height: 100%; background: var(--ee-rot); border-radius: 3px; }
/* N-43 Nur für Bildschirmleser: Klassen aus dem bisherigen Theme/WordPress, für die das neue Design keine Regel hatte –
   z. B. „(Zeitraum 2)“ an den Feldern des Elternzeitrechners war sichtbar. Wie .v2-visuell-versteckt; fokussierbare
   Varianten werden bei Tastaturfokus sichtbar. (.visually-hidden und .screen-reader-response sind bereits versteckt.) */
.v2-rahmen .screen-reader-text, .v2-rahmen .sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.v2-rahmen .screen-reader-text:focus, .v2-rahmen .sr-only-focusable:focus { position: static !important; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; white-space: normal; }

/* ---------- Fuß: Bewertungs-Widget und Siegel-Link linksbündig wie die Spalten (Raster 04.10.2026) ---------- */
.v2-fuss .v2-fuss__bewertung #pe_rating, .v2-fuss .v2-fuss__bewertung #pe_rating * { text-align: left !important; }
.v2-fuss .v2-fuss__bewertung #pe_rating { display: block; }
.v2-fuss .v2-fuss__box p[style*="text-align:center"], .v2-fuss .v2-fuss__box p[style*="text-align: center"] { text-align: left !important; }

/* ---------- Knöpfe in drei Stufen, überall gleich (Seitenkonzept SK-8, Freigabe 05.10.2026) ----------
   1 Hauptaktion: rot gefüllt (eine je Abschnitt) · 2 zweite Wahl: weiß mit grauem Rand · 3 „mehr lesen“: roter Textlink
   mit Pfeil (Karten). Alle 52 px hoch und rund, gut mit dem Daumen zu treffen. */
.v2-btn { min-height: 52px; padding: 0 1.6rem; }
.v2-btn--sekundaer { background: #fff; color: var(--ee-text); border: 1.5px solid var(--ee-grau-300); }
.v2-btn--sekundaer:hover, .v2-btn--sekundaer:focus-visible { background: #fff; color: var(--ee-text); border-color: var(--ee-text); }

/* ---------- Sprachwahl im Handy-Menü (Wunsch Inhaber 05.10.2026): Text statt Flaggen, Tap-Fläche 52 px ---------- */
.v2-menue__sprache { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); margin-top: var(--s-5); }
.v2-menue__sprache-titel { grid-column: 1 / -1; margin: 0; font-size: var(--fs-klein); font-weight: 600; color: var(--c-text-2); }
.v2-menue__sprache .v2-btn { width: 100%; }
.v2-menue__sprache .v2-btn[aria-current] { background: var(--ee-grau-100); border-color: var(--ee-text); }
.v2-menue__sprache .v2-btn[aria-current]::before { content: "✓"; color: var(--ee-rot); }
@media (min-width: 64rem) { .v2-menue__sprache { display: none; } }   /* ab Tablet quer steht die Sprachwahl im Fuß */

/* ---------- Layoutprüfung 10/2026: Tippflächen im Fuß (mind. 44 × 44 px) ---------- */
.v2-fuss__recht a { min-width: 44px; justify-content: center; }
.v2-fuss__box p > a:only-child, .v2-fuss__foerderung > a { display: inline-flex; align-items: center; min-height: 44px; }
/* „Mehr zu Ihren Daten“ (Datenschutz-Kurzinfo an Buchungs- und Bestellformular): größere Tippfläche */
.v2-rahmen .ee-dsinfo__details > summary { padding-block: 10px; }