/* rehamed konstanz GmbH · Webseite · AO Consulting GmbH
   Gestaltung 1:1 nach der bisherigen WordPress-Seite (gemessen am 04.11.2026),
   Technik nach AO-Standard: statisch, lokale Schriften, keine Dritten. */

@font-face{font-family:"PT Sans";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/pt-sans-400.woff2) format("woff2")}
@font-face{font-family:"PT Sans";font-style:normal;font-weight:700;font-display:swap;src:url(../fonts/pt-sans-700.woff2) format("woff2")}

:root{
  --dunkel:#3C5765;      /* Schrift, Akzent */
  --mittel:#768A92;      /* Kopf, Fuß */
  --hell:#9DABB1;
  --heller:#BAC4C8;
  --blau-grau:#99A8AE;
  --flaeche:#E0E4E7;
  --linie:#eee;
  --weiss:#fff;
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  /* Farben für das Barrierefreiheits-Widget */
  --coral:#3C5765;--navy:#3C5765;--navy-ink:#26383f;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;font-family:"PT Sans",Helvetica,Arial,sans-serif;font-size:1.125rem;line-height:1.5;color:var(--dunkel);background:var(--weiss);font-weight:400}
img{max-width:100%;height:auto;display:block}
picture{display:block}
a{color:var(--dunkel);text-decoration:none}
p{margin:0;padding-bottom:1em}
p:last-child{padding-bottom:0}
strong,b{font-weight:700}
h1,h2,h3,h4,h5,h6{font-family:"PT Sans",Helvetica,Arial,sans-serif;font-weight:700;color:var(--dunkel);margin:0;padding-bottom:10px;hyphens:manual}
h1{font-size:2.25rem;line-height:1.2}
h2{font-size:2.25rem;line-height:1.3}
h3{font-size:2.25rem;line-height:1.4}
h4{font-size:1.5rem;line-height:1.5}
h5{font-size:1.25rem;line-height:1.6}
input,textarea,select,button{font-family:inherit;font-size:16px}
a,button,[role="button"],label{touch-action:manipulation}
button,.knopf,[role="button"]{user-select:none;-webkit-user-select:none}
:focus-visible{outline:3px solid var(--dunkel);outline-offset:2px}
:focus:not(:focus-visible){outline:none}
.dunkel :focus-visible,.kopf :focus-visible,.fuss :focus-visible,.kachel:focus-visible,.kreis:focus-visible{outline-color:#fff}
.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}
.sprung{position:absolute;left:12px;top:-60px;z-index:1000;background:var(--dunkel);color:#fff;padding:10px 16px;font-weight:700;transition:top 160ms var(--ease-out)}
.sprung:focus{top:12px}

/* Raster wie Divi: Zeilen 80 % bzw. 90 % breit, höchstens 1500 px */
.wrap{width:90%;max-width:1500px;margin:0 auto}
.wrap80{width:80%;max-width:1500px;margin:0 auto}
.sek{padding:4vw 0}
.zeile{padding:2vw 0}

/* ---------- Seiteninhalt über dem Fuß (Fuß wird beim Scrollen aufgedeckt) ---------- */
.seite{position:relative;z-index:1;background:var(--weiss)}
.fuss{background:var(--mittel);color:#fff}
.js .fuss{position:fixed;left:0;right:0;bottom:0;z-index:0}

/* ---------- Kopf der Unterseiten ---------- */
.kopf{position:sticky;top:0;z-index:50;background:var(--mittel)}
.kopf-in{display:flex;align-items:flex-start;justify-content:space-between;margin:0 20px;min-height:43px;position:relative}
.menue{display:flex;gap:0;list-style:none;margin:0;padding:8px 0 0}
.menue li{margin-right:49px;white-space:nowrap}
.menue a{display:block;font-size:18px;font-weight:700;text-transform:uppercase;color:#fff;line-height:27px;padding-bottom:8px;transition:color 300ms ease}
.menue a[aria-current="page"]{color:var(--dunkel)}
.kopf-logo{margin-top:5px;width:7vw;min-width:72px}
.kopf-logo img{width:100%}
.burger{display:none}
.mobilmenue{display:none}

/* ---------- Seitenkopf mit Bildspalten (Unterseiten) ---------- */
.phero{display:grid;min-height:372px}
.phero .bild{position:relative;overflow:hidden;min-height:100%}
.phero .bild picture,.phero .bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phero .wort{background:var(--dunkel);padding:28px;display:flex}
.phero .wort.unten{padding:140px 28px 28px;align-items:flex-end}
.phero .wort.oben{padding:28px 28px 140px;align-items:flex-start}
.phero .wort h1,.phero .wort .wort-t{color:#fff;font-size:72px;line-height:.9;padding-bottom:10px;font-weight:700;margin:0}
.phero .flaeche{background:var(--mittel)}
.phero-praxis{grid-template-columns:40% 20% 40%}
.phero-therapie{grid-template-columns:60% 20% 20%}
.phero-4{grid-template-columns:20% 20% 40% 20%}

/* ---------- Kreis „Termin“ ---------- */
.kreis{display:flex;align-items:center;justify-content:center;flex-direction:column;width:250px;aspect-ratio:1;border-radius:50%;background:var(--dunkel);color:#fff;text-align:center;transition:transform 160ms var(--ease-out),background-color 160ms ease}
.kreis h2,.kreis .kreis-t{color:#fff;margin:0}
.kreis:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.kreis:hover{background:#2f4651}}

/* ================= STARTSEITE ================= */
.st-kopf{padding:0 0 5em}
.st-logo-zeile{width:90%;max-width:1500px;margin:0 auto;padding-top:1em;display:flex;justify-content:flex-end}
.st-logo-zeile img{width:210px}
.st-text{width:90%;max-width:1500px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr;column-gap:5.5%;position:relative}
.st-text h1{font-size:2.6vw;line-height:1.1;text-transform:uppercase;padding-bottom:10px}
.st-text .unter{font-size:23px;line-height:1.2;font-weight:400;padding-bottom:10px;margin:0}
.st-text .unter strong{display:block}
.st-text .kreis{position:absolute;top:115px;left:calc(66.66% + 5.5% / 3 * 2 + (33.33% - 5.5% / 3 * 2) / 2);transform:translateX(-50%);padding:75px 0}
.st-text .kreis .kreis-t{font-size:40px;line-height:1.1;font-weight:700;padding-bottom:10px}
.st-text .kreis:active{transform:translateX(-50%) scale(.97)}
.kacheln{display:grid;grid-template-columns:repeat(6,1fr);position:relative;z-index:0}
.kachel{position:relative;display:flex;align-items:flex-end;height:30vw;padding:30px 30px 46px;color:#fff;overflow:hidden;background-color:var(--k);background-size:cover;background-position:50% 50%}
.kachel .bg{position:absolute;inset:0}
.kachel .bg img{width:100%;height:100%;object-fit:cover}
.kachel .schleier{position:absolute;inset:0;background:rgba(118,138,146,.5)}
.kachel.voll .schleier{display:none}
.kachel span{position:relative;font-weight:700;font-size:5vw;line-height:1.1;color:#fff}
.kachel-m{display:none}
@media (hover:hover) and (pointer:fine){
  .kachel:hover .schleier{background:#768a92;display:block}
  .kachel.voll:hover{background-color:#768a92}
  .menue a:hover{color:var(--dunkel)}
  .kachel-m:hover .schleier{background:#768a92;display:block}
}
.st-fuss{padding:1em 0;text-align:center;text-transform:uppercase;font-size:15px;line-height:1.5}
.st-fuss a{color:#fff;transition:color 300ms ease}

/* ================= TEXT-BAUSTEINE ================= */
.einl p{padding-bottom:0}
.liste-titel{display:flex;align-items:flex-start;gap:5px}
.liste-titel img{width:40px;flex-shrink:0;margin-top:5px}
.liste-titel h2,.liste-titel h3{margin:0}
.blurbs{display:grid;grid-template-columns:repeat(5,1fr);column-gap:3%;padding:14px 0}
.blurb{padding:70px 7px;text-align:center;color:#fff}
.blurb h2{color:#fff;font-size:14.4px;line-height:1.6;text-transform:uppercase;padding-bottom:10px}
.blurb p{font-size:15px;line-height:1.5;color:#fff}
.knopf{display:inline-block;background:var(--dunkel);color:#fff;font-size:16px;padding:6px 14px;line-height:1.7;border:0;cursor:pointer;transition:background-color 160ms ease,transform 160ms var(--ease-out)}
.knopf:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){.knopf:hover{background:var(--mittel)}}

/* Neuigkeiten-Karussell (Praxis) */
.karussell{position:relative;padding:35px 30px}
.k-band{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;gap:50px}
.k-band::-webkit-scrollbar{display:none}
.k-folie{flex:0 0 100%;scroll-snap-align:start;display:grid;grid-template-columns:var(--sp,1fr 1fr);background:var(--dunkel);color:#fff;min-height:406px;box-shadow:0 12px 18px -6px rgba(0,0,0,.3)}
.k-folie .k-bild{position:relative;min-height:406px}
.k-folie .k-bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.k-folie .k-text{padding:0 70px 0 28px;display:flex;flex-direction:column;justify-content:center;text-align:center}
.k-folie h2{color:#fff;font-size:24px;line-height:1.5;text-transform:uppercase}
.k-folie p{color:#fff;font-size:18px;line-height:1.5}
.k-folie .k-link{display:inline-block;color:#fff;font-size:16px;font-weight:700;border:2px solid #fff;padding:4px 18px;margin:14px auto 0;transition:background-color 160ms ease,color 160ms ease}
@media (hover:hover) and (pointer:fine){.k-folie .k-link:hover{background:#fff;color:var(--dunkel)}}
.k-pfeil{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border:0;background:rgba(186,196,200,.85);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color 160ms ease}
.k-pfeil svg{width:26px;height:26px}
.k-zurueck{left:-72px}.k-weiter{right:-72px}
@media (hover:hover) and (pointer:fine){.k-pfeil:hover{background:var(--mittel)}}

/* Impressionen: laufendes Band */
.band{overflow:hidden;padding:0}
.band-spur{display:flex;gap:15px;width:max-content;animation:lauf 60s linear infinite}
.band-spur img{width:calc((100vw - 45px) / 4);height:auto;aspect-ratio:3/2;object-fit:cover}
@keyframes lauf{to{transform:translateX(calc(-50% - 7.5px))}}
.band:hover .band-spur,.band:focus-within .band-spur{animation-play-state:paused}
html.bf-ruhe .band-spur{animation:none}
@media (prefers-reduced-motion:reduce){.band-spur{animation:none}.band{overflow-x:auto}}

/* Bild + Text nebeneinander (volle Breite) */
.split{display:grid;grid-template-columns:1fr 1fr;column-gap:8%;align-items:stretch}
.split .s-bild{position:relative;min-height:300px}
.split .s-bild img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split .s-text.links{padding:42px 0 42px 144px;padding-left:10vw}
.split .s-text.rechts{padding:42px 10vw 42px 0}
.split .s-text.mitte{display:flex;flex-direction:column;justify-content:center}
.titel-icon{display:flex;gap:15px;align-items:flex-start}
.titel-icon img{width:32px;flex-shrink:0;margin-top:5px}
.titel-icon h2,.titel-icon h3{font-size:24px;line-height:1.5}

/* Graue Fläche */
.grau{background:var(--flaeche)}
.einzug{padding-left:10vw}

/* Therapieangebot: Kacheln */
.angebot{display:grid;grid-template-columns:repeat(5,1fr);column-gap:3%;row-gap:28px;padding:14px 0 0;list-style:none;margin:0}
.angebot li{background:var(--dunkel);color:#fff;text-align:center;font-size:15px;line-height:1.5;padding:15px 4px;min-height:53px;display:flex;align-items:center;justify-content:center}

/* Zwei Textspalten */
.zweispaltig{display:grid;grid-template-columns:1fr 1fr;column-gap:5.5%}

/* Prävention */
.praev{display:grid;grid-template-columns:666fr 423fr;column-gap:63px}
.praev .titel-icon h2{font-size:36px;line-height:1.4}
.praev .titel-icon img{width:40px}
.praev .block{margin-bottom:31px}
.termine h2{font-size:36px;line-height:1.4;padding-bottom:10px}
.termine h3{font-size:24px;line-height:1.5}
.termine .block{margin-bottom:18px}
.termine table{width:100%;border-collapse:collapse;border:1px solid var(--linie);margin:0 0 15px;font-size:18px;line-height:1.5}
.termine td{padding:6px 24px;border-top:1px solid var(--linie);vertical-align:top;width:50%}
.termine .kreis{padding:60px 0 50px;margin-top:18px}
.termine .kreis .kreis-t{font-size:20px;line-height:1.6;font-weight:700;padding-bottom:10px}

/* Team-Raster */
.team-raster{display:grid;grid-template-columns:repeat(4,1fr)}
.team-raster > *{aspect-ratio:1/1;position:relative;overflow:hidden}
.team-raster img{width:100%;height:100%;object-fit:cover}
.team-titel{background:var(--mittel);display:flex;align-items:center;padding:8% 12%}
.team-titel h2{color:#fff;font-size:clamp(3.2rem,6.5vw,6.5rem);line-height:.92;font-weight:700;margin:0;padding:0}
.team-karriere{background:var(--dunkel);display:flex;align-items:center;justify-content:center}
.team-karriere img{width:75%;height:75%;object-fit:contain}

/* Kontakt: Formulare */
.kontakt-kopf{display:grid;grid-template-columns:851fr 406fr;column-gap:39px}
.formular{font-size:16px}
.f-schritte{font-size:14px;margin-bottom:6px}
.f-balken{height:20px;background:var(--blau-grau);margin-bottom:24px;position:relative}
.f-balken span{display:block;height:100%;background:var(--dunkel);color:#fff;font-size:11px;text-align:right;padding-right:6px;line-height:20px;transition:width 300ms var(--ease-out)}
.f-reihe{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}
.f-feld{margin-bottom:20px;min-width:0}
.f-feld label,.f-legende{display:block;font-size:13px;font-style:italic;margin-bottom:6px;color:var(--dunkel)}
.pflicht{color:#f56c6c;margin-left:3px;font-style:normal}
.f-feld input[type=text],.f-feld input[type=email],.f-feld input[type=tel],.f-feld input[type=date],.f-feld select,.f-feld textarea{width:100%;border:1px solid var(--dunkel);border-radius:0;background:#fff;color:var(--dunkel);padding:8px 12px;min-height:42px;font-size:16px}
.f-feld textarea{min-height:100px;resize:vertical}
.f-feld input:focus,.f-feld select:focus,.f-feld textarea:focus{outline:2px solid var(--dunkel);outline-offset:0}
.f-feld input[type=file]{font-size:14px}
fieldset{border:0;padding:0;margin:0 0 20px;min-width:0}
.f-wahl{display:flex;flex-direction:column;gap:4px}
.f-wahl label{display:flex;gap:8px;align-items:center;font-size:14px;font-style:normal;margin:0;cursor:pointer;min-height:24px}
.f-wahl input{width:16px;height:16px;margin:0;accent-color:var(--dunkel)}
.f-tage{display:grid;grid-template-columns:repeat(5,1fr);column-gap:12px}
.f-tage fieldset[hidden]{display:none}
.f-text{font-size:16px;line-height:1.5;margin-bottom:20px}
.f-text h3{font-size:20px;line-height:1.6;text-transform:uppercase}
.f-text h4{font-size:16px;line-height:1.5;padding:0 0 4px}
.f-text ul{margin:0;padding-left:1.2em}
.f-einw label{display:flex;gap:8px;align-items:flex-start;font-size:15px;font-style:normal;cursor:pointer}
.f-einw input{margin-top:5px;width:16px;height:16px;flex-shrink:0;accent-color:var(--dunkel)}
.f-einw a{color:#7EBEC5}
.f-knoepfe{display:flex;justify-content:space-between;gap:12px;margin-top:10px}
.f-knoepfe .rechts{margin-left:auto}
.f-knopf-grau{background:var(--blau-grau)}
.f-knopf-senden{font-style:italic;font-weight:700;padding:8px 16px}
.f-meldung{margin-top:16px;padding:12px 16px;border-left:4px solid var(--dunkel);background:var(--flaeche)}
.f-meldung.fehler{border-color:#c0392b}
.f-meldung.ok{border-color:#2e7d32}
.honig{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Rechtstexte */
.recht .zurueck{margin-bottom:36px}
.recht h1{font-size:36px}
.recht h2{font-size:36px;line-height:1.3}
.recht h3{font-size:36px;line-height:1.4}
.recht h4{font-size:24px}
.recht a{text-decoration:underline}
.offen{background:#fff6c7;border-left:4px solid #e0b400;padding:10px 14px;margin:0 0 1em;font-size:16px}

/* ---------- Fuß der Unterseiten ---------- */
.fuss-in{width:90%;max-width:1500px;margin:0 auto;padding:1em 0;display:grid;grid-template-columns:20% 20% 45% 15%;font-size:15px;line-height:1.5;position:relative}
.fuss a{color:#fff;transition:color 300ms ease}
.fuss p{padding-bottom:15px}
.fuss-firma{position:absolute;top:1em;left:calc(10% - 6px);padding:0;margin:0}
.fuss-sp1{padding-top:50px}
.fuss-sp2{padding-top:50px;display:flex;flex-direction:column;justify-content:flex-end}
.fuss-links{padding-top:48px;text-align:right;text-transform:uppercase;margin:0}
.fuss-links span{margin:0 4px}
.fuss-sozial{padding-top:21px;display:flex;justify-content:center;align-items:flex-start}
.fuss-sozial a{display:flex;width:60px;height:60px;align-items:center;justify-content:center;border-radius:3px}
.fuss-sozial svg{width:30px;height:30px;fill:#fff}
@media (hover:hover) and (pointer:fine){.fuss a:hover,.st-fuss a:hover{color:#E0E4E7}.fuss-sozial a:hover svg{fill:#E0E4E7}}

/* ================= TABLET ≤ 980 px ================= */
@media (max-width:980px){
  .sek{padding:50px 0}
  .zeile{padding:30px 0}
  .st-kopf{padding:2em 0}
  .st-logo-zeile,.st-text .kreis,.kacheln{display:none}
  .st-text{grid-template-columns:1fr}
  .st-text h1{font-size:8.5vw}
  .st-text .unter{font-size:16px}
  .kachel-m{display:flex;height:30vw;padding:0 30px;align-items:center}
  .kachel-m span{font-size:12vw}
  .kacheln-m{display:block}
  .kopf-in{margin:0 10px;min-height:53px;align-items:center;justify-content:center;padding-top:21px}
  .menue{display:none}
  .kopf-logo{position:absolute;right:0;top:21px;margin:0;width:104px}
  .burger{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin-top:-12px;background:none;border:0;color:#fff;cursor:pointer;padding:0}
  .burger svg{width:30px;height:30px}
  .mobilmenue{background:var(--mittel);padding:14px 0 24px}
  .mobilmenue:not([hidden]){display:block}
  .mobilmenue ul{list-style:none;margin:0;padding:0;text-align:center}
  .mobilmenue a{display:block;color:#fff;font-size:16px;font-weight:700;line-height:26px;padding:5px 5%}
  .mobilmenue a[aria-current="page"]{color:var(--dunkel)}
  .phero,.phero-praxis,.phero-therapie,.phero-4{grid-template-columns:1fr 1fr;min-height:304px}
  .phero .nur-gross{display:none}
  .phero .wort,.phero .wort.oben,.phero .wort.unten{padding:140px 14px 28px;align-items:flex-end;order:1}
  .phero .bild-m{order:2}
  .phero .wort h1,.phero .wort .wort-t{font-size:46.8px}
  .blurbs{grid-template-columns:1fr;row-gap:30px}
  .blurb{padding:28px 7px}
  .blurb h2{font-size:15.6px}
  .angebot{grid-template-columns:1fr;row-gap:30px}
  .split,.zweispaltig,.praev,.kontakt-kopf{grid-template-columns:1fr}
  .split .s-text.links,.split .s-text.rechts{padding:42px 5%}
  .split .s-bild{min-height:56vw}
  .split .s-bild.zuerst{order:-1}
  .einzug{padding-left:5%}
  .team-raster{grid-template-columns:repeat(2,1fr)}
  .team-titel{grid-column:1/-1;aspect-ratio:auto!important;padding:40px 30px}
  .team-titel h2{font-size:clamp(3.5rem,11vw,6rem)}
  .k-folie{grid-template-columns:1fr!important}
  .k-folie .k-bild{min-height:60vw}
  .k-folie .k-text{padding:42px}
  .k-zurueck{left:0}.k-weiter{right:0}
  .karussell{padding:35px 0}
  .k-pfeil{top:30vw}
  .band-spur img{width:calc((100vw - 30px) / 3)}
  .fuss-in{grid-template-columns:1fr 1fr;row-gap:0}
  .fuss-firma{position:static;grid-column:1/-1}
  .fuss-sp1{padding-top:0}
  .fuss-sp2{padding-top:30px}
  .fuss-links{grid-column:1/-1;text-align:left;padding-top:20px}
  .fuss-sozial{grid-column:1/-1;justify-content:flex-start;padding-top:10px}
}

/* ================= HANDY ≤ 767 px ================= */
@media (max-width:767px){
  body{font-size:1rem}
  h1{font-size:20px;line-height:1.2}
  h2{font-size:20px;line-height:1.3}
  h3{font-size:18px;line-height:1.4}
  h4{font-size:18px;line-height:1.5}
  .st-kopf{padding:28px 0 14px}
  .st-text h1{font-size:8vw}
  .kachel-m{height:35vw}
  .kachel-m span{font-size:15vw}
  .angebot li{font-size:15px}
  .recht h1,.recht h2{font-size:20px}.recht h3{font-size:18px}.recht h4{font-size:18px}
  .praev .titel-icon h2,.termine h2{font-size:18px}
  .termine h3{font-size:18px}
  .termine table{font-size:16px}
  .k-folie h2{font-size:18px}
  .k-folie p{font-size:16px}
  .titel-icon h2,.titel-icon h3{font-size:18px}
  .f-reihe{grid-template-columns:1fr}
  .f-tage{grid-template-columns:1fr 1fr}
  .band-spur img{width:calc((100vw - 15px) / 2)}
  .fuss-in{grid-template-columns:1fr}
  .fuss-sp2{padding-top:30px}
}

/* ---------- Ergänzungen ---------- */
.h2{font-size:2.25rem;line-height:1.3}
.h3{font-size:2.25rem;line-height:1.4}
.h4{font-size:1.5rem;line-height:1.5}
.nur-klein-t{display:none}
.praxis-intro{display:grid;grid-template-columns:2fr 1fr;column-gap:5.5%;position:relative}
.praxis-intro .liste-titel{margin-top:36px}
.praxis-intro h1{font-size:36px;line-height:1.2}
.praxis-kreis{position:relative}
.praxis-kreis .kreis{position:absolute;left:50%;top:-199px;transform:translateX(-50%);padding:75px 0}
.praxis-kreis .kreis:active{transform:translateX(-50%) scale(.97)}
.praxis-kreis .kreis-t{font-size:20px;line-height:1.6;font-weight:700;padding-bottom:10px}
.praxis-neu{padding:42px 0}
.praxis-ort{padding:14px 0}
.praxis-ort .s-bild{min-height:301px}
.praxis-ort-2{padding-bottom:57px}
@media (max-width:980px){
  .praxis-intro{grid-template-columns:1fr}
  .praxis-kreis{display:none}
  .nur-gross-t{display:none}.nur-klein-t{display:inline}
  .praxis-intro h1{font-size:20px}
}
@media (max-width:767px){.h2,.h3{font-size:20px}.h3{font-size:18px}.h4{font-size:18px}}
.kachel .bg picture,.kachel .bg img{width:100%;height:100%}
.kachel .bg img{object-fit:cover}
.st-text .kreis{z-index:5}
.s-bild picture{position:absolute;inset:0}
.k-folie .k-bild picture{position:absolute;inset:0}
.phero .bild picture{position:absolute;inset:0}
.bf-knopf{background:#2266ff!important;color:#fff!important}
.st-kopf{padding-bottom:70px}
.angebot li{padding:3px 4px}
.praxis-intro .liste-titel{margin-top:24px}
@media (max-width:980px){.st-kopf{padding:28px 0 14px}}
.f-feld label,.f-legende{font-size:14px;line-height:1.7;margin-bottom:4px}
.f-feld input[type=text],.f-feld input[type=email],.f-feld input[type=tel],.f-feld select,.f-feld textarea{border-color:var(--mittel);padding:11px 15px;min-height:42px;color:#606266}
.f-feld input::placeholder,.f-feld textarea::placeholder{color:#a8abb2}
.f-feld input[type=file]::file-selector-button{background:var(--mittel);color:#fff;border:0;padding:8px 14px;margin-right:12px;font-family:inherit;font-size:14px;cursor:pointer}
.fuss-in>*{min-width:0}.fuss-links span{margin:0}
@media (max-width:980px){
  .split .s-bild.zuerst{order:2}
  .fuss-in{grid-template-columns:1fr;text-align:center}
  .fuss-sp2{justify-content:flex-start}
  .fuss-links{text-align:center}
  .fuss-sozial{justify-content:center}
}
.bf-panel:not([data-offen="true"]){box-shadow:none;visibility:hidden;transition:transform .3s cubic-bezier(.4,0,.2,1),visibility 0s .3s}
.k-zurueck{left:calc((100% - 100vw) / 2 + 3px)}.k-weiter{right:calc((100% - 100vw) / 2 + 20px)}@media (max-width:980px){.k-zurueck{left:0}.k-weiter{right:0}}
@media (min-width:768px) and (max-width:980px){.blurbs{grid-template-columns:1fr 1fr;column-gap:5.5%}}
@media (max-width:980px){.wrap80{width:90%}.termine td{padding:6px 12px}}

/* ===== Angleichung nach Messvergleich mit der bisherigen Seite (04.11.2026) ===== */
/* --- für alle Breiten --- */
.fuss-in{padding:14px 0}
.fuss p:last-child{padding-bottom:0}
.st-fuss{padding:14px 0}.st-fuss p{padding:0}
html.fuss-statisch .fuss{position:static}
.recht{min-height:100vh}
.recht .zurueck{margin-bottom:17px}
.team-titel h2{padding-bottom:10px}
.team-raster .team-karriere img{width:75%;height:75%;object-fit:contain}
.praev .titel-icon{gap:5px}
.praev .titel-icon h2{padding-bottom:10px}
.praev .block>.titel-icon{margin-bottom:15px}
.praxis-ort .titel-icon{margin-bottom:18px}
.termine>h2{margin-bottom:19px}
.termine .kreis{margin-top:34px}
.grau .split .s-text.links{padding-top:0;padding-bottom:0}
.wrap80{max-width:none}
.phero{min-height:0}
.praxis-imp .band{padding:30px 0}
.band-spur img{width:calc((100vw - 60px) / 4.15)}
.k-band{align-items:stretch}
.k-folie{min-height:0;grid-template-columns:var(--sp,1fr 1fr);column-gap:0}
.k-folie .k-bild{min-height:0}
.k-folie[style*="2fr 3fr"] .k-bild{aspect-ratio:var(--ar)}
.formular{padding:0 3px}
.f-schritte{margin:0 0 6px;line-height:23px;padding:0}
.f-balken{height:21px;margin-bottom:20px}
.f-feld label,.f-legende{line-height:24px;margin-bottom:5px}
p.f-legende{padding:0}
.f-feld input[type=text],.f-feld input[type=email],.f-feld input[type=tel]{height:40px;min-height:40px}
.f-feld select{height:42px}
.f-feld textarea{height:90px;min-height:90px}
.f-wahl{gap:5px}
.f-wahl label{min-height:24px}
.f-einw label{font-size:18px;line-height:1.5}
.f-einw a{color:rgb(173,216,230)}
.f-knopf-grau{font-size:13.33px;padding:8px 14px}
.kontakt-kopf p[style]{padding-top:2px!important}
.karte{position:relative;height:330px;background:#E0E4E7 linear-gradient(135deg,rgba(255,255,255,.35) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.35) 50%,rgba(255,255,255,.35) 75%,transparent 75%) 0 0/40px 40px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.karte iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.karte-in{background:rgba(255,255,255,.92);max-width:720px;margin:0 20px;padding:20px 24px;display:flex;gap:20px;align-items:center;font-size:14px;line-height:1.5}
.karte-in p{padding:0}
.karte-in a{text-decoration:underline}
.karte-knopf{flex-shrink:0}
.karte-adresse{position:absolute;left:0;bottom:0;margin:0;padding:6px 12px;background:var(--dunkel);color:#fff;font-size:14px}

/* --- Bildschirm ab 981 px --- */
@media (min-width:981px){
  h1.mod,h2.mod{margin-bottom:18px}
  .st-text,.praxis-intro{grid-template-columns:64.833% 29.667%;column-gap:5.5%}
  .phero .wort h1,.phero .wort .wort-t{font-size:5vw}
  .st-logo-zeile{padding-top:14px}
  .kachel{padding-bottom:59px}
  .praxis-intro .liste-titel{margin-top:20px}
  .praxis-1 .blurbs{padding-top:28px}
  .praxis-ort{margin-top:56px}
  .praxis-ort-2{margin-top:17px}
  .blurb h2{font-size:1vw;line-height:1.6}
  #allgemein{margin-top:19px}
}


/* --- Tablet und Handy bis 980 px --- */
@media (max-width:980px){
  body{font-size:1rem}
  h1,h2,.h2{font-size:24px}
  .phero .wort h1,.phero .wort .wort-t{font-size:10vw;line-height:.9}
  .blurb h2{font-size:2vw}
  .grau .split .s-text.links{padding:0 5% 30px}
  .grau .split .s-bild,.s-bild[style]{min-height:56vw!important}
  .k-folie .k-bild{aspect-ratio:var(--ar)}
  .band-spur img{width:calc((100vw - 45px) / 3.2)}
  .karte-in{flex-direction:column;align-items:flex-start}
  .kachel-m{padding-bottom:0}
}
/* --- Handy bis 767 px --- */
@media (max-width:767px){
  h1,h2,.h2{font-size:20px}
  .phero .wort h1,.phero .wort .wort-t{font-size:12vw}
  .blurb h2{font-size:4vw}
  .praxis-intro .liste-titel{margin-top:30px}
  .band-spur img{width:calc((100vw - 15px) / 2)}
}
@media (max-width:980px){
  .kopf-in{min-height:70px;padding-bottom:17px}
  .st-kopf{padding-bottom:59px}
  .fuss-firma{padding-bottom:17px!important}
  .fuss-links{padding-top:47px}
}
@media (max-width:767px){.st-kopf{padding-bottom:45px}}
.praxis-1{padding-top:28px;padding-bottom:0}
@media (max-width:980px){.praxis-1{padding-top:14px}}
@media (max-width:767px){
  .kachel-m{align-items:flex-start;padding-top:14px}
  .praxis-intro .liste-titel{margin-top:15px}
  .praxis-1 .blurbs{padding-top:45px}
  .fuss-sozial{padding-bottom:18px}
}
@media (max-width:980px){
  .fuss-firma{padding-bottom:30px!important}
  .kontakt-kopf>div+div{margin-top:30px}
  .kontakt-kopf p[style]{padding-top:14px!important}
  #allgemein{margin-top:18px}
  h1.mod,h2.mod{margin-bottom:16px}
  .zweispaltig{row-gap:30px}
}
@media (max-width:767px){.f-einw label{font-size:16px}}
.therapie-1{padding-top:28px}
@media (max-width:980px){
  .therapie-1{padding-top:14px}
  .fuss-sozial{padding-bottom:65px}
  .k-folie h2,.titel-icon h2,.titel-icon h3{font-size:20px}
  .k-folie p{font-size:16px}
  .praxis-intro h1{font-size:24px}
  .h4{font-size:20px}
  .praxis-1 .blurbs{padding-top:60px;row-gap:58px}
  .team-einl{padding-bottom:6px}
}
@media (max-width:767px){
  .fuss-sozial{padding-bottom:5px}
  .praxis-intro h1{font-size:20px}
  .k-folie h2,.titel-icon h2,.titel-icon h3{font-size:18px}
  .h4{font-size:18px}
  .praxis-1 .blurbs{padding-top:45px;row-gap:30px}
  .team-einl{padding-bottom:30px}
  .team-einl h1{letter-spacing:-.2px}
}
/* Kopfzeile: Handy-Menü bis 1200 px (wie bisher, Divi-Pixel-Umschaltpunkt) */
@media (max-width:1200px){
  .kopf-in{margin:0 10px;min-height:70px;align-items:center;justify-content:center;padding-top:21px;padding-bottom:17px}
  .menue{display:none}
  .kopf-logo{position:absolute;right:0;top:21px;margin:0;width:104px}
  .burger{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin-top:-12px;background:none;border:0;color:#fff;cursor:pointer;padding:0}
  .burger svg{width:30px;height:30px}
  .mobilmenue{background:var(--mittel);padding:14px 0 24px}
  .mobilmenue:not([hidden]){display:block}
  .mobilmenue ul{list-style:none;margin:0;padding:0;text-align:center}
  .mobilmenue a{display:block;color:#fff;font-size:16px;font-weight:700;line-height:26px;padding:5px 5%}
  .mobilmenue a[aria-current="page"]{color:var(--dunkel)}
}
@media (max-width:980px){.karussell{padding:35px 30px}.k-zurueck{left:-30px}.k-weiter{right:-30px}.k-pfeil{width:30px;height:44px}}
@media (max-width:767px){.k-zurueck{left:-19px}.k-weiter{right:-19px}}
@media (max-width:767px){.praxis-1 .blurbs{padding-top:60px}.termine .kreis .kreis-t{font-size:16px;line-height:1.6}}
@media (min-width:768px) and (max-width:980px){
  .recht h3,.praev .titel-icon h2,.termine>h2{font-size:22px;line-height:1.4}
  .termine h3{font-size:20px}
  .termine .kreis .kreis-t{font-size:18px}
  .termine table{font-size:16px}
}
@media (max-width:767px){.k-zurueck{left:-5vw}.k-weiter{right:-5vw}}
@media (max-width:980px){.k-folie{grid-template-columns:minmax(0,1fr)!important}.k-folie .k-text{min-width:0;overflow-wrap:break-word}}
.recht p,.recht a{overflow-wrap:anywhere}

/* ===== Angleichung an die alte Seite, 09.11.2026 (unabhängiger Vergleich, 30 Punkte) ===== */
/* 1 · Schriftglättung wie Divi */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
/* 2 · „Fett“ im Fließtext, Menü, Fuß und „Absenden“ wie bisher: normaler Schnitt, vom Browser verstärkt (gleiche Datei, kein Zusatzdownload) */
@font-face{font-family:"PT Sans Normal";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/pt-sans-400.woff2) format("woff2")}
strong,b,.menue a,.f-knopf-senden{font-family:"PT Sans Normal","PT Sans",Helvetica,Arial,sans-serif;font-weight:600}
h1 strong,h2 strong,h3 strong,h4 strong,.h2 strong,.h3 strong,.h4 strong,.wort-t strong,.kreis strong{font-family:inherit;font-weight:700}
/* 3 · Kopf: am Desktop scrollt er mit weg; auf Tablet/Handy fest, Logo wird beim Scrollen kleiner */
@media (min-width:1201px){.kopf{position:relative}}
@media (max-width:1200px){
  .kopf-logo{transition:width .4s ease}
  html.gescrollt .kopf-logo{width:71px}
}
/* 4 · Handy-Menü als Vollbild-Ebene in Dunkelpetrol mit X */
@media (max-width:1200px){
  .burger{position:relative;z-index:3}
  .burger .l1,.burger .l2,.burger .l3{transform-box:view-box;transform-origin:12px 12px;transition:transform .3s ease,opacity .2s ease}
  .burger[aria-expanded="true"] .l1{transform:rotate(45deg) translateY(5px)}
  .burger[aria-expanded="true"] .l2{opacity:0}
  .burger[aria-expanded="true"] .l3{transform:rotate(-45deg) translateY(-5px)}
  .mobilmenue{display:block;position:fixed;inset:0;z-index:2;background:var(--dunkel);padding:114px 0 40px;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility 0s linear .4s}
  .mobilmenue.auf{opacity:1;visibility:visible;transition:opacity .4s ease}
  .mobilmenue[hidden]{display:none}
  .mobilmenue ul{list-style:none;margin:0;padding:0;text-align:center}
  .mobilmenue a{display:block;color:#fff;font-family:"PT Sans Normal","PT Sans",sans-serif;font-size:16px;font-weight:400;line-height:26px;padding:5px 5%}
  .mobilmenue a[aria-current="page"]{color:#fff}
  html.menue-offen{overflow:hidden}
}
@media (hover:hover) and (pointer:fine){.mobilmenue a:hover{opacity:.7}}
/* 5 · „Nach oben“-Knopf (wie Divi) */
.nach-oben{position:fixed;right:0;bottom:125px;z-index:40;display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:rgba(0,0,0,.4);color:#fff;border-radius:5px 0 0 5px;opacity:0;visibility:hidden;transition:opacity .4s ease,visibility 0s linear .4s}
.nach-oben.sichtbar{opacity:1;visibility:visible;transition:opacity .4s ease}
.nach-oben svg{width:30px;height:30px}
.nach-oben:focus-visible{outline:2px solid #fff;outline-offset:-4px}
@media (hover:hover) and (pointer:fine){.nach-oben:hover{background:rgba(0,0,0,.6)}}
/* 6 · Fuß: Instagram direkt neben den Links */
@media (min-width:981px){.fuss-sozial{justify-content:flex-start}}
/* 7 · Kleine Knöpfe */
.knopf{padding:.3em 1em}
.f-knopf-grau{padding:8px 14px}.f-knopf-senden{padding:8px 16px}
/* 8 · Startseite: Umbruch nach „Zentrum“ nur auf Tablet/Handy */
.nur-mobil{display:none}
@media (max-width:980px){.nur-mobil{display:inline}}
/* 10–13 · Karussell */
.k-folie{box-shadow:0 12px 31px -6px rgba(21,2,42,.16);align-items:start}
.k-folie .k-bild{aspect-ratio:var(--ar);min-height:0}
.k-folie .k-text{align-self:stretch}
.k-folie .k-link{font-weight:400;line-height:27px}
/* 15 · Team: eigene Überschrift auf Tablet/Handy */
.nur-mobil-b{display:none}
@media (max-width:980px){.nur-desktop{display:none}.nur-mobil-b{display:inline}}
@media (min-width:768px) and (max-width:980px){.kein-tablet{display:none}}
/* 16/17 · Graue Abschnitte: Bild so hoch wie der Text daneben */
@media (min-width:981px){
  .grau .split .s-bild{min-height:0}
  .grau.eap .split .s-text.links{padding-bottom:54px}
}
/* 18–19 · Prävention */
.termine table{table-layout:fixed}
.termine td{padding:6px 24px}
.termine .kreis .kreis-t{width:100%}
@media (max-width:767px){
  .termine .kreis{width:calc(100% - 135px);aspect-ratio:auto;border-radius:100%;padding:60px 0 50px;margin-left:0;margin-right:auto;align-self:flex-start}
}
/* 21–24 · Kontaktformular */
.pflicht{margin-left:0}
.f-wahl label{line-height:24px}
.f-datei .datei-knopf{display:inline-block;background:#6f757e;color:#fff;font-size:14px;font-style:normal;line-height:23.8px;padding:10px 20px;margin:0;cursor:pointer;transition:background-color 160ms ease}
@media (hover:hover) and (pointer:fine){.f-datei .datei-knopf:hover{background:#5a6068}}
.f-datei input:focus-visible+.datei-knopf{outline:2px solid var(--dunkel);outline-offset:2px}
.f-datei .datei-knopf{vertical-align:top}
.f-datei .datei-name{display:block;font-size:12px;margin-top:15px;min-height:1px}
/* 25 · Karten-Platzhalter wie bisher (weichgezeichnetes Kartenbild liegt lokal, lädt nichts von Google) */
.karte{height:auto;min-height:330px;background:#fafafa url(../img/karte-platzhalter-weichgezeichnet.webp) center/cover no-repeat;border-radius:4px;display:flex;align-items:center;padding:96px 0;box-sizing:border-box;color:#555;font-size:14px;line-height:17.5px;text-align:center}
.karte.geladen{padding:0;height:330px}
.karte-in{position:relative;display:flex;flex-direction:row;align-items:center;gap:16px;width:100%;max-width:none;margin:0;padding:16px;background:rgba(250,250,250,.85);font-size:14px;line-height:17.5px;box-sizing:border-box}
.karte-text{flex:0 0 calc(66.666% - 8px)}
.karte-text p{padding:0 0 16px;font-size:14px;line-height:17.5px;color:#555}
.karte-text p+p{padding:0}
.karte-in a{color:#2563eb;text-decoration:none}
.karte-knoepfe{flex:1;display:flex;flex-direction:column;gap:16px}
.karte-knopf{display:flex;align-items:center;justify-content:center;width:100%;padding:12px 20px;border:0;border-radius:3px;background:#4285f4;color:#fff;font:600 14px/21px "PT Sans Normal","PT Sans",sans-serif;cursor:pointer;transition:background-color .4s cubic-bezier(.4,0,.2,1)}
@media (hover:hover) and (pointer:fine){.karte-knopf:hover{background:#2f6fd8}}
@media (max-width:639px){
  .karte{padding:0;min-height:317px}
  .karte-in{flex-direction:column;align-items:stretch;gap:8px;margin:6%;width:auto}
  .karte-text p{padding-bottom:8px}
}
/* 27 · Tablet: „Allgemeines Anliegen“ und Einwilligung */
@media (min-width:768px) and (max-width:980px){
  .kontakt-kopf .h3{font-size:22px}
  .f-einw label{font-size:16px}
/* 29 · Tablet: Überschriften Impressum/Gleichstellung */
  .recht h1,.recht h2{font-size:24px}
}
/* 22 · Abstand Checkbox – Text wie bisher; 26 · Handy/Tablet: Abstand vor dem allgemeinen Formular */
.f-einw label{gap:5px}
.f-einw input{margin:5px 0 0}
@media (max-width:980px){#allgemein-form{padding-top:32px}}
.karte{margin-top:22px}
@media (max-width:767px){.karte{width:100vw;margin-left:calc(50% - 50vw);min-height:0;border-radius:4px}.karte-in{margin:6%}}
@media (max-width:639px){.karte-knoepfe{gap:8px}}
@media (max-width:767px){.praev .block>.titel-icon{margin-bottom:6px}.praev>div:first-child>.block:first-child{margin-top:4px}}
@media (min-width:768px) and (max-width:980px){.team-einl{padding-bottom:30px}}
/* 12 · Karussell am Desktop: Spalten wie Divi (Bild 48,5 % bzw. 38,2 %, Abstand 3 %), Bild in Originalform */
@media (min-width:981px){
  .k-folie{grid-template-columns:48.5% 48.5%;column-gap:3%}
  .k-folie[style*="2fr 3fr"]{grid-template-columns:38.2% 58.8%}
}
@media (min-width:981px){.praxis-ort .s-bild{min-height:0}}
@media (min-width:981px){.praxis-ort .s-text.links,.praxis-ort .s-text.rechts{padding-top:78px;padding-bottom:42px}}
.praxis-ort-2 .titel-icon img{width:25.6px;margin-bottom:-30px}
@media (min-width:981px){.praxis-ort,.praxis-ort-2{margin-top:calc(3px + 1.79vw)}}
.k-band{align-items:flex-start}
.k-band{scroll-behavior:auto}
@media (min-width:981px){.trena .split .s-bild{min-height:0}.trena .split .s-text.rechts{padding-bottom:54px}}
@media (min-width:981px){.angebot{grid-template-columns:repeat(5,minmax(0,1fr))}.angebot li{overflow-wrap:anywhere;hyphens:manual}}
@media (min-width:981px){.angebot li{padding:15px 0;min-height:0}}
@media (min-width:981px){.angebot{margin-bottom:-11px}}

/* Unterschriftsfeld (wie bisher bei Fluent Forms) */
.f-unterschrift .unterschrift-feld{display:block;width:100%;height:160px;background:#fff;border:1px solid var(--mittel);touch-action:none;cursor:crosshair}
.f-unterschrift .unterschrift-leiste{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:6px;font-size:13px;color:#606266}
.f-unterschrift .unterschrift-loeschen{background:none;border:0;padding:4px 0;font:inherit;font-size:13px;color:var(--dunkel);text-decoration:underline;cursor:pointer;white-space:nowrap}
.f-unterschrift .unterschrift-loeschen:focus-visible{outline:2px solid var(--dunkel);outline-offset:2px}
.f-unterschrift .unterschrift-feld[aria-invalid=true]{border-color:#c0392b;box-shadow:0 0 0 1px #c0392b}
