/*
Theme Name: Fera Berlin
Theme URI: https://fera-berlin.de
Author: AppleIn.blue – Daniel Nimz
Author URI: https://applein.blue
Description: Custom WordPress Theme für die gynäkologische Gemeinschaftspraxis Fera im Wenckebach-Klinikum, Berlin Tempelhof. Design-System aus der Mockup-Phase 06–07/2026 (master-final, Kundenabnahme 07/2026).
Version: 2.2.1
Requires at least: 6.0
Tested up to: 6.9
Requires PHP: 8.0
License: Proprietary
Text Domain: fera
*/

/* ============================================================
   BASIS = design-mockups/ds/fera.css (Design-System, S12–S15)
   + Startseiten-Blöcke aus master-final.html (Hero/About/Video-Popup)
   Bei DS-Änderungen: zuerst im Mockup-DS pflegen, dann hier nachziehen.
   ============================================================ */

/* Skip-Link (Barrierefreiheit) — vertikal offscreen, damit kein horizontaler
   Overflow entsteht (Element-Detektor aus MOBILE_SYSTEM bleibt sauber) */
.skip-link{position:absolute;left:0;top:-100px;z-index:200;background:var(--navy);color:#fff;font-weight:700;padding:.9rem 1.4rem;border-radius:0 0 12px 0}
.skip-link:focus{top:0}

/* ============================================================
   FERA DESIGN-SYSTEM — abgeleitet aus master-final.html (S11/S12)
   Geteilte Basis für alle Unterseiten-Mockups.
   Teil 1 = 1:1 aus master-final (Tokens + Chrome + Komponenten)
   Teil 2 = neue Unterseiten-Module (phead, prose, team, profil,
            galerie, presse, formulare, faq, video-consent …)
   ============================================================ */
@font-face{font-family:'Open Sans';font-weight:400;font-display:swap;src:url('fonts/open-sans-latin-400-normal.woff2') format('woff2');}
@font-face{font-family:'Open Sans';font-weight:500;font-display:swap;src:url('fonts/open-sans-latin-500-normal.woff2') format('woff2');}
@font-face{font-family:'Open Sans';font-weight:600;font-display:swap;src:url('fonts/open-sans-latin-600-normal.woff2') format('woff2');}
@font-face{font-family:'Open Sans';font-weight:700;font-display:swap;src:url('fonts/open-sans-latin-700-normal.woff2') format('woff2');}

:root{
  --navy:#0B3A57;--navy-2:#09679B;--blue:#027FB8;--sky:#EAF3FE;--sky-2:#F2F8FE;
  --ink:#1C2B34;--ink-soft:#566570;--flame:#F6632B;--flame-deep:#C2410C;--line:#e2ebf2;
  --sans:'Open Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mask:30% 70% 70% 30%/30% 30% 70% 70%;
  --r-card:20px;--r-md:14px;--r-lg:24px;
  --sh-1:0 4px 14px -8px rgba(11,58,87,.13);
  --sh-2:0 12px 26px -16px rgba(11,58,87,.18);
  --sh-3:0 20px 44px -26px rgba(11,58,87,.22);
  --lift:translateY(-4px);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{overflow-x:clip}html{scroll-behavior:smooth}
/* Grid-Blowout-Guard (S13): Kinder aller Raster dürfen unter ihre min-content-Breite
   schrumpfen — sonst sprengen lange Komposita (z. B. „Nackentransparenzmessung")
   die 1fr-Spalte und die Karte läuft aus dem Viewport */
:is(.faqcards,.notices,.team-grid,.chapters,.kb__grid,.wl,.stats,.form,.contact-grid,.facts,.modes,.tb,.split,.profile,.bento,.ft__g,.drop .cards)>*{min-width:0}
.acc__title{min-width:0}
h1,h2,h3,h4,.acc__title{overflow-wrap:break-word}
@media(max-width:560px){h1,h2,h3,h4,.acc__title{hyphens:auto}}
body{font-family:var(--sans);color:var(--ink);background:#fff;font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
.wrap{width:min(1200px,92vw);margin-inline:auto}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--blue)}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--flame)}

/* Topbar */
.topbar{background:var(--navy);color:#cfe2f0;font-size:.8rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;gap:1rem}
.topbar__r{display:flex;gap:1.5rem;white-space:nowrap}.topbar a{font-weight:600;display:inline-flex;align-items:center;min-height:40px}.topbar a:hover{color:#fff}
@media(max-width:720px){.topbar__l{display:none}.topbar .wrap{justify-content:center}}

/* Header */
.hd{position:sticky;top:0;z-index:60;background:#fff;border-bottom:1px solid var(--line);transition:.3s}
.hd.sc{box-shadow:0 8px 30px -20px rgba(11,58,87,.5)}
/* Kompakte Gaps/Schrift: Nav-Inhalt (7 Menüpunkte + CTA) muss in den 1200px-Wrap passen (S15) */
.nav{display:flex;align-items:center;justify-content:space-between;height:76px;gap:1rem}
.brand{font-weight:700;font-size:1.7rem;letter-spacing:.13em;color:var(--navy);line-height:1;white-space:nowrap;flex-shrink:0}
.brand--logo img{height:33px;width:auto;max-width:none;display:block}
.brand small{display:block;font-size:.6rem;letter-spacing:.2em;color:var(--ink-soft);font-weight:600;margin-top:3px}
.menu{display:flex;flex-wrap:nowrap;gap:.95rem;list-style:none;margin-left:auto;align-items:center}
.m-item>a{display:inline-flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:600;color:var(--ink);white-space:nowrap;padding:.3rem 0;position:relative}
.m-item>a::after{content:"";position:absolute;left:0;bottom:-26px;height:3px;width:0;background:var(--flame);transition:width .25s}
.m-item:hover>a,.m-item:focus-within>a{color:var(--navy-2)}
.m-item.on>a{color:var(--navy-2)}
.m-item.on>a::after{width:100%}
.m-drop:hover>a::after,.m-drop:focus-within>a::after{width:100%}
.chev{width:9px;height:9px;transition:transform .25s}
.m-drop:hover .chev,.m-drop:focus-within .chev{transform:rotate(180deg)}
.drop{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 26px 44px -22px rgba(11,58,87,.28);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.22s;z-index:55}
.m-drop:hover .drop,.m-drop:focus-within .drop{opacity:1;visibility:visible;transform:none}
.drop__inner{padding:2.4rem 0 2.8rem}
.drop__eyebrow{font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--navy-2);display:flex;align-items:center;gap:.6rem;margin-bottom:1.7rem}
.drop__eyebrow::before{content:"";width:26px;height:2px;background:var(--flame)}
/* Spaltenbreiten kompensieren das fehlende Außen-Padding der Randspalten,
   damit alle 4 Bild-/Textspalten exakt gleich breit sind (S13-Fix) */
.drop .cards{display:grid;grid-template-columns:calc((100% - 11.4rem)/4 + 1.9rem) calc((100% - 11.4rem)/4 + 3.8rem) calc((100% - 11.4rem)/4 + 3.8rem) calc((100% - 11.4rem)/4 + 1.9rem);align-items:stretch}
.col{display:flex;flex-direction:column;padding:0 1.9rem;border-left:1px solid var(--line)}
.col:first-child{border-left:0;padding-left:0}.col:last-child{padding-right:0}
.col__img{aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#eef3f7;margin-bottom:1.1rem}
.col__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.col:hover .col__img img{transform:scale(1.05)}
.col__head{font-weight:700;color:var(--navy);font-size:1.12rem;margin-bottom:.55rem}
.col__head::after{content:"";display:block;width:30px;height:3px;background:var(--flame);border-radius:2px;margin-top:.6rem;transition:width .25s}
.col:hover .col__head::after{width:52px}
.col__desc{font-size:.9rem;color:var(--ink-soft);line-height:1.55}.col__desc strong{color:var(--navy)}
.col__label{font-weight:700;color:var(--navy);font-size:1.08rem}
.nav__cta{background:var(--flame);color:#fff;font-weight:700;font-size:.8rem;padding:.7rem 1.05rem;border-radius:8px;white-space:nowrap;box-shadow:0 10px 22px -12px rgba(246,99,43,.7);transition:.25s}
.nav__cta:hover{background:#D9531F;transform:translateY(-2px)}
.nav__end{position:relative;display:flex;align-items:center}
.nav__phone{position:absolute;top:calc(100% + 9px);right:0;white-space:nowrap;font-weight:700;font-size:.82rem;color:var(--navy);background:#fff;padding:.4rem .85rem;border-radius:8px;border:1px solid var(--line);box-shadow:0 10px 22px -10px rgba(11,58,87,.45);opacity:0;visibility:hidden;transform:translateY(-6px);transition:.25s;display:inline-flex;align-items:center;gap:.4rem;text-decoration:none}
.hd.sc .nav__phone{opacity:1;visibility:visible;transform:none}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:.4rem;z-index:96}
.burger span{width:25px;height:2px;background:var(--navy);border-radius:2px}

/* Mobile-Drawer */
.mdrawer{position:fixed;inset:0;z-index:95;display:none}
.mdrawer.open{display:block}
.mdrawer__bd{position:absolute;inset:0;background:rgba(8,28,42,.5)}
.mdrawer__panel{position:absolute;top:0;right:0;bottom:0;width:min(400px,90vw);background:var(--sky-2);overflow-y:auto;padding:1rem 1rem 2rem;transform:translateX(100%);transition:transform .3s;display:flex;flex-direction:column}
.mdrawer.open .mdrawer__panel{transform:none}
.mdrawer__top{display:flex;align-items:center;justify-content:space-between;padding:.3rem .3rem 1rem;margin-bottom:.5rem}
.mdrawer__top img{height:32px;width:auto}
.mdrawer__x{background:#fff;border:0;border-radius:10px;font-size:1.7rem;color:var(--navy);cursor:pointer;line-height:1;width:42px;height:42px;box-shadow:0 6px 16px -10px rgba(11,58,87,.5)}
.mdrawer__list{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.mli{border-radius:13px;overflow:hidden;background:#fff;box-shadow:0 8px 22px -16px rgba(11,58,87,.5)}
.mli>a,.mli__toggle{display:flex;align-items:center;justify-content:space-between;width:100%;padding:1rem;font-size:1.05rem;font-weight:700;color:var(--navy);background:none;border:0;cursor:pointer;font-family:inherit;text-align:left}
.mli__chev{width:13px;height:13px;color:var(--navy-2);transition:transform .25s;flex-shrink:0}
.mli.open{box-shadow:0 14px 30px -16px rgba(9,103,155,.7)}
.mli.open>.mli__toggle{background:linear-gradient(135deg,var(--navy-2),var(--navy));color:#fff}
.mli.open .mli__chev{transform:rotate(180deg);color:#fff}
.msub{list-style:none;max-height:0;overflow:hidden;transition:max-height .3s ease}
.msub a{display:flex;align-items:center;gap:.65rem;padding:.8rem 1rem;font-size:.96rem;font-weight:600;color:var(--navy);border-top:1px solid var(--sky)}
.msub a::before{content:"→";color:var(--flame);font-weight:700;flex-shrink:0}
.msub a:active,.msub a:hover{background:var(--sky-2);color:var(--navy-2)}
.mdrawer__cta{margin-top:1.3rem;background:linear-gradient(155deg,#FE7E4E,#F6632B);color:#fff;font-weight:700;text-align:center;padding:1rem;border-radius:13px;font-size:1rem;box-shadow:0 16px 30px -14px rgba(246,99,43,.6)}
@media(max-width:1280px){.menu{display:none}.nav__cta{display:none}.nav__phone{display:none}.burger{display:flex}}

/* Buttons */
.actions{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.btn{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.93rem;padding:.95rem 1.7rem;border-radius:10px;transition:.25s;cursor:pointer;border:2px solid transparent;font-family:inherit}
.btn--p{background:var(--flame);color:#fff;box-shadow:0 14px 30px -14px rgba(246,99,43,.6)}
.btn--p:hover{background:#D9531F;transform:translateY(-2px)}
.btn--ghost{border-color:var(--line);color:var(--navy);background:#fff}
.btn--ghost:hover{border-color:var(--navy-2);color:var(--navy-2);transform:translateY(-2px)}
.btn--w{background:#fff;color:var(--navy)}
.btn--wo{background:transparent;border-color:rgba(255,255,255,.5);color:#fff}.btn--wo:hover{background:rgba(255,255,255,.1);border-color:#fff}
.more{font-weight:700;font-size:.88rem;color:var(--flame);display:inline-flex;gap:.4rem;align-items:center}
/* Mobil: CTAs volle Breite + zentriert — kein unruhiger Zweizeilen-Umbruch (S13) */
@media(max-width:480px){.actions .btn,.cpanel .btn,.prose a.btn{width:100%;justify-content:center;text-align:center}}

/* Trenner */
.sep{position:relative;height:0}
.sep::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.sep::after{content:"";position:absolute;left:50%;top:-2px;transform:translateX(-50%);width:64px;height:4px;border-radius:3px;background:var(--flame)}

/* Section base */
.section{padding:clamp(3.5rem,7vw,6rem) 0}
.section--sky{background:var(--sky-2)}
.section--navy{background:var(--navy);color:#fff}
.kicker{font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--blue);display:flex;align-items:center;gap:.6rem}
.kicker::before{content:"";width:26px;height:2px;background:var(--flame)}
.head{max-width:50rem;margin-bottom:2.6rem}
.head h1,.head h2{font-size:clamp(1.9rem,3.6vw,2.8rem);font-weight:700;color:var(--navy);line-height:1.12;margin:.7rem 0 .5rem;letter-spacing:-.01em}
.section--navy .head h2{color:#fff}
.head p{color:var(--ink-soft);font-size:1.05rem}
.section--navy .head p{color:#bcd6ea}

/* Hinweis-Karten (notes) */
.notices{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
.note{border-radius:18px;padding:1.8rem 1.9rem;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column}
.note--dark{background:var(--navy);color:#fff;border-color:transparent;box-shadow:0 30px 60px -34px rgba(11,58,87,.6)}
.note--wide{grid-column:span 2}
.note__tag{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--flame);margin-bottom:.7rem}
.note--dark .note__tag{color:#ff9e76}
.note h3{font-size:1.4rem;font-weight:700;color:var(--navy);margin-bottom:1rem;line-height:1.2}
.note--dark h3{color:#fff}
.note p{font-size:.95rem;color:var(--ink-soft);margin-bottom:.7rem}
.note--dark p{color:#cfe2f0}
/* notices--2: fixes Zwei-Karten-Raster, mobil einspaltig (statt Inline-Style, S13) */
.notices--2{grid-template-columns:1fr 1fr}
@media(max-width:620px){.notices--2{grid-template-columns:1fr}}
.note__icon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:1.3rem;background:var(--sky);margin-bottom:1rem}
.note__link{margin-top:auto;font-weight:700;font-size:.88rem;color:var(--blue);display:inline-flex;gap:.4rem;border-bottom:2px solid currentColor;align-self:flex-start;padding-bottom:1px}
.note--dark .note__link{color:#fff}
.note--accent{background:linear-gradient(155deg,var(--flame) 0%,var(--flame-deep) 100%);color:#fff;border-color:transparent;box-shadow:0 30px 60px -32px rgba(194,65,12,.7)}
.note--accent .note__tag{color:#FFE0C2}
.note--accent h3{color:#fff}
.note--accent p{color:#FFF1E8}
.note--accent .note__link{color:#fff}
.sz{display:flex;flex-wrap:wrap;gap:1.4rem 2.5rem;margin-top:.4rem}
.sz__item{min-width:150px}
.sz__date{font-weight:700;font-size:1.02rem;color:#fff}
.sz__time{font-size:.95rem;color:#a9c8de}
@media(max-width:900px){.notices{grid-template-columns:1fr 1fr}.note--wide{grid-column:span 2}}
@media(max-width:620px){.notices{grid-template-columns:1fr}.note--wide{grid-column:span 1}}

/* Stats-Band */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);border-radius:20px;padding:2.4rem 1.5rem;position:relative;overflow:hidden}
.stats::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;background:rgba(255,255,255,.05);border-radius:var(--mask)}
.stat{text-align:center;position:relative;z-index:1}
.stat:not(:last-child){border-right:1px solid rgba(255,255,255,.14)}
.stat b{font-size:3rem;font-weight:800;color:#fff;display:block;line-height:1}
.stat b::after{content:"";display:block;width:30px;height:3px;background:var(--flame);border-radius:2px;margin:.7rem auto 0}
.stat span{font-size:.92rem;color:#bcd6ea;margin-top:.7rem;display:block}
@media(max-width:760px){.stats{grid-template-columns:1fr 1fr;gap:2rem 1rem;padding:2rem 1rem}.stat:nth-child(2){border-right:0}}

/* Bento + Chips */
.lead-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:2.4rem;flex-wrap:wrap}
.lead-row a{font-weight:700;color:var(--blue);font-size:.9rem;display:inline-flex;gap:.4rem}
.bento{display:grid;gap:1.3rem}
.kb{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-1);transition:.3s}
.kb:hover{box-shadow:var(--sh-2);transform:var(--lift)}
.kb--feat{display:grid;grid-template-columns:1.05fr 1fr}
.kb__img{overflow:hidden;min-height:300px}
.kb__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.kb:hover .kb__img img{transform:scale(1.05)}
.kb__b{padding:clamp(1.7rem,3vw,2.6rem);display:flex;flex-direction:column}
.kb__no{align-self:flex-start;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--flame);background:rgba(246,99,43,.1);padding:.4rem .85rem;border-radius:999px;margin-bottom:1.05rem}
.kb__b h3{font-size:1.6rem;font-weight:700;color:var(--navy);margin-bottom:1.2rem;letter-spacing:-.01em}
.kb--feat .kb__b h3{font-size:2rem}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:1.6rem}
.chip{font-size:.85rem;font-weight:600;color:var(--navy);background:var(--sky);padding:.5rem .95rem;border-radius:999px;transition:.2s;cursor:default}
.chip:hover{background:var(--flame);color:#fff;transform:translateY(-1px)}
/* Jobs-Seitenkopf: größere Chips für die offenen Stellen (statt Inline-Style, S19) */
.chips--jobs{margin:1rem 0 1.6rem}
.chips--jobs .chip{font-size:.95rem;padding:.65rem 1.2rem}
.kb .more{margin-top:auto}
.kb__grid{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem}
.kb--sm{display:flex;flex-direction:column}
.kb--sm .kb__img{aspect-ratio:16/9;min-height:0}
@media(max-width:820px){.kb--feat{grid-template-columns:1fr}.kb__grid{grid-template-columns:1fr}.kb--feat .kb__img{min-height:0;aspect-ratio:16/9}}

/* Weitere Leistungen (Navy-Welt) */
.wl{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.wlc{background:#fff;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 34px 64px -38px rgba(0,0,0,.5);transition:.3s}
.wlc:hover{transform:translateY(-6px);box-shadow:0 44px 74px -36px rgba(0,0,0,.6)}
.wlc__media{position:relative}
.wlc__img{aspect-ratio:16/10;overflow:hidden;background:#eef3f7}
.wlc__img img{width:100%;height:100%;object-fit:cover;transition:.6s}
.wlc__img--people img{object-position:50% top}
.wlc:hover .wlc__img img{transform:scale(1.05)}
.wlc__badge{position:absolute;left:1.4rem;bottom:-22px;width:46px;height:46px;border-radius:12px;background:var(--flame);color:#fff;font-weight:700;font-size:1.05rem;display:grid;place-items:center;box-shadow:0 12px 24px -8px rgba(246,99,43,.7)}
.wlc__b{padding:2rem 1.7rem 1.8rem;flex:1;display:flex;flex-direction:column}
.wlc__b h3{font-size:1.28rem;font-weight:700;color:var(--navy);margin:0 0 .7rem;line-height:1.2;padding-bottom:.7rem;border-bottom:2px solid var(--flame);display:inline-block}
.wlc__b p{font-size:.94rem;color:var(--ink-soft);margin-bottom:1.1rem}
.wlc__b p b{color:var(--navy)}
.wlc .more{margin-top:auto;color:var(--flame)}
@media(max-width:820px){.wl{grid-template-columns:1fr}}

/* Tabs + Akkordeon */
.tabs{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2.2rem}
.tab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:.6rem 1.2rem;font-size:.85rem;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:.2s;font-family:inherit}
.tab b{color:var(--flame);margin-right:.4rem}
.tab.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.tab.on b{color:#ff9e76}
.arts{display:flex;flex-direction:column;gap:.9rem;max-width:66rem;animation:tabfade .4s ease}
.arts[hidden]{display:none}
@keyframes tabfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.acc__item{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:box-shadow .3s,border-color .3s}
.acc__item.open{border-color:transparent;box-shadow:0 26px 54px -34px rgba(11,58,87,.4)}
.acc__head{display:flex;align-items:center;gap:1.1rem;width:100%;text-align:left;background:none;border:0;cursor:pointer;padding:1.1rem 1.5rem;font-family:inherit;border-left:4px solid transparent;transition:border-color .3s,background .3s}
.acc__head:hover{background:var(--sky-2)}
.acc__item.open .acc__head{border-left-color:var(--flame)}
.acc__n{width:44px;height:44px;border-radius:12px;background:var(--sky);color:var(--navy-2);font-weight:700;font-size:1rem;display:grid;place-items:center;flex-shrink:0;transition:.3s}
.acc__item.open .acc__n{background:var(--flame);color:#fff}
.acc__title{flex:1;font-size:clamp(1.05rem,2vw,1.2rem);font-weight:700;color:var(--navy);line-height:1.25}
.acc__chev{width:22px;height:22px;color:var(--ink-soft);transition:transform .35s,color .3s;flex-shrink:0}
.acc__item.open .acc__chev{transform:rotate(180deg);color:var(--flame)}
.acc__body{max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.25,.7,.3,1)}
.acc__inner{padding:.2rem 1.6rem 1.6rem 5.2rem}
.acc__tag{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--blue);display:block;margin-bottom:.6rem}
.acc__inner .body p{color:var(--ink-soft);font-size:.97rem;margin-bottom:.8rem}
.acc__inner .body strong{color:var(--navy)}
.acc__inner .more{display:inline-flex;gap:.4rem;align-items:center;font-weight:700;font-size:.88rem;color:var(--flame);margin-top:.4rem}
@media(max-width:560px){.acc__inner{padding-left:1.6rem}}

/* CTA-Band */
.cta{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;text-align:center;padding:clamp(3.5rem,7vw,5.5rem) 0;position:relative;overflow:hidden}
.cta::before{content:"";position:absolute;width:420px;height:420px;background:rgba(255,255,255,.06);border-radius:var(--mask);top:-160px;right:-120px}
.cta::after{content:"";position:absolute;width:320px;height:320px;background:rgba(255,255,255,.05);border-radius:var(--mask);bottom:-140px;left:-100px}
.cta .kicker{justify-content:center;color:#8fd0f0}
.cta h2{font-size:clamp(1.9rem,4vw,3rem);font-weight:700;margin:.7rem 0;position:relative}
.cta .actions{justify-content:center;position:relative}

/* Kontakt/Map-Split + Modecards */
.split{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(2rem,4vw,3.5rem);align-items:center;margin-bottom:1.6rem}
.split h3{font-size:1.35rem;color:var(--navy);font-weight:700;margin-bottom:.9rem}
.ph{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;color:var(--navy-2);font-size:1.05rem;background:var(--sky);padding:.5rem 1rem;border-radius:999px;margin-bottom:1.2rem}
.ph .svg{width:1.1rem;height:1.1rem}
.addr{color:var(--ink-soft);margin-bottom:1.6rem}
.maps{display:inline-flex;align-items:center;gap:.55rem;background:var(--flame);color:#fff;font-weight:700;font-size:.93rem;padding:.85rem 1.5rem;border-radius:11px;box-shadow:0 14px 30px -14px rgba(246,99,43,.6);transition:.25s}
.maps:hover{background:#D9531F;transform:translateY(-2px)}
.maps .svg{width:1.15rem;height:1.15rem}
.map{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:1.1rem;box-shadow:var(--sh-2)}
.map img{width:100%;height:auto;border-radius:13px}
.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem;margin-top:2.4rem}
.mode{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:1.5rem 1.6rem;display:flex;gap:1rem;align-items:flex-start;box-shadow:var(--sh-1);transition:.3s}
.mode:hover{transform:var(--lift);box-shadow:var(--sh-2)}
.mode__ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;color:#fff;flex-shrink:0}
.mode__ic--u{background:linear-gradient(140deg,#0596c9,var(--navy-2))}
.mode__ic--bus{background:linear-gradient(140deg,var(--blue),var(--navy-2))}
.mode__ic--pkw{background:linear-gradient(140deg,#FE7E4E,var(--flame))}
.mode b{color:var(--navy);display:block;margin-bottom:.25rem;font-size:1.02rem}
.mode p{font-size:.9rem;color:var(--ink-soft)}
@media(max-width:900px){.split{grid-template-columns:1fr}.modes{grid-template-columns:1fr}}
@media(max-width:560px){.maps{width:100%;justify-content:center}}

/* Footer */
.ft{background:#08293d;color:#bcd6ea;padding:3.5rem 0 1.8rem}
.ft__g{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:2rem}
.ft .brand{color:#fff}.ft .brand small{color:#7fa9c6}
.ft p,.ft li,.ft a{font-size:.9rem;color:#9fc4dd}
.ft h4{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;margin-bottom:1rem}
.ft ul{list-style:none;line-height:2}.ft a:hover{color:#fff}
.ft__bot{margin-top:2.5rem;padding-top:1.4rem;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;font-size:.8rem;color:#7fa9c6}
@media(max-width:760px){.ft__g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.ft__g{grid-template-columns:1fr;gap:1.7rem}}

/* Mobile-Bottom-Bar + Phone-Tab */
.mobar{display:none;position:fixed;bottom:0;left:0;right:0;z-index:70;background:#fff;border-top:1px solid var(--line);padding:.6rem .9rem;gap:.6rem;justify-content:center;box-shadow:0 -10px 30px -18px rgba(11,58,87,.5)}
.mobar a{flex:1 1 0;max-width:300px;text-align:center;font-weight:700;font-size:.88rem;padding:.85rem;border-radius:10px}
.mobar .b1{background:var(--flame);color:#fff}.mobar .b2{background:var(--sky);color:var(--navy)}
@media(max-width:1180px){.mobar{display:flex}body{padding-bottom:74px}}
.phonetab{position:fixed;right:0;top:62%;z-index:80;display:flex;align-items:center;background:var(--navy-2);color:#fff;border-radius:14px 0 0 14px;box-shadow:-3px 16px 36px -12px rgba(11,58,87,.6);text-decoration:none;overflow:hidden;opacity:0;visibility:hidden;transform:translate(20px,-50%);transition:opacity .3s,transform .35s,background .25s}
.phonetab.show{opacity:1;visibility:visible;transform:translate(0,-50%)}
.phonetab:hover,.phonetab:focus-visible{background:var(--navy)}
.phonetab__icon{width:56px;height:56px;display:grid;place-items:center;flex-shrink:0;color:#fff}
.phonetab__icon svg{width:24px;height:24px}
.phonetab__num{white-space:nowrap;font-weight:700;font-size:1rem;letter-spacing:.02em;max-width:0;opacity:0;overflow:hidden;transition:max-width .4s cubic-bezier(.3,.7,.3,1),opacity .25s,padding .4s}
.phonetab:hover .phonetab__num,.phonetab:focus-visible .phonetab__num{max-width:240px;opacity:1;padding-right:1.3rem}
@media(max-width:1180px){.phonetab{display:none}}

/* Reveal + A11y */
.reveal{opacity:0;transform:translateY(24px);transition:.7s ease}
.reveal.in{opacity:1;transform:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.kicker,.acc__tag,.note__link,.lead-row a{color:var(--navy-2)}
.section--navy .kicker{color:#7fb8da}
@media(max-width:480px){
  .brand--logo img{height:auto;width:calc(92vw - 66px);max-width:263px}
  .mdrawer__top img{height:auto;width:min(62vw,255px)}
}
@media(max-width:380px){.topbar__r{gap:.75rem;font-size:.72rem}}

/* ============================================================
   TEIL 2 — UNTERSEITEN-MODULE (neu in S12)
   ============================================================ */

/* --- Seitenkopf (phead): Kopf jeder Unterseite ---
   S13: ohne Breadcrumb-Leiste und ohne Trennlinie zum Folgeabschnitt (Kundenfeedback) */
.phead{background:linear-gradient(180deg,var(--sky-2) 0%,#fff 100%)}
.phead .wrap{padding:clamp(2.6rem,5vw,4rem) 0 clamp(2.2rem,4.5vw,3.4rem)}
.phead h1{font-size:clamp(2rem,4vw,2.9rem);line-height:1.1;font-weight:700;letter-spacing:-.02em;color:var(--navy);margin:.9rem 0 1rem;max-width:24ch}
.phead__lead{font-size:1.08rem;color:var(--ink-soft);max-width:62ch}
.phead__lead+.phead__lead{margin-top:.9em}
.phead__lead a{color:var(--blue);font-weight:600;border-bottom:2px solid rgba(2,127,184,.25);transition:.2s}
.phead__lead a:hover{color:var(--flame);border-color:rgba(246,99,43,.4)}
.phead--split .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,4vw,4rem);align-items:center}
.phead__media{border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-3);aspect-ratio:16/10;background:var(--sky)}
.phead__media img{width:100%;height:100%;object-fit:cover}
/* --top: Porträt-Bilder im Seitenkopf oben anschneiden statt mittig (Köpfe sichtbar) */
.phead__media--top img{object-position:50% 12%}
/* wrap--tb: Seitenkopf-Spalten exakt wie das tb-Layout darunter (Jobs) */
.phead--split .wrap--tb{grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,3.6rem)}
@media(max-width:900px){.phead--split .wrap,.phead--split .wrap--tb{grid-template-columns:1fr;gap:2rem}}
/* Erste Section nach dem Seitenkopf rückt näher heran (S13: Luft-Feedback Team/Galerie) */
.phead+.section{padding-top:clamp(1.6rem,3vw,2.4rem)}

/* --- Prosa (Fließtext-Inhalte) --- */
.prose{max-width:72ch}
.prose h2{font-size:clamp(1.5rem,2.6vw,1.9rem);font-weight:700;color:var(--navy);line-height:1.2;margin:2.2rem 0 .9rem;letter-spacing:-.01em}
.prose h3{font-size:1.22rem;font-weight:700;color:var(--navy);margin:1.8rem 0 .7rem}
.prose h4{font-size:1.05rem;font-weight:700;color:var(--navy-2);margin:1.4rem 0 .5rem}
.prose p{color:var(--ink);margin-bottom:1em}
.prose p.soft{color:var(--ink-soft)}
.prose a{color:var(--blue);font-weight:600;border-bottom:2px solid rgba(2,127,184,.25);transition:.2s}
.prose a:hover{color:var(--flame);border-color:rgba(246,99,43,.4)}
.prose ul{list-style:none;margin:0 0 1.2em;display:flex;flex-direction:column;gap:.45rem}
.prose ul li{position:relative;padding-left:1.55rem}
.prose ul li::before{content:"";position:absolute;left:0;top:.52em;width:9px;height:9px;border-radius:3px;background:var(--flame)}
.prose ol{margin:0 0 1.2em;padding-left:1.3rem;display:flex;flex-direction:column;gap:.45rem}
.prose ol li::marker{color:var(--flame);font-weight:700}
.prose strong{color:var(--navy)}
.prose figure{margin:1.6rem 0}
.prose figure img{border-radius:var(--r-md);box-shadow:var(--sh-2)}
.prose figcaption{font-size:.83rem;color:var(--ink-soft);margin-top:.6rem}
/* Buttons im Fließtext: Prose-Link-Styles dürfen Button-Styles nicht überschreiben */
.prose a.btn{border-bottom:none}
.prose a.btn--p,.prose a.btn--p:hover{color:#fff}
.prose a.btn--ghost{color:var(--navy)}
.prose a.btn--ghost:hover{color:var(--navy-2)}

/* --- Kontakt: Info-Panel + Sprechzeiten-Tabelle --- */
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:1.5rem;align-items:stretch}
.cpanel{background:var(--navy);color:#fff;border-radius:var(--r-card);padding:clamp(1.8rem,3vw,2.6rem);box-shadow:0 30px 60px -34px rgba(11,58,87,.6);position:relative;overflow:hidden;display:flex;flex-direction:column}
.cpanel::after{content:"";position:absolute;right:-70px;bottom:-70px;width:240px;height:240px;background:rgba(255,255,255,.05);border-radius:var(--mask)}
.cpanel .note__tag{color:#ff9e76}
.cpanel h2{font-size:clamp(1.4rem,2.4vw,1.8rem);font-weight:700;line-height:1.25;margin-bottom:1.4rem}
.cpanel address{font-style:normal;color:#cfe2f0;font-size:1.02rem;line-height:1.8;margin-bottom:1.5rem}
.crow{display:flex;align-items:center;gap:.8rem;padding:.75rem 0;border-top:1px solid rgba(255,255,255,.14);font-size:1rem;position:relative;z-index:1}
.crow .svg{width:20px;height:20px;color:#8fd0f0;flex-shrink:0}
.crow a{font-weight:700;color:#fff}.crow a:hover{color:#ff9e76}
.crow small{color:#a9c8de}
.cpanel .btn{margin-top:auto;position:relative;z-index:1;align-self:flex-start}
.cpanel__photo{margin-top:1.5rem;position:relative;z-index:1;border-radius:14px;overflow:hidden;aspect-ratio:16/9;max-width:420px}
.cpanel__photo img{width:100%;height:100%;object-fit:cover}
.hours{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:clamp(1.8rem,3vw,2.4rem);box-shadow:var(--sh-1)}
.hours h2{font-size:1.35rem;color:var(--navy);font-weight:700;margin-bottom:1.2rem;display:flex;align-items:center;gap:.7rem}
.hours h2 .svg{width:24px;height:24px;color:var(--flame)}
.hrow{display:grid;grid-template-columns:130px 1fr;gap:1rem;padding:.85rem .4rem;border-bottom:1px solid var(--line);align-items:baseline}
.hrow:last-of-type{border-bottom:0}
.hrow.today{background:var(--sky-2);border-radius:10px;border-bottom-color:transparent}
.hrow dt{font-weight:700;color:var(--navy)}
.hrow dd{color:var(--ink-soft);font-size:.98rem;display:flex;flex-wrap:wrap;gap:.3rem 1.4rem}
.hours__note{margin-top:1.2rem;font-size:.9rem;color:var(--ink-soft);background:var(--sky-2);border-radius:10px;padding:.8rem 1rem;display:flex;gap:.6rem;align-items:flex-start}
.hours__note .svg{width:18px;height:18px;color:var(--navy-2);flex-shrink:0;margin-top:2px}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}}
@media(max-width:480px){.hrow{grid-template-columns:1fr;gap:.1rem}}

/* --- Icon-Fakten-Karten (Englisch, Parken …) --- */
.facts{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;margin-top:1.5rem}
.fact{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:1.4rem 1.5rem;display:flex;gap:1rem;align-items:center;box-shadow:var(--sh-1)}
.fact__ic{width:48px;height:48px;border-radius:14px;background:var(--sky);display:grid;place-items:center;font-size:1.35rem;flex-shrink:0}
.fact p{font-size:.95rem;color:var(--ink);font-weight:600}
@media(max-width:720px){.facts{grid-template-columns:1fr}}

/* --- Formulare --- */
.form{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.f-field{display:flex;flex-direction:column;gap:.4rem}
.f-field--full{grid-column:1/-1}
.f-field label{font-size:.85rem;font-weight:700;color:var(--navy)}
.f-field label small{font-weight:600;color:var(--ink-soft)}
.f-field input,.f-field textarea,.f-field select{font-family:inherit;font-size:.98rem;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:.85rem 1rem;transition:border-color .2s,box-shadow .2s;width:100%}
.f-field input:focus,.f-field textarea:focus,.f-field select:focus{outline:none;border-color:var(--navy-2);box-shadow:0 0 0 3px rgba(9,103,155,.14)}
.f-field textarea{min-height:130px;resize:vertical}
.f-check{grid-column:1/-1;display:flex;gap:.7rem;align-items:flex-start;font-size:.88rem;color:var(--ink-soft)}
/* Formular als Karte (statt Inline-Style, S19) */
.form--card{align-self:start;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:clamp(1.8rem,3vw,2.4rem);box-shadow:var(--sh-1)}
/* Rückmeldung nach dem Absenden */
.form-msg{grid-column:1/-1;border-radius:12px;padding:.95rem 1.1rem;font-size:.92rem;line-height:1.55}
.form-msg--ok{background:#EAF7EF;border:1px solid #B7DEC8;color:#1B5C36}
.form-msg--err{background:#FDF0EC;border:1px solid #F2C7BA;color:#8A2A16}
/* Nur für Screenreader: ergänzt kurze Linktexte („Jetzt bewerben") um den
   Zusammenhang, ohne sichtbar zu werden. Fehlte im Theme, obwohl die Klasse
   verwendet wurde — der Text stand dadurch sichtbar auf der Jobs-Seite (S19). */
.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}

/* Honigtopf gegen Spam: für Menschen unsichtbar, aber nicht display:none —
   sonst füllen manche Bots ihn gerade deshalb nicht aus. Bewusst per clip-path
   statt left:-9999px: ein ausgelagertes Element ragt aus dem Viewport und wird
   vom Overflow-Detektor (docs/MOBILE_SYSTEM.md §3) zu Recht angemeckert. */
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
/* Auch das Feld selbst klein halten — der geclippte Container verbirgt es zwar,
   aber ein 200px breites Kind ragt weiterhin messbar über den Viewport hinaus. */
.hp input{width:1px;height:1px;min-height:0;padding:0;border:0}
.f-check input{width:19px;height:19px;margin-top:2px;accent-color:var(--flame);flex-shrink:0}
.f-check a{color:var(--blue);font-weight:600;border-bottom:1px solid rgba(2,127,184,.3)}
.f-actions{grid-column:1/-1;display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.f-hint{font-size:.82rem;color:var(--ink-soft)}
@media(max-width:640px){.form{grid-template-columns:1fr}}

/* --- Team-Karten --- */
.team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
.tcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-1);transition:.3s;display:flex;flex-direction:column}
.tcard:hover{transform:var(--lift);box-shadow:var(--sh-2)}
.tcard__img{aspect-ratio:3/3.4;overflow:hidden;background:var(--sky)}
.tcard__img img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;transition:transform .6s}
.tcard:hover .tcard__img img{transform:scale(1.04)}
.tcard__b{padding:1.4rem 1.5rem 1.5rem;display:flex;flex-direction:column;flex:1}
.tcard__b h3{font-size:1.22rem;font-weight:700;color:var(--navy);margin-bottom:.7rem}
.tcard__quals{list-style:none;display:flex;flex-direction:column;gap:.3rem;margin-bottom:1.2rem}
.tcard__quals li{font-size:.88rem;color:var(--ink-soft);position:relative;padding-left:1.1rem}
.tcard__quals li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:2px;background:var(--flame)}
.tcard .more{margin-top:auto}
.team-grid--2{grid-template-columns:1fr 1fr;max-width:56rem}
@media(max-width:1000px){.team-grid{grid-template-columns:1fr 1fr}}
@media(max-width:540px){.team-grid{grid-template-columns:1fr}}

/* --- Arztprofil --- */
.profile{display:grid;grid-template-columns:.85fr 1.4fr;gap:clamp(2rem,4.5vw,4rem);align-items:start}
.profile__side{position:sticky;top:106px}
.profile__photo{border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-3);background:var(--sky);aspect-ratio:3/3.6}
.profile__photo img{width:100%;height:100%;object-fit:cover;object-position:50% 15%}
.profile__card{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);box-shadow:var(--sh-2);padding:1.5rem 1.6rem;margin-top:-3.2rem;position:relative;width:calc(100% - 2rem);margin-inline:auto}
.profile__card .chips{margin-bottom:0}
.profile__body h1{font-size:clamp(2rem,3.6vw,2.7rem);color:var(--navy);font-weight:700;letter-spacing:-.02em;line-height:1.1;margin:.9rem 0 1.1rem}
.profile__intro{font-size:1.08rem;color:var(--ink-soft);margin-bottom:1.8rem;max-width:60ch}
.cvsec{margin-top:2.4rem}
.cvsec h2{font-size:1.3rem;font-weight:700;color:var(--navy);display:flex;align-items:center;gap:.8rem;margin-bottom:1.1rem}
.cvsec h2::before{content:"";width:26px;height:3px;border-radius:2px;background:var(--flame);flex-shrink:0}
.cvlist{list-style:none;display:flex;flex-direction:column}
.cvlist li{position:relative;padding:.55rem 0 .55rem 1.9rem;color:var(--ink);font-size:.98rem;border-left:2px solid var(--line);margin-left:.4rem}
.cvlist li::before{content:"";position:absolute;left:-6px;top:1.05em;width:10px;height:10px;border-radius:50%;background:#fff;border:3px solid var(--navy-2)}
.cvlist li:first-child{padding-top:0}.cvlist li:first-child::before{top:.45em}
.cvlist li:last-child{padding-bottom:0}
.pubs{list-style:none;display:flex;flex-direction:column;gap:.7rem}
.pubs li{background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:1rem 1.2rem;font-size:.92rem;color:var(--ink-soft);line-height:1.55}
.pubs li a{color:var(--blue);font-weight:700;white-space:nowrap}
.pubs li a:hover{color:var(--flame)}
.backlink{display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.9rem;color:var(--navy-2);margin-bottom:1rem}
.backlink:hover{color:var(--flame)}
@media(max-width:900px){.profile{grid-template-columns:1fr}.profile__side{position:static;max-width:420px}}

/* --- Bildergalerie + Lightbox --- */
.gallery{columns:3;column-gap:1.3rem}
.gitem{break-inside:avoid;margin-bottom:1.3rem;border-radius:var(--r-card);overflow:hidden;position:relative;display:block;box-shadow:var(--sh-1);border:0;padding:0;background:var(--sky);cursor:zoom-in;width:100%}
.gitem img{width:100%;height:auto;display:block;transition:transform .5s}
.gitem::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,28,42,0) 55%,rgba(8,28,42,.55));opacity:0;transition:opacity .3s}
.gitem figcaption{position:absolute;left:1.1rem;right:1.1rem;bottom:.95rem;color:#fff;font-size:.88rem;font-weight:700;z-index:2;opacity:0;transform:translateY(8px);transition:.3s}
.gitem:hover img,.gitem:focus-visible img{transform:scale(1.04)}
.gitem:hover::after,.gitem:focus-visible::after{opacity:1}
.gitem:hover figcaption,.gitem:focus-visible figcaption{opacity:1;transform:none}
@media(max-width:900px){.gallery{columns:2}}
@media(max-width:560px){.gallery{columns:1}}
.imodal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:3vw}
.imodal.open{display:flex}
.imodal__bd{position:absolute;inset:0;background:rgba(8,28,42,.86);backdrop-filter:blur(6px)}
.imodal__box{position:relative;z-index:1;max-width:min(1080px,94vw)}
.imodal__box img{max-width:100%;max-height:82vh;width:auto;height:auto;border-radius:14px;box-shadow:0 40px 90px -30px rgba(0,0,0,.7)}
.imodal__cap{color:#cfe2f0;font-size:.95rem;font-weight:600;text-align:center;margin-top:1rem}
.imodal__close{position:absolute;top:-46px;right:0;background:rgba(255,255,255,.14);color:#fff;border:0;width:38px;height:38px;border-radius:50%;font-size:1.4rem;cursor:pointer;transition:.2s}
.imodal__close:hover{background:rgba(255,255,255,.28)}
.imodal__nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.14);color:#fff;border:0;width:46px;height:46px;border-radius:50%;font-size:1.5rem;cursor:pointer;transition:.2s;display:grid;place-items:center}
.imodal__nav:hover{background:rgba(255,255,255,.3)}
.imodal__prev{left:-60px}.imodal__next{right:-60px}
@media(max-width:1200px){.imodal__prev{left:8px}.imodal__next{right:8px}}

/* --- Presse-Liste --- */
.press{display:flex;flex-direction:column;gap:1.4rem;max-width:66rem}
.pressit{display:grid;grid-template-columns:280px 1fr;gap:0;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-1);transition:.3s}
.pressit:hover{transform:var(--lift);box-shadow:var(--sh-2)}
.pressit__img{overflow:hidden;background:var(--sky);position:relative;min-height:200px}
.pressit__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.pressit:hover .pressit__img img{transform:scale(1.05)}
.pressit__b{padding:1.7rem 1.9rem;display:flex;flex-direction:column}
.pressit__date{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--navy-2);display:inline-flex;align-items:center;gap:.6rem;margin-bottom:.6rem}
.pressit__date::before{content:"";width:20px;height:2px;background:var(--flame)}
.pressit__b h2{font-size:1.3rem;font-weight:700;color:var(--navy);line-height:1.25;margin-bottom:.7rem}
.pressit__b p{font-size:.95rem;color:var(--ink-soft);margin-bottom:1rem}
.pressit__b p em{font-style:italic}
.pressit__foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
.pressit__credit{font-size:.76rem;color:#8ba0ad}
@media(max-width:760px){.pressit{grid-template-columns:1fr}.pressit__img{aspect-ratio:16/8;min-height:0}.pressit__img img{position:static;height:100%}}

/* --- Video mit Consent-Platzhalter (Vimeo, DSGVO) --- */
.vidph{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);box-shadow:var(--sh-3);display:grid;place-items:center;text-align:center;padding:2rem;isolation:isolate}
.vidph::before{content:"";position:absolute;width:340px;height:340px;background:rgba(255,255,255,.06);border-radius:var(--mask);top:-120px;right:-100px;z-index:-1}
.vidph__inner{max-width:44ch;color:#cfe2f0;display:flex;flex-direction:column;align-items:center;gap:1rem}
.vidph__play{width:78px;height:78px;border-radius:50%;background:rgba(255,255,255,.16);border:2px solid rgba(255,255,255,.65);display:grid;place-items:center}
.vidph__play::after{content:"";margin-left:5px;border-style:solid;border-width:11px 0 11px 19px;border-color:transparent transparent transparent #fff}
.vidph p{font-size:.92rem}
.vidph p a{color:#fff;font-weight:700;border-bottom:1px solid rgba(255,255,255,.5)}
.vidph__actions{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center}
.vidph__actions .btn{padding:.7rem 1.3rem;font-size:.86rem}
@media(max-width:560px){.vidph{aspect-ratio:auto;padding:2.4rem 1.4rem}}

/* --- Video-Kapitel (Min./Thema) --- */
.chapters{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem}
.chapters ul{list-style:none;display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-1)}
.chapters li{border-bottom:1px solid var(--line);font-size:.95rem}
.chapters li:last-child{border-bottom:0}
.chapters li:nth-child(odd){background:var(--sky-2)}
.chapters time{font-weight:700;color:var(--navy-2);font-variant-numeric:tabular-nums;flex-shrink:0;background:var(--sky);border-radius:8px;padding:.15rem .6rem;font-size:.83rem}
/* Kapitel als Schaltfläche: springt im Video an die Stelle (js/main.js). Das Layout
   sitzt auf dem Button, nicht mehr auf dem <li> — sonst wäre nur ein Teil der
   Zeile klickbar. Zeilenhöhe bleibt über 40px (Tap-Target, MOBILE_SYSTEM Regel 7). */
.chapters__jump{display:flex;gap:1.1rem;align-items:baseline;width:100%;padding:.8rem 1.3rem;
  background:none;border:0;border-radius:0;margin:0;font:inherit;font-size:inherit;color:inherit;
  text-align:left;cursor:pointer;transition:background .15s}
.chapters__jump>span{min-width:0;overflow-wrap:break-word}
.chapters__jump:hover{background:var(--sky)}
.chapters__jump:hover time{background:var(--navy);color:#fff}
.chapters__jump:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
/* Angesprungenes Kapitel: markiert die Stelle, wenn die Seite mit ?t=<sekunde>
   aufgerufen wurde (Suchergebnis, KI-Antwort, geteilter Link) oder nach einem
   Kapitelklick. Der Farbbalken trägt die Aussage nicht allein — aria-current
   macht sie auch für Screenreader hörbar (js/main.js). */
.chapters__jump[aria-current="true"]{background:var(--sky);box-shadow:inset 4px 0 0 var(--accent)}
.chapters__jump[aria-current="true"] time{background:var(--navy);color:#fff}
.chapters__hint{font-size:.9rem;color:var(--ink-soft);margin-top:1rem}
/* Videorahmen (Bunny-Player) — feste Kachel, damit beim Laden nichts springt (CLS). */
.vidframe{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;
  background:#000;box-shadow:var(--sh-3)}
/* 1px Überzug je Seite: an den gerundeten Ecken blitzte sonst der schwarze
   Wrapper-Hintergrund als Haarlinie durch (S24, auf allen Videos sichtbar). */
.vidframe iframe{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);border:0}
/* Hochformat (9:16, z. B. Outtakes-Clip): begrenzte Breite, zentriert —
   in einem 16:9-Rahmen stünde das Video sonst zwischen schwarzen Balken. */
.vidframe--hoch{aspect-ratio:9/16;max-width:min(420px,100%);margin-inline:auto}
@media(max-width:760px){.chapters{grid-template-columns:1fr}}
@media(max-width:560px){.chapters__jump>span{hyphens:auto}}

/* --- Nummerierte Schritte (Ablauf) --- */
.steps{list-style:none;display:flex;flex-direction:column;gap:1rem;counter-reset:step;max-width:62rem}
.steps li{counter-increment:step;display:flex;gap:1.2rem;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r-md);padding:1.2rem 1.4rem;box-shadow:var(--sh-1)}
.steps li::before{content:counter(step,decimal-leading-zero);width:44px;height:44px;border-radius:12px;background:var(--sky);color:var(--navy-2);font-weight:700;display:grid;place-items:center;flex-shrink:0;font-size:.95rem}
.steps li:hover::before{background:var(--flame);color:#fff}
.steps p{font-size:.97rem;color:var(--ink);margin:0;align-self:center}

/* --- FAQ-Hub-Karten --- */
.faqcards{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.faqcard{background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:2rem 2rem 1.8rem;box-shadow:var(--sh-1);display:flex;flex-direction:column;transition:.3s}
.faqcard:hover{transform:var(--lift);box-shadow:var(--sh-2)}
.faqcard h3{font-size:1.35rem;font-weight:700;color:var(--navy);margin:.9rem 0 .8rem;line-height:1.25}
.faqcard p{font-size:.95rem;color:var(--ink-soft);margin-bottom:1.4rem}
.faqcard .more{margin-top:auto}
@media(max-width:760px){.faqcards{grid-template-columns:1fr}}

/* --- Zwei-Spalten-Layout Text+Bild (Jobs u. a.) --- */
.tb{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,4vw,3.6rem);align-items:center}
.tb--rev{grid-template-columns:.85fr 1.15fr}
/* tb--swap: Nicht-Prose-Spalte (z. B. Karten) links, Text rechts — mobil bleibt Text zuerst */
.tb--swap{grid-template-columns:.85fr 1.15fr}
.tb--swap>.prose{order:2}
.tb__media{border-radius:var(--r-card);overflow:hidden;box-shadow:var(--sh-2);background:var(--sky)}
.tb__media img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
@media(max-width:860px){.tb,.tb--rev,.tb--swap{grid-template-columns:1fr;gap:1.8rem}.tb--rev .tb__media{order:-1}.tb--swap>.prose{order:0}.tb--mtext .tb__media{order:1}}

/* ============================================================
   STARTSEITE (aus master-final.html)
   ============================================================ */
/* ===== SPLIT-HERO (ATF aus Split-Hero-Master, Kundenfeedback 07/2026) ===== */
.hero{position:relative;background:linear-gradient(180deg,var(--sky-2) 0%,#fff 78%);overflow:hidden}
.hero .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.12fr 1fr;align-items:center;gap:clamp(2rem,4.5vw,4rem);padding:clamp(3rem,6vw,5rem) 0 clamp(3.5rem,6vw,5.5rem)}
.hero__txt h1{font-size:clamp(2.2rem,4.1vw,3.35rem);line-height:1.08;font-weight:700;letter-spacing:-.02em;color:var(--navy);margin:1.3rem 0 1.2rem}
.hero__txt h1 .l{display:block}
.hero__txt h1 .accent{color:var(--flame)}
.hero__lead{font-size:1.1rem;color:var(--ink-soft);max-width:50ch;margin-bottom:2rem}
.hero__cta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}
.btn--ghost{border-color:var(--line);color:var(--navy);background:#fff}
.btn--ghost:hover{border-color:var(--navy-2);color:var(--navy-2);transform:translateY(-2px)}
.btn--ghost .pl{width:30px;height:30px;border-radius:50%;background:var(--navy-2);display:inline-grid;place-items:center;flex-shrink:0}
.btn--ghost .pl::after{content:"";margin-left:2px;border-style:solid;border-width:5px 0 5px 9px;border-color:transparent transparent transparent #fff}
.hero__social{display:flex;align-items:center;gap:.85rem;margin-top:1.9rem}
.hero__social-label{font-size:.82rem;font-weight:700;color:var(--ink-soft);letter-spacing:.01em}
.hero__social-link{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:var(--navy-2);background:#fff;border:1px solid var(--line);box-shadow:0 8px 20px -14px rgba(11,58,87,.5);transition:.22s}
.hero__social-link:hover{transform:translateY(-2px);border-color:#d4e4f1;box-shadow:0 14px 26px -12px rgba(11,58,87,.4)}
.vcard{position:relative;z-index:2}
.vcard__frame{position:relative;aspect-ratio:16/9;border-radius:var(--r-lg);overflow:hidden;background:var(--navy);box-shadow:var(--sh-3);isolation:isolate}
.vcard__frame img,.vcard__frame video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vcard__frame video{opacity:0;transition:opacity .7s ease}.vcard__frame video.on{opacity:1}
.vcard__frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,28,42,0) 55%,rgba(8,28,42,.34));z-index:1}
.vcard__play{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:none;border:0;cursor:pointer}
.vcard__play span{width:78px;height:78px;border-radius:50%;background:rgba(255,255,255,.22);border:2px solid rgba(255,255,255,.7);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);display:grid;place-items:center;box-shadow:0 10px 30px -12px rgba(0,0,0,.4);transition:transform .25s,background .25s}
.vcard__play span::after{content:"";margin-left:5px;border-style:solid;border-width:11px 0 11px 19px;border-color:transparent transparent transparent #fff;filter:drop-shadow(0 1px 2px rgba(0,0,0,.35))}
.vcard__play:hover span{transform:scale(1.08);background:rgba(255,255,255,.4)}
.vcard__corner{position:absolute;top:-14px;right:-14px;width:74px;height:74px;border-top:4px solid var(--navy-2);border-right:4px solid var(--navy-2);border-top-right-radius:14px;z-index:4}
@media(max-width:900px){
  .hero .wrap{grid-template-columns:1fr;gap:3.4rem}
  .hero__lead{max-width:52ch}
  .vcard{max-width:560px;margin-inline:auto;width:100%}
  /* Sobald die Video-Karte unter dem Text steht, ist der Play-Button dort erreichbar —
     der Ghost-Button ist redundant und überdeckt gestapelt den Schatten des CTA (Kundenfeedback) */
  .hero__cta .btn--ghost{display:none}
}
@media(max-width:560px){
  .vcard__corner{display:none}
  .hero__cta .btn{flex:1 1 100%;justify-content:center}
}

/* ===== Über uns + Stats ===== */
.about__lead{max-width:60rem}
.about__lead h2{font-size:clamp(1.9rem,3.6vw,2.7rem);color:var(--navy);font-weight:700;line-height:1.16;margin:.7rem 0 1.3rem;max-width:24ch}
.about__cols{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-bottom:2.6rem}
.about__cols p{color:var(--ink-soft);font-size:1.02rem}
@media(max-width:760px){.about__cols{grid-template-columns:1fr;gap:.4rem}}
/* Video-Popup */
.vmodal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:4vw}
.vmodal.open{display:flex}
.vmodal__bd{position:absolute;inset:0;background:rgba(8,28,42,.82);backdrop-filter:blur(6px)}
.vmodal__box{position:relative;width:min(960px,94vw);z-index:1}
.vmodal__frame{aspect-ratio:16/9;background:#000;border-radius:14px;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.7)}
.vmodal__frame video,.vmodal__frame iframe{width:100%;height:100%;display:block;border:0}
.vmodal__close{position:absolute;top:-46px;right:0;background:rgba(255,255,255,.14);color:#fff;border:0;width:38px;height:38px;border-radius:50%;font-size:1.4rem;cursor:pointer;transition:.2s}
.vmodal__close:hover{background:rgba(255,255,255,.28)}
/* Hochformat-Variante (9:16, Outtakes auf /jobs/): Breite zusätzlich an der
   Viewport-Höhe gedeckelt, sonst ragt das Video auf flachen Screens unten raus. */
.vmodal__box--hoch{width:min(400px,94vw,calc(86vh * 9 / 16))}
.vmodal__frame--hoch{aspect-ratio:9/16}

/* ============================================================
   TERMIN-WIDGET (Direkteinbindung, Seite /termine-online/)
   Höhe fest reserviert → kein Layout-Sprung beim Nachladen (CLS).
   ============================================================ */
/* Termin-Widget (S30): Das Widget malt innerhalb des iframes eine weiße Fläche mit 34px Rand um seine
   hellblaue Karte (#EAF3FE) — von außen nicht färbbar. Deshalb kein eigener Kasten mehr: der Abschnitt
   ist weiß, der Rahmen randlos, die Karte liegt sichtbar auf einer ruhigen Fläche. */
.section--widget{background:#fff;padding-bottom:0}
.widget-frame{background:#fff;border:0;border-radius:0;box-shadow:none;overflow:hidden}
.widget-frame iframe{display:block;width:100%;height:900px;border:0}
@media(max-width:900px){.widget-frame iframe{height:1000px}}
@media(max-width:560px){.widget-frame iframe{height:1150px}}
.widget-note{margin-top:1rem;font-size:.88rem;color:var(--ink-soft)}
.widget-note a{color:var(--blue);font-weight:600;border-bottom:1px solid currentColor}

/* ============================================================
   RECHTSTEXTE (Impressum, Datenschutz, Cookies, Barrierefreiheit)
   Schmalere Zeilenlänge für Lesbarkeit langer Fließtexte.
   ============================================================ */
.legal{max-width:74ch}
.legal h2{font-size:1.5rem;color:var(--navy);font-weight:700;margin:2.6rem 0 .9rem;line-height:1.25;scroll-margin-top:120px}
.legal h2:first-child{margin-top:0}
.legal h3{font-size:1.12rem;color:var(--navy);font-weight:700;margin:1.8rem 0 .6rem}
.legal p,.legal li{color:var(--ink-soft);line-height:1.75}
.legal p{margin-bottom:1rem}
.legal ul,.legal ol{margin:0 0 1.2rem 1.3rem}
.legal li{margin-bottom:.45rem}
.legal a{color:var(--blue);font-weight:600;border-bottom:1px solid rgba(2,127,184,.35)}
.legal a:hover{border-bottom-color:currentColor}
.legal address{font-style:normal;color:var(--ink-soft);line-height:1.75;margin-bottom:1rem}
.legal strong{color:var(--ink)}
.legal table{width:100%;border-collapse:collapse;margin:0 0 1.4rem;font-size:.92rem}
.legal th,.legal td{text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--line);vertical-align:top}
.legal th{color:var(--navy);font-weight:700;background:var(--sky-2)}
/* Tabellen dürfen mobil scrollen, statt die Seite zu sprengen */
.legal .tablewrap{overflow-x:auto;margin-bottom:1.4rem}
.legal .tablewrap table{margin-bottom:0;min-width:520px}

/* Inhaltsverzeichnis langer Rechtstexte */
.legal-toc{background:var(--sky-2);border:1px solid var(--line);border-radius:var(--r-md);padding:1.3rem 1.5rem;margin-bottom:2.4rem}
.legal-toc h2{font-size:1rem;margin:0 0 .7rem;text-transform:uppercase;letter-spacing:.08em}
.legal-toc ol{margin:0 0 0 1.2rem}
.legal-toc li{margin-bottom:.3rem}

/* Platzhalter — muss beim Korrekturlesen sofort auffallen und darf
   NIE unbemerkt live gehen. Bewusst schrill.
   Auf .legal gescoped: Das Design-System vergibt .ph auch für Telefon-Chips
   (Kontakt/Startseite) — ungescoped färbte diese Regel die Nummern gelb (S24). */
.legal .ph{background:#FFE9B8;color:#7A4B00;border:1px dashed #C98A00;border-radius:4px;padding:.05em .4em;font-weight:700;font-size:.94em}
.legal .ph::before{content:"⚠ ";}
.legal-draft{background:#FFF6E5;border:1px solid #F0C97A;border-left:4px solid var(--flame);border-radius:var(--r-md);padding:1.2rem 1.4rem;margin-bottom:2rem}
.legal-draft p{color:#7A4B00;margin-bottom:.5rem}
.legal-draft p:last-child{margin-bottom:0}
.legal-draft strong{color:#7A4B00}

/* ============================================================
   BARRIEREFREIHEIT: Bewegung reduzieren
   Respektiert die Systemeinstellung „Bewegung reduzieren" (macOS/iOS/Windows/
   Android). Wichtig für Menschen mit vestibulären Störungen — die Scroll-
   Einblendungen und Hover-Bewegungen entfallen dann, Inhalte bleiben sichtbar.
   ============================================================ */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  /* Scroll-Einblendungen dürfen nicht unsichtbar hängen bleiben */
  .reveal{opacity:1!important;transform:none!important}
}

/* ============================================================
   AppleInCookie-Banner im Fera-Design (S24)
   Das Plugin scoped alles unter .applein-cookie-root und stellt
   CSS-Custom-Properties zum Überschreiben bereit. Die doppelte
   Klasse gewinnt unabhängig von der Ladereihenfolge der Styles.
   ============================================================ */
.applein-cookie-root.applein-cookie-root{
  --ac-color-bg:#ffffff;
  --ac-color-text:var(--ink);
  --ac-color-text-light:var(--ink-soft);
  --ac-color-border:var(--line);
  --ac-color-primary:var(--flame);
  --ac-color-primary-hover:var(--flame-deep);
  --ac-color-ghost-bg:var(--sky);
  --ac-color-ghost-hover:#DCEBFB;
  --ac-radius:12px;
  --ac-shadow:0 16px 40px -18px rgba(11,58,87,.45);
  font-family:var(--sans);
}