/*
Theme Name: Psychologin Marina
Theme URI: https://psychologin-marina.de
Description: Editorial-Warmth-Theme für die Praxis Maryna Ariefieva-Dobrovolska. Child-Theme von Astra. Farbwelt aus dem Logo der Praxis abgeleitet, WCAG-geprüft.
Author: Miliienko Studio
Author URI: https://webseiteerstellen.eu
Template: astra
Version: 1.0.1
Text Domain: psychologin-marina
*/

/* ==========================================================================
   1. Tokens — siehe design-system/MASTER.md. Rohe Hex-Werte ab hier verboten.
   ========================================================================== */
:root{
  --c-bg:#FAF7F1;
  --c-surface:#F1EBE0;
  --c-surface-2:#E7DFD1;
  --c-ink:#121B1E;          /* Vorlage: Überschrift, 15.53:1 */
  --c-ink-soft:#585C57;
  --c-sage:#5C7360;
  --c-sage-deep:#3F5945;    /* Vorlage: Akzent & Knopf, 6.84:1 / weiß darauf 7.70:1 */
  --c-sage-mist:#A6B0A2;
  --c-rose:#B4746A;
  --c-rose-soft:#C9A79F;
  --c-focus:#3F5244;

  --f-head:"Literata",Georgia,"Times New Roman",serif;
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;

  --s-1:.5rem; --s-2:1rem; --s-3:1.5rem; --s-4:2rem;
  --s-5:3rem;  --s-6:4rem; --s-7:6rem;   --s-8:8rem;

  --measure:68ch;
  --wrap:1140px;
  --radius:14px;
  --radius-pill:999px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ==========================================================================
   2. Reset / Grundlagen
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

body,
.ast-container,
.site{
  background:var(--c-bg);
  color:var(--c-ink);
  font-family:var(--f-body);
  font-size:1.0625rem;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,.pm-display{
  font-family:var(--f-head);
  font-weight:300;
  color:var(--c-ink);
  letter-spacing:-.02em;
}
h1{font-size:clamp(2.3rem,5.4vw,4.1rem);line-height:1.06;letter-spacing:-.03em;margin:0 0 var(--s-3)}
h2{font-size:clamp(1.75rem,3.6vw,2.7rem);line-height:1.18;letter-spacing:-.022em;margin:0 0 var(--s-3)}
h3{font-family:var(--f-body);font-weight:600;font-size:1.25rem;line-height:1.4;letter-spacing:0;margin:0 0 var(--s-2)}

p{margin:0 0 var(--s-3);max-width:var(--measure)}
.pm-lead{font-size:1.2rem;line-height:1.7;color:var(--c-ink-soft);max-width:var(--measure)}

a{color:var(--c-sage);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--c-sage-deep)}

:where(a,button,input,textarea,select,summary):focus-visible{
  outline:2px solid var(--c-focus);
  outline-offset:3px;
  border-radius:2px;
}

img{max-width:100%;height:auto;display:block}

/* ==========================================================================
   3. Layout
   ========================================================================== */
.pm-wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(1rem,4vw,2rem)}
.pm-section{padding-block:clamp(var(--s-5),8vw,var(--s-7))}
.pm-section--tint{background:var(--c-surface)}
.pm-narrow{max-width:760px}

.pm-grid{display:grid;gap:var(--s-4)}
@media(min-width:760px){
  .pm-grid--2{grid-template-columns:repeat(2,1fr)}
  .pm-grid--3{grid-template-columns:repeat(3,1fr)}
}

/* ==========================================================================
   4. Buttons — weiß nur auf sage-deep/ink (Kontrast geprüft)
   ========================================================================== */
.pm-btn{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--f-body);font-size:1rem;font-weight:500;line-height:1;
  padding:.95rem 1.6rem;border-radius:var(--radius);
  border:1px solid transparent;cursor:pointer;
  text-decoration:none;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);
}
.pm-btn--primary{background:var(--c-sage-deep);color:#fff}
.pm-btn--primary:hover{background:var(--c-ink);color:#fff}
.pm-btn--ghost{background:transparent;color:var(--c-sage-deep);border-color:var(--c-sage-mist)}
.pm-btn--ghost:hover{background:var(--c-surface);color:var(--c-sage-deep);border-color:var(--c-sage)}

/* ==========================================================================
   5. Kopfbereich
   ========================================================================== */
.pm-header{
  position:sticky;top:0;z-index:100;
  background:color-mix(in srgb,var(--c-bg) 92%,transparent);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--c-surface-2);
}
.pm-header__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);min-height:72px}
.pm-brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--c-ink)}
.pm-brand__mark{width:38px;height:38px;flex:none}
.pm-brand__name{font-family:var(--f-head);font-size:1.02rem;line-height:1.15;letter-spacing:-.01em}
.pm-brand__role{display:block;font-family:var(--f-body);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--c-ink-soft)}

.pm-nav{display:flex;align-items:center;gap:var(--s-3)}
.pm-nav a{font-size:.97rem;color:var(--c-ink);text-decoration:none}
.pm-nav a:hover,.pm-nav a[aria-current="page"]{color:var(--c-sage-deep);text-decoration:underline}

/* Sprachumschalter — Text, keine Flaggen (siehe MASTER.md) */
.pm-lang{display:flex;align-items:center;gap:.35rem;font-size:.85rem;letter-spacing:.04em}
.pm-lang a{color:var(--c-ink-soft);text-decoration:none;padding:.2rem .35rem;border-radius:2px}
.pm-lang a[aria-current="true"]{color:var(--c-ink);font-weight:600;background:var(--c-surface)}
.pm-lang span{color:var(--c-surface-2)}

.pm-burger{display:none;background:none;border:0;padding:.5rem;color:var(--c-ink)}
@media(max-width:880px){
  .pm-burger{display:block}
  .pm-nav{
    position:fixed;inset:72px 0 auto;flex-direction:column;align-items:flex-start;
    gap:var(--s-2);background:var(--c-bg);padding:var(--s-4) clamp(1rem,5vw,2rem) var(--s-5);
    border-bottom:1px solid var(--c-surface-2);
    transform:translateY(-12px);opacity:0;pointer-events:none;
    transition:opacity .25s var(--ease),transform .25s var(--ease);
  }
  .pm-nav[data-open="true"]{transform:none;opacity:1;pointer-events:auto}
  .pm-nav a{font-size:1.1rem}
}

/* ==========================================================================
   6. Hero — nach der Bildvorlage von Alexander.
   Das Motiv bringt alles mit: Cremefläche links für den Text, sie rechts im
   Sessel, Blattschatten, Zitat. Deshalb hier keine zusätzlichen Masken oder
   Verläufe über dem Bild — jede weitere Lage würde die Vorlage verfälschen.
   ========================================================================== */
.pm-hero{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--c-bg);
  /* Nie hochformatiger als die Vorlage (1672x941), sonst schneidet cover
     genau die helle Textfläche links weg. */
  /* Höhe folgt der Vorlage, darf aber wachsen, wenn der Text mehr braucht —
     sonst rutscht die erste Zeile unter die Kopfleiste. */
  margin-top:-72px;                 /* Leiste schwebt über dem Motiv */
  min-height:min(100svh,calc(100vw / 1.777));
  display:flex;align-items:center;
  padding-block:clamp(5rem,9vw,7rem) clamp(2rem,4vw,3rem);
}
.pm-hero__bg{position:absolute;inset:0;z-index:0}
.pm-hero__bg img{
  width:100%;height:100%;object-fit:cover;object-position:100% 46%;
  animation:pm-hero-bg 2s var(--ease-out-expo) both;
}
@keyframes pm-hero-bg{from{opacity:0;transform:scale(1.035)}to{opacity:1;transform:none}}

.pm-hero__inner{position:relative;z-index:2;width:100%;max-width:var(--wrap)}
.pm-hero__inner > *{max-width:min(46%,620px)}

.pm-hero__kicker{
  font-size:.72rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;
  color:var(--c-ink-soft);margin:0 0 var(--s-3);
}
.pm-hero h1{
  max-width:min(50%,640px);margin-bottom:var(--s-2);
  font-size:clamp(2rem,3.5vw,3.15rem);line-height:1.08;
}
.pm-hero h1 i{font-style:italic;color:var(--c-sage-deep)}   /* Vorlage: ganze Zeile grün */
.pm-hero h1 em{font-style:italic;color:var(--c-sage-deep)}  /* "funktionieren" — betont */
.pm-hero .pm-lead{color:var(--c-ink);max-width:min(42%,520px);font-size:clamp(.98rem,1.15vw,1.08rem);line-height:1.6;margin-bottom:0}
.pm-hero__actions{display:flex;flex-wrap:wrap;gap:var(--s-2);margin-top:var(--s-3)}

/* Drei Zusagen unter den Knöpfen */
.pm-usp{
  list-style:none;margin:var(--s-4) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-3);
  max-width:min(48%,600px);
}
.pm-usp li{display:flex;flex-direction:column;gap:.35rem}
.pm-usp__icon{
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--c-sage-mist) 34%,transparent);
  color:var(--c-sage-deep);margin-bottom:.35rem;
}
.pm-usp strong{font-size:.98rem;font-weight:600;color:var(--c-ink)}
.pm-usp span:last-child{font-size:.82rem;color:var(--c-ink-soft);line-height:1.45}

/* Handschriftliche Zeile wie in der Vorlage */
.pm-script{
  font-family:"Caveat",cursive;font-size:clamp(1.3rem,2vw,1.7rem);
  color:var(--c-sage-deep);margin:var(--s-3) 0 0;max-width:none;
  position:relative;display:inline-block;padding-bottom:.45rem;
}
.pm-script::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0;
  background:var(--c-rose-soft);border-radius:2px;
  animation:pm-script-line 1.2s var(--ease-out-expo) 1.5s forwards;
}
@keyframes pm-script-line{to{width:62%}}

/* ---- schmalere Fenster ---- */
@media(max-width:1100px){
  .pm-hero__inner > *{max-width:min(54%,560px)}
  .pm-hero h1{max-width:min(58%,560px)}
  .pm-hero .pm-lead{max-width:min(52%,520px)}
  .pm-usp{max-width:min(58%,560px);gap:var(--s-2)}
}
@media(max-width:860px){
  .pm-hero{min-height:0;padding-block:0;display:block}
  .pm-hero__bg{position:relative;display:block;aspect-ratio:3/4;max-height:58svh}
  .pm-hero__bg img{object-position:52% 26%}
  .pm-hero__inner{padding-block:var(--s-5) var(--s-6)}
  .pm-hero__inner > *,
  .pm-hero h1,
  .pm-hero .pm-lead,
  .pm-usp{max-width:none}
  .pm-usp{grid-template-columns:1fr;gap:var(--s-3)}
  .pm-usp li{flex-direction:row;align-items:flex-start;gap:var(--s-2)}
  .pm-usp__icon{margin:0;flex:none;width:42px;height:42px}
  .pm-usp li > span:last-child{display:block}
}

/* Qualifikation direkt am Porträt — ersetzt in DACH die Bewertungen */
.pm-cred{margin-top:var(--s-4);padding-top:var(--s-3);border-top:1px solid var(--c-surface-2);max-width:var(--measure)}
.pm-cred li{list-style:none;font-size:.95rem;color:var(--c-ink-soft);padding-left:1.1rem;position:relative;margin-bottom:.4rem}
.pm-cred li::before{
  content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;
  background:var(--c-sage-mist);border-radius:50%;
}
.pm-cred ul{margin:0;padding:0}

/* ==========================================================================
   7. Karten (Angebote, Themen)
   ========================================================================== */
.pm-card{
  background:var(--c-bg);border:0;
  border-radius:var(--radius);padding:clamp(1.75rem,3vw,2.6rem);
  display:flex;flex-direction:column;
  transition:background .3s var(--ease);
}
.pm-section--tint .pm-card{background:var(--c-bg)}
.pm-section--tint .pm-card:hover{background:color-mix(in srgb,var(--c-sage-mist) 22%,var(--c-bg))}
.pm-card:hover{background:color-mix(in srgb,var(--c-sage-mist) 16%,var(--c-bg))}
.pm-card p{max-width:none}
.pm-card__price{font-family:var(--f-head);font-size:1.6rem;color:var(--c-sage-deep);margin:0 0 .15rem}
.pm-card__unit{font-size:.88rem;color:var(--c-ink-soft);margin:0 0 var(--s-3)}
.pm-card__list{margin:0 0 var(--s-3);padding:0;list-style:none}
.pm-card__list li{position:relative;padding-left:1.2rem;font-size:.95rem;color:var(--c-ink-soft);margin-bottom:.35rem}
.pm-card__list li::before{
  content:"";position:absolute;left:0;top:.65em;width:6px;height:1px;background:var(--c-sage-mist);
}
.pm-card .pm-btn{margin-top:auto;align-self:flex-start}

/* Themenliste — nummeriert statt Kachelbrei */
.pm-topics{list-style:none;margin:0;padding:0;border-top:1px solid var(--c-surface-2)}
.pm-topics li{border-bottom:1px solid var(--c-surface-2)}
.pm-topics a{
  display:flex;align-items:baseline;gap:var(--s-3);
  padding:1.15rem .25rem;text-decoration:none;color:var(--c-ink);
  transition:padding-left .25s var(--ease),color .25s var(--ease);
}
.pm-topics a:hover{padding-left:.6rem;color:var(--c-sage-deep)}
.pm-topics__nr{font-family:var(--f-head);font-size:.85rem;color:var(--c-sage-mist);min-width:2ch}
.pm-topics__txt{font-size:1.08rem}

/* ==========================================================================
   8. Ablauf in Schritten — senkt die Unsicherheit vor dem Erstkontakt
   ========================================================================== */
.pm-steps{counter-reset:step;display:grid;gap:var(--s-4)}
@media(min-width:760px){.pm-steps{grid-template-columns:repeat(3,1fr);gap:var(--s-5)}}
.pm-step{counter-increment:step;position:relative;padding-top:var(--s-4)}
.pm-step::before{
  content:counter(step,decimal-leading-zero);
  position:absolute;top:0;left:0;
  font-family:var(--f-head);font-size:.9rem;color:var(--c-rose);
}
.pm-step h3{margin-bottom:.4rem}
.pm-step p{font-size:.98rem;color:var(--c-ink-soft);max-width:none;margin:0}

/* ==========================================================================
   9. Zertifikate
   ========================================================================== */
.pm-certs{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--s-2)}
.pm-certs img{
  border:1px solid var(--c-surface-2);border-radius:2px;
  aspect-ratio:3/4;object-fit:cover;background:var(--c-surface);
  transition:transform .25s var(--ease);
}
.pm-certs a:hover img{transform:scale(1.02)}

/* ==========================================================================
   10. Zitat — ohne Anführungszeichen-Kitsch auf Farbverlauf
   ========================================================================== */
.pm-quote{
  border-left:2px solid var(--c-rose-soft);
  padding-left:var(--s-3);
  font-family:var(--f-head);font-size:clamp(1.25rem,2.6vw,1.7rem);
  line-height:1.45;color:var(--c-ink);max-width:60ch;
}
.pm-quote cite{display:block;margin-top:var(--s-2);font-family:var(--f-body);font-style:normal;font-size:.9rem;color:var(--c-ink-soft)}

/* ==========================================================================
   11. Kontakt
   ========================================================================== */
.pm-contact__item{margin-bottom:var(--s-3)}
.pm-contact__label{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--c-ink-soft);margin:0 0 .2rem}
.pm-contact__value{font-size:1.05rem;margin:0}
.pm-contact__value a{color:var(--c-ink);text-decoration:none;border-bottom:1px solid var(--c-sage-mist)}
.pm-contact__value a:hover{color:var(--c-sage-deep);border-color:var(--c-sage)}

.pm-note{
  background:var(--c-surface);border-radius:var(--radius);
  padding:var(--s-3);font-size:.95rem;color:var(--c-ink-soft);max-width:var(--measure);
}

/* ==========================================================================
   12. Fußbereich
   ========================================================================== */
.pm-footer{background:var(--c-ink);color:#E9E6DF;padding-block:var(--s-6) var(--s-4);margin-top:var(--s-7)}
.pm-footer a{color:#E9E6DF;text-decoration:none}
.pm-footer a:hover{color:#fff;text-decoration:underline}
.pm-footer h4{font-family:var(--f-body);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c-sage-mist);margin:0 0 var(--s-2);font-weight:500}
.pm-footer ul{list-style:none;margin:0;padding:0}
.pm-footer li{margin-bottom:.45rem;font-size:.95rem}
.pm-footer__grid{display:grid;gap:var(--s-4)}
@media(min-width:760px){.pm-footer__grid{grid-template-columns:1.4fr 1fr 1fr}}
.pm-footer__bottom{
  margin-top:var(--s-5);padding-top:var(--s-3);
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);
  justify-content:space-between;font-size:.85rem;color:#B9B5AC;
}

/* ==========================================================================
   13. Reveal on scroll
   ========================================================================== */
.pm-reveal{opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.pm-reveal.is-in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.pm-reveal{opacity:1;transform:none}}

/* ==========================================================================
   14. Astra-Reste zähmen
   ========================================================================== */
.ast-container,.site-content .ast-container{max-width:none;padding:0}
.site-content>.ast-container{display:block}
.entry-content>*{margin-inline:auto}
.ast-single-post .entry-header,.ast-archive-description{display:none}
#primary{margin:0;padding:0}
.ast-separate-container #primary{background:transparent}

/* ==========================================================================
   15. Fremdelemente in die Farbwelt holen
   Cookie-Banner, Sprach-Widget und Scroll-Top kamen aus Plugins im
   Werkszustand — orange, mit Flagge, ohne Bezug zum Rest.
   ========================================================================== */

/* GTranslate-Widget: eigener DE/RU-Umschalter ist im Kopf.
   Flagge zusätzlich unerwünscht (siehe MASTER.md). */
.gt_float_switcher,
#gt_float_wrapper,
.gtranslate_wrapper{display:none!important}

/* Complianz-Banner */
#cmplz-cookiebanner-container .cmplz-cookiebanner{
  background:var(--c-bg)!important;
  border:1px solid var(--c-surface-2)!important;
  border-radius:var(--radius)!important;
  box-shadow:0 12px 40px rgba(38,41,43,.14)!important;
  font-family:var(--f-body)!important;
}
#cmplz-cookiebanner-container .cmplz-title,
#cmplz-cookiebanner-container .cmplz-categories,
#cmplz-cookiebanner-container .cmplz-message{color:var(--c-ink)!important}
#cmplz-cookiebanner-container .cmplz-title{font-family:var(--f-head)!important;font-weight:400!important}
#cmplz-cookiebanner-container .cmplz-message{color:var(--c-ink-soft)!important;font-size:.92rem!important}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-accept{
  background:var(--c-sage-deep)!important;border-color:var(--c-sage-deep)!important;
  color:#fff!important;border-radius:var(--radius)!important;
}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-accept:hover{background:var(--c-ink)!important;border-color:var(--c-ink)!important}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-deny,
#cmplz-cookiebanner-container .cmplz-btn.cmplz-view-preferences{
  background:transparent!important;color:var(--c-sage-deep)!important;
  border:1px solid var(--c-sage-mist)!important;border-radius:var(--radius)!important;
}
#cmplz-cookiebanner-container .cmplz-links a{color:var(--c-ink-soft)!important}

/* Scroll-Top */
#ast-scroll-top{
  background:var(--c-sage-deep)!important;color:#fff!important;
  border-radius:50%!important;box-shadow:none!important;
}
#ast-scroll-top:hover{background:var(--c-ink)!important}

/* Popup-Plugin: kein Overlay beim Betreten — ein Mensch in einer Krise
   entscheidet selbst, wann er Kontakt aufnimmt. */
.ays-pb-modal,.ays_pb_modal{display:none!important}

/* ==========================================================================
   16. Nachschärfungen 20.09.2026
   ========================================================================== */

/* Astra setzt für button/.button eigene Farben und gewinnt über Inline-CSS.
   Der Kopfbereich-Button sah dadurch ausgegraut und unleserlich aus. */
.pm-btn,
.pm-header .pm-btn,
a.pm-btn{
  -webkit-appearance:none;appearance:none;
  text-shadow:none;
}
.pm-btn--primary,
.pm-header .pm-btn--primary,
a.pm-btn--primary{
  background:var(--c-sage-deep);
  color:#fff;
  border-color:var(--c-sage-deep);
  box-shadow:none;
}
.pm-btn--primary:hover,
.pm-header .pm-btn--primary:hover,
a.pm-btn--primary:hover{background:var(--c-ink);color:#fff;border-color:var(--c-ink)}
.pm-header .pm-btn{padding:.72rem 1.15rem;font-size:.92rem}

/* Ihr Bildzeichen (Baum mit Herz). Aus der Vorlage wurde die Vignette
   herausgerechnet und der Schriftring beschnitten, damit es auch klein
   lesbar bleibt. */
.pm-brand__mark{
  width:52px;height:52px;flex:none;
  object-fit:contain;            /* transparentes PNG — kein Hintergrund, kein Beschnitt */
}
@media(max-width:560px){.pm-brand__mark{width:44px}}

/* Vollversion mit Schriftring im Fußbereich */
.pm-footer__mark{width:132px;height:132px;object-fit:contain;margin-bottom:var(--s-3)}

/* ---------- Kontaktformular ---------- */
.pm-form{display:grid;gap:var(--s-3);max-width:560px}
.pm-form label{display:block;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-ink-soft);margin-bottom:.4rem}
.pm-form input[type=text],
.pm-form input[type=email],
.pm-form input[type=tel],
.pm-form select,
.pm-form textarea{
  width:100%;font-family:var(--f-body);font-size:1rem;color:var(--c-ink);
  background:var(--c-bg);border:1px solid var(--c-surface-2);border-radius:var(--radius);
  padding:.85rem 1rem;line-height:1.5;
  transition:border-color .2s var(--ease);
}
.pm-section--tint .pm-form input,
.pm-section--tint .pm-form select,
.pm-section--tint .pm-form textarea{background:var(--c-bg)}
.pm-form input:focus,.pm-form select:focus,.pm-form textarea:focus{border-color:var(--c-sage);outline:none}
.pm-form textarea{min-height:140px;resize:vertical}
.pm-form__row{display:grid;gap:var(--s-3)}
@media(min-width:620px){.pm-form__row{grid-template-columns:1fr 1fr}}
.pm-form__consent{display:flex;gap:.7rem;align-items:flex-start;font-size:.9rem;color:var(--c-ink-soft);line-height:1.6}
.pm-form__consent input{margin-top:.28rem;accent-color:var(--c-sage-deep);width:17px;height:17px;flex:none}
.pm-form__consent label{text-transform:none;letter-spacing:0;font-size:.9rem;margin:0}
.pm-form__hint{font-size:.85rem;color:var(--c-ink-soft);margin:0}
.pm-form .pm-btn{justify-self:start}
.pm-form__ok,.pm-form__err{border-radius:var(--radius);padding:var(--s-2) var(--s-3);font-size:.95rem}
.pm-form__ok{background:color-mix(in srgb,var(--c-sage-mist) 30%,var(--c-bg));color:var(--c-ink)}
.pm-form__err{background:color-mix(in srgb,var(--c-rose-soft) 34%,var(--c-bg));color:var(--c-ink)}

/* ---------- Zertifikate: Lightbox mit Schließen ---------- */
.pm-lightbox{
  position:fixed;inset:0;z-index:9999;display:none;
  background:color-mix(in srgb,var(--c-ink) 88%,transparent);
  padding:clamp(1rem,4vw,3rem);
}
.pm-lightbox[open],.pm-lightbox.is-open{display:grid;place-items:center}
.pm-lightbox img{max-width:min(92vw,900px);max-height:86vh;width:auto;height:auto;border-radius:2px;background:#fff}
.pm-lightbox__close{
  position:absolute;top:clamp(.75rem,2vw,1.5rem);right:clamp(.75rem,2vw,1.5rem);
  width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);color:#fff;cursor:pointer;
  display:grid;place-items:center;
}
.pm-lightbox__close:hover{background:rgba(255,255,255,.18)}
.pm-lightbox__nav{
  position:absolute;bottom:clamp(.75rem,3vw,2rem);left:50%;transform:translateX(-50%);
  display:flex;gap:var(--s-2);align-items:center;color:#fff;font-size:.9rem;
}
.pm-lightbox__nav button{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.35);color:#fff;
  width:40px;height:40px;border-radius:50%;cursor:pointer;display:grid;place-items:center;
}
.pm-lightbox__nav button:hover{background:rgba(255,255,255,.18)}
body.pm-locked{overflow:hidden}

/* ==========================================================================
   17. Bewegung — 20.09.2026
   Die Seite soll leben, ohne zu zappeln: in dieser Nische kommt jemand in
   einer schweren Lage her. Alles läuft langsam, nur mit GPU-Eigenschaften,
   und ist bei prefers-reduced-motion vollständig aus.
   ========================================================================== */

:root{
  --ease-out-expo:cubic-bezier(.16,1,.3,1);
  --dur-slow:1.1s;
  --dur-mid:.62s;
}

/* ---------- Auftritt beim Laden: Zeile für Zeile ---------- */
.pm-line{display:block;overflow:hidden}
.pm-line > span{
  display:block;
  transform:translateY(105%);
  animation:pm-line-up var(--dur-slow) var(--ease-out-expo) forwards;
  animation-delay:calc(var(--i,0) * 110ms + 120ms);
}
@keyframes pm-line-up{to{transform:translateY(0)}}

.pm-fade-in{
  opacity:0;transform:translateY(14px);
  animation:pm-fade-up var(--dur-mid) var(--ease-out-expo) forwards;
  animation-delay:calc(var(--i,0) * 90ms + 420ms);
}
@keyframes pm-fade-up{to{opacity:1;transform:none}}

/* Porträt: ruhiges Heranfahren, kein Zoom-Effekt */
.pm-portrait img{
  animation:pm-portrait-in 1.6s var(--ease-out-expo) both;
}
@keyframes pm-portrait-in{
  from{opacity:0;transform:scale(1.05)}
  to{opacity:1;transform:scale(1)}
}
/* Sanfter Versatz beim Scrollen (wird per JS gesetzt, GPU-only) */
.pm-portrait{will-change:transform}

/* ---------- Reveal beim Scrollen, mit Staffelung ---------- */
.pm-reveal{opacity:0;transform:translateY(18px);
  transition:opacity .7s var(--ease-out-expo),transform .7s var(--ease-out-expo)}
.pm-reveal.is-in{opacity:1;transform:none}
.pm-reveal.is-in{transition-delay:calc(var(--i,0) * 90ms)}

/* ---------- Icons ---------- */
.pm-icon{display:block;color:var(--c-sage-deep)}
.pm-icon-badge{
  width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;flex:none;
  background:color-mix(in srgb,var(--c-sage-mist) 30%,var(--c-bg));
  color:var(--c-sage-deep);
  transition:background .4s var(--ease-out-expo),transform .4s var(--ease-out-expo);
}
.pm-card:hover .pm-icon-badge,
.pm-step:hover .pm-icon-badge{
  background:var(--c-sage-deep);color:#fff;transform:translateY(-2px);
}

/* Strich zeichnet sich beim Erscheinen */
.pm-reveal .pm-icon path,
.pm-reveal .pm-icon circle,
.pm-reveal .pm-icon rect{
  stroke-dasharray:var(--len,120);stroke-dashoffset:var(--len,120);
}
.pm-reveal.is-in .pm-icon path,
.pm-reveal.is-in .pm-icon circle,
.pm-reveal.is-in .pm-icon rect{
  animation:pm-draw 1s var(--ease-out-expo) forwards;
  animation-delay:calc(var(--i,0) * 90ms + 120ms);
}
@keyframes pm-draw{to{stroke-dashoffset:0}}

/* ---------- Buttons: Pfeil wandert ---------- */
.pm-btn .pm-icon{transition:transform .35s var(--ease-out-expo)}
.pm-btn:hover .pm-icon{transform:translateX(3px)}

/* ---------- Themenliste: Linie läuft ein ---------- */
.pm-topics a{position:relative}
.pm-topics a::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:0;
  background:var(--c-sage-deep);
  transition:width .55s var(--ease-out-expo);
}
.pm-topics a:hover::after{width:100%}

/* ---------- Zitat: Strich wächst ---------- */
.pm-quote{position:relative;border-left:0;padding-left:var(--s-3)}
.pm-quote::before{
  content:"";position:absolute;left:0;top:0;width:2px;height:0;
  background:var(--c-rose-soft);
  transition:height 1.1s var(--ease-out-expo);
}
.pm-quote.is-in::before{height:100%}

/* ---------- Seitenwechsel ---------- */
@view-transition{navigation:auto}
@media (prefers-reduced-motion:no-preference){
  ::view-transition-old(root){animation:pm-vt-out .28s ease both}
  ::view-transition-new(root){animation:pm-vt-in .34s var(--ease-out-expo) both}
}
@keyframes pm-vt-out{to{opacity:0}}
@keyframes pm-vt-in{from{opacity:0;transform:translateY(8px)}}

/* ---------- Alles aus, wenn der Besucher weniger Bewegung will ---------- */
@media (prefers-reduced-motion:reduce){
  .pm-line > span,.pm-fade-in,.pm-portrait img{animation:none!important;opacity:1!important;transform:none!important}
  .pm-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .pm-reveal .pm-icon path,.pm-reveal .pm-icon circle,.pm-reveal .pm-icon rect{
    stroke-dasharray:none!important;stroke-dashoffset:0!important;animation:none!important}
  .pm-quote::before{height:100%!important;transition:none!important}
}

/* Kontaktzeilen mit Icon */
.pm-contact{margin-top:var(--s-4);display:grid;gap:var(--s-3)}
.pm-contact .pm-contact__item{display:flex;gap:var(--s-2);align-items:center;margin:0}
.pm-contact .pm-contact__label{margin:0 0 .1rem}
.pm-contact .pm-contact__value{margin:0}
.pm-step{display:flex;flex-direction:column;gap:.85rem;padding-top:0}
.pm-step::before{position:static;display:block;margin-bottom:-.25rem}

/* ==========================================================================
   18. Kopfleiste dunkelgrün — 20.09.2026
   Auf Creme wirkte das Logo matt: grünes Laub auf hellem Grund hat kaum
   Abstand. Vor dunklem Grün leuchtet es, und die Farbe stammt aus dem
   Logo selbst (Blattton), nicht von außen. Alle Paare WCAG-geprüft.
   ========================================================================== */
.pm-header{
  background:var(--c-sage-deep);
  backdrop-filter:none;
  border-bottom:1px solid rgba(255,255,255,.14);
  transition:background .4s var(--ease-out-expo),border-color .4s var(--ease-out-expo);
}
/* Startseite: über dem Motiv schwebend, ohne Balken — so wie in der Vorlage */
body.home .pm-header{background:transparent;border-bottom-color:transparent}
body.home .pm-header .pm-brand__name,
body.home .pm-header .pm-nav a{color:var(--c-ink)}
body.home .pm-header .pm-brand__role{color:var(--c-ink-soft)}
body.home .pm-header .pm-lang a{color:var(--c-ink-soft)}
body.home .pm-header .pm-lang a[aria-current="true"]{color:var(--c-ink);background:rgba(255,255,255,.55)}
body.home .pm-header .pm-lang span{color:var(--c-surface-2)}
body.home .pm-header .pm-burger{color:var(--c-ink)}
body.home .pm-header .pm-btn--primary,
body.home .pm-header a.pm-btn--primary{
  background:var(--c-sage-deep);color:#fff;border-color:var(--c-sage-deep);
}
body.home .pm-header a.pm-btn--primary:hover{background:var(--c-ink);border-color:var(--c-ink)}
/* Sobald gescrollt wird, kehrt der grüne Balken zurück */
body.home .pm-header.is-stuck{background:var(--c-sage-deep);border-bottom-color:rgba(255,255,255,.14)}
body.home .pm-header.is-stuck .pm-brand__name,
body.home .pm-header.is-stuck .pm-nav a{color:#E9E6DF}
body.home .pm-header.is-stuck .pm-brand__role,
body.home .pm-header.is-stuck .pm-lang a{color:#C3CFC0}
body.home .pm-header.is-stuck .pm-lang a[aria-current="true"]{color:#fff;background:rgba(255,255,255,.12)}
body.home .pm-header.is-stuck .pm-burger{color:#F5F2EC}
body.home .pm-header.is-stuck .pm-btn--primary,
body.home .pm-header.is-stuck a.pm-btn--primary{
  background:var(--c-surface);color:var(--c-ink);border-color:var(--c-surface);
}
.pm-brand{color:#F5F2EC}                    /* 7.51:1 */
.pm-brand__name{color:#F5F2EC}
.pm-brand__role{color:#C3CFC0}              /* 5.20:1 */
.pm-nav a{color:#E9E6DF}                    /* 6.73:1 */
.pm-nav a:hover,
.pm-nav a[aria-current="page"]{color:#fff;text-decoration-color:rgba(255,255,255,.6)}
.pm-lang a{color:#C3CFC0}
.pm-lang a[aria-current="true"]{color:#fff;background:rgba(255,255,255,.12)}
.pm-lang span{color:rgba(255,255,255,.28)}
.pm-burger{color:#F5F2EC}

/* Knopf kehrt die Farben um, damit er auf Dunkelgrün führt */
.pm-header .pm-btn--primary,
.pm-header a.pm-btn--primary{
  background:var(--c-surface);color:var(--c-ink);border-color:var(--c-surface);
}
.pm-header .pm-btn--primary:hover,
.pm-header a.pm-btn--primary:hover{background:#fff;color:var(--c-ink);border-color:#fff}

/* Mobiles Menü übernimmt den dunklen Grund */
@media(max-width:880px){
  .pm-nav{background:var(--c-sage-deep);border-bottom-color:rgba(255,255,255,.14)}
  .pm-nav a{color:#E9E6DF}
}

/* Das Logo selbst einen Hauch kräftiger */
.pm-brand__mark{filter:saturate(1.08) contrast(1.04)}

/* Startseite: die schwebende Leiste bekommt mehr Höhe und ein größeres
   Zeichen — in der Vorlage steht die Marke frei über dem Motiv, nicht in
   einem schmalen Balken. */
@media(min-width:900px){
  body.home .pm-header__inner{min-height:112px;align-items:flex-start;padding-top:1.6rem}
  body.home .pm-brand__mark{width:66px;height:66px}
  body.home .pm-brand__name{font-size:1.24rem;line-height:1.2}
  body.home .pm-brand__role{font-size:.68rem;letter-spacing:.14em}
  body.home .pm-nav{padding-top:.5rem}
  body.home .pm-hero{margin-top:-112px;padding-block:clamp(7.5rem,12vw,9.5rem) clamp(2rem,4vw,3rem)}
  /* beim Scrollen zurück auf die kompakte Leiste */
  body.home .pm-header.is-stuck .pm-header__inner{min-height:72px;align-items:center;padding-top:0}
  body.home .pm-header.is-stuck .pm-brand__mark{width:52px;height:52px}
  body.home .pm-header.is-stuck .pm-brand__name{font-size:1.02rem}
}

/* ==========================================================================
   19. Telefon — 20.09.2026
   Die Leiste bleibt auch hier durchsichtig über dem Motiv. Lesbar wird sie
   nicht durch einen Farbbalken, sondern durch einen weichen Cremeschleier,
   der nach unten ausläuft — oben im Bild ist die Wand ohnehin hell.
   ========================================================================== */
@media(max-width:860px){
  body.home .pm-header{
    background:transparent;border-bottom-color:transparent;
    position:absolute;               /* schwebt, schiebt das Bild nicht nach unten */
    left:0;right:0;top:0;
  }
  /* Schleier statt Balken */
  body.home .pm-header::before{
    content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:linear-gradient(180deg,
      color-mix(in srgb,var(--c-bg) 88%,transparent) 0%,
      color-mix(in srgb,var(--c-bg) 62%,transparent) 55%,
      transparent 100%);
  }
  body.home .pm-header .pm-brand__name{color:var(--c-ink)}
  body.home .pm-header .pm-brand__role{color:var(--c-ink-soft)}
  body.home .pm-header .pm-burger{color:var(--c-ink)}
  body.home .pm-header .pm-lang a{color:var(--c-ink-soft)}
  body.home .pm-header .pm-lang a[aria-current="true"]{color:var(--c-ink);background:rgba(255,255,255,.6)}

  /* Beim Scrollen bekommt sie ihren grünen Grund — über hellem Text nötig */
  body.home .pm-header.is-stuck{position:sticky;background:var(--c-sage-deep);border-bottom-color:rgba(255,255,255,.14)}
  body.home .pm-header.is-stuck::before{opacity:0}
  body.home .pm-header.is-stuck .pm-brand__name{color:#F5F2EC}
  body.home .pm-header.is-stuck .pm-brand__role{color:#C3CFC0}
  body.home .pm-header.is-stuck .pm-burger{color:#F5F2EC}
  body.home .pm-header.is-stuck .pm-lang a{color:#C3CFC0}

  /* Aufklappmenü hell statt grün */
  .pm-nav{
    background:var(--c-bg);
    border-bottom:1px solid var(--c-surface-2);
    box-shadow:0 18px 40px rgba(18,27,30,.10);
  }
  .pm-nav a{color:var(--c-ink)}
  .pm-nav a[aria-current="page"]{color:var(--c-sage-deep)}
  .pm-nav .pm-btn--primary{background:var(--c-sage-deep);color:#fff;border-color:var(--c-sage-deep)}
  .pm-nav .pm-lang a{color:var(--c-ink-soft)}
  body.home .pm-header.is-stuck .pm-nav a{color:var(--c-ink)}

  /* Motiv: volle Breite, Hochformat, beginnt ganz oben */
  body.home .pm-hero,
  .pm-hero{margin-top:0;padding-block:0}
  .pm-hero__bg{position:relative;display:block;width:100%;aspect-ratio:3/4;max-height:64svh;overflow:hidden}
  .pm-hero__bg img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;display:block}
  .pm-hero__inner{padding-block:var(--s-4) var(--s-5)}
  .pm-hero__kicker{margin-top:0}
}

/* ==========================================================================
   20. Mobiles Menü — Korrektur 20.09.2026
   Der Menüknopf erschien auf dem Telefon als blaues Kästchen: Android setzt
   auf <button> eine eigene Fläche und ein blaues Antipp-Highlight. Beides
   wird hier abgeschaltet. Das Aufklappmenü war außerdem zu luftig geraten.
   ========================================================================== */
.pm-burger{
  -webkit-appearance:none;appearance:none;
  background:transparent!important;
  border:0;box-shadow:none;
  -webkit-tap-highlight-color:transparent;
  padding:.35rem;margin-right:-.35rem;
  line-height:0;border-radius:4px;
  color:inherit;
}
.pm-burger:focus{outline:none}
.pm-burger:focus-visible{outline:2px solid currentColor;outline-offset:2px}
a,button{-webkit-tap-highlight-color:transparent}

@media(max-width:860px){
  /* Panel: kompakt, mit feinen Trennlinien statt großer Leerräume */
  .pm-nav{
    position:fixed;left:0;right:0;top:0;
    padding:calc(var(--kopf-h,68px) + .5rem) clamp(1rem,5vw,1.5rem) 1.25rem;
    display:flex;flex-direction:column;align-items:stretch;gap:0;
    background:var(--c-bg);
    border-bottom:1px solid var(--c-surface-2);
    box-shadow:0 20px 50px rgba(18,27,30,.14);
    max-height:100svh;overflow-y:auto;
  }
  .pm-nav a{
    font-size:1.06rem;font-weight:500;padding:.92rem .1rem;
    border-bottom:1px solid var(--c-surface-2);
    display:flex;align-items:center;justify-content:space-between;
  }
  .pm-nav a:last-of-type{border-bottom:0}
  .pm-nav a[aria-current="page"]{color:var(--c-sage-deep);font-weight:500}

  /* Knopf über die volle Breite, direkt nach den Punkten */
  .pm-nav .pm-btn--primary{
    margin-top:1rem;justify-content:center;width:100%;
    padding:.95rem 1.2rem;font-size:1rem;border-radius:var(--radius);
  }
  /* Sprachwahl unten, ruhig */
  .pm-nav .pm-lang{
    margin-top:1rem;padding-top:.9rem;
    border-top:1px solid var(--c-surface-2);
    justify-content:flex-start;gap:.5rem;
  }
  .pm-nav .pm-lang a{border:0;padding:.3rem .55rem;font-size:.9rem;display:inline-flex}

  /* Die Leiste bleibt über dem Panel sichtbar */
  .pm-header{z-index:120}
  .pm-nav{z-index:110}
  body.pm-menue-offen{overflow:hidden}
}

/* Bei geöffnetem Menü muss die Leiste sichtbar bleiben — auf der Startseite
   steht sie absolut über dem Motiv und verschwand sonst hinter dem Panel. */
@media(max-width:860px){
  body.pm-menue-offen .pm-header,
  body.home.pm-menue-offen .pm-header{
    position:fixed;top:0;left:0;right:0;z-index:130;
    background:var(--c-bg);border-bottom-color:transparent;
  }
  body.pm-menue-offen .pm-header::before{opacity:0}
  body.home.pm-menue-offen .pm-header .pm-brand__name{color:var(--c-ink)}
  body.home.pm-menue-offen .pm-header .pm-brand__role{color:var(--c-ink-soft)}
  body.home.pm-menue-offen .pm-header .pm-burger{color:var(--c-ink)}
  .pm-nav{z-index:120}
}

/* .pm-brand trägt aus der grünen Leiste noch die helle Schriftfarbe.
   Bei geöffnetem Menü ist der Grund cremefarben — dort war der Name
   deshalb praktisch unsichtbar. */
@media(max-width:860px){
  body.pm-menue-offen .pm-header .pm-brand,
  body.home.pm-menue-offen .pm-header .pm-brand{color:var(--c-ink)}
  body.pm-menue-offen .pm-header .pm-brand__name{color:var(--c-ink)}
  body.pm-menue-offen .pm-header .pm-brand__role{color:var(--c-ink-soft)}
  /* Auch ohne geöffnetes Menü: über dem hellen Foto muss der Name dunkel sein */
  body.home .pm-header .pm-brand{color:var(--c-ink)}
  body.home .pm-header.is-stuck .pm-brand{color:#F5F2EC}
}

/* Das Panel liegt im DOM INNERHALB der Leiste. Deshalb half ein höherer
   z-index an der Leiste nichts — Marke und Menüknopf brauchen ihn selbst,
   sonst deckt das aufgeklappte Panel sie von innen zu. */
@media(max-width:860px){
  .pm-header .pm-brand{position:relative;z-index:125}
  .pm-header .pm-burger{position:relative;z-index:125}
}

/* ==========================================================================
   21. Menüknopf wird zum Kreuz + Menü mit Blattgrund — 20.09.2026
   ========================================================================== */
.pm-burger__linien{
  display:block;width:26px;height:18px;position:relative;
}
.pm-burger__linien i{
  position:absolute;left:0;right:0;height:1.6px;border-radius:2px;
  background:currentColor;
  transition:transform .34s var(--ease-out-expo),opacity .22s var(--ease-out-expo),top .34s var(--ease-out-expo);
}
.pm-burger__linien i:nth-child(1){top:0}
.pm-burger__linien i:nth-child(2){top:8.2px}
.pm-burger__linien i:nth-child(3){top:16.4px}
/* geöffnet: obere und untere Linie kreuzen sich, die mittlere verschwindet */
.pm-burger[aria-expanded="true"] .pm-burger__linien i:nth-child(1){top:8.2px;transform:rotate(45deg)}
.pm-burger[aria-expanded="true"] .pm-burger__linien i:nth-child(2){opacity:0;transform:scaleX(.4)}
.pm-burger[aria-expanded="true"] .pm-burger__linien i:nth-child(3){top:8.2px;transform:rotate(-45deg)}

@media(max-width:860px){
  /* Blattgrund aus demselben Motiv wie der Hero — kein weißer Kasten mehr.
     Darüber ein Cremeschleier, damit die Menüpunkte ruhig lesbar bleiben. */
  .pm-nav{
    background-color:var(--c-bg);
    background-image:
      linear-gradient(180deg,
        color-mix(in srgb,var(--c-bg) 78%,transparent) 0%,
        color-mix(in srgb,var(--c-bg) 64%,transparent) 48%,
        color-mix(in srgb,var(--c-bg) 86%,transparent) 100%),
      url("assets/img/menue-bg.webp");
    background-size:cover,cover;
    background-position:center,center;
    background-repeat:no-repeat,no-repeat;
  }
  .pm-nav a{border-bottom-color:rgba(63,89,69,.16)}
  .pm-nav .pm-lang{border-top-color:rgba(63,89,69,.16)}
  /* feiner grüner Rand unten schließt das Panel ab */
  .pm-nav{border-bottom:1px solid rgba(63,89,69,.18)}
}

/* ==========================================================================
   20. Block 2 "Meine Angebote" — nach Vorlage "block 2.png", 27.09.2026
   Desktop: Kopf links, Raumfoto oben rechts, drei Bildkarten, CTA-Leiste.
   Handy: Querkarten (Bild links), Zweig oben rechts, voller CTA-Knopf.
   ========================================================================== */
:root{
  --c-offers-bg:#F5EFE4;      /* Grund der Vorlage, passt nahtlos an das Deko-Foto */
  --c-offer-card:#FBF8F2;
  --c-offer-line:#E6DDCD;
  --c-offer-badge:#65735A;    /* Nummernkreis, weiß darauf 4.9:1 */
  --c-offer-blob:#E4E0CF;
  --c-offer-shadow:rgba(60,50,30,.18);
  --offers-stage:1320px;
}

.pm-offers{
  position:relative;overflow:hidden;isolation:isolate;
  background:var(--c-offers-bg);
  padding-block:clamp(2.75rem,5vw,3.6rem) clamp(2.5rem,4vw,3.2rem);
}
.pm-offers__inner{position:relative;z-index:2}

/* Deko oben rechts — innerhalb einer 1320px-Bühne, darüber seitlich ausgeblendet */
.pm-offers__deko{
  position:absolute;z-index:0;top:0;
  right:max(0px,calc((100vw - var(--offers-stage)) / 2));
  width:min(54vw,680px);height:auto;pointer-events:none;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 22%),linear-gradient(to bottom,transparent 0,#000 24%,#000 84%,transparent 100%);
          mask-image:linear-gradient(to right,transparent 0,#000 22%),linear-gradient(to bottom,transparent 0,#000 24%,#000 84%,transparent 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
@media(min-width:1321px){
  .pm-offers__deko{
    -webkit-mask-image:linear-gradient(to right,transparent 0,#000 22%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 24%,#000 84%,transparent 100%);
            mask-image:linear-gradient(to right,transparent 0,#000 22%,#000 90%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 24%,#000 84%,transparent 100%);
  }
}
.pm-offers__zweig{display:none}

.pm-offers__blob{position:absolute;z-index:0;background:color-mix(in srgb,var(--c-offer-blob) 55%,var(--c-offers-bg));pointer-events:none}
.pm-offers__blob--l{left:-90px;bottom:-110px;width:260px;height:170px;border-radius:58% 42% 50% 50% / 55% 60% 40% 45%}
.pm-offers__blob--r{right:-80px;bottom:-120px;width:240px;height:160px;border-radius:45% 55% 40% 60% / 60% 45% 55% 40%}

/* Kopf */
.pm-offers__head{max-width:520px;margin-bottom:clamp(1.8rem,3vw,2.4rem)}
.pm-offers__eyebrow{
  font-size:.8rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  color:var(--c-ink-soft);margin:0 0 .6rem;
}
.pm-offers__head h2{
  font-weight:400;font-size:clamp(2.2rem,3.9vw,2.95rem);line-height:1.08;letter-spacing:-.015em;
  margin:0 0 .9rem;
}
.pm-offers__head p:last-child{font-size:.97rem;line-height:1.55;color:var(--c-ink);margin:0}

/* Karten */
.pm-offers__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,1.8vw,1.35rem)}
.pm-offer{
  display:flex;flex-direction:column;
  background:var(--c-offer-card);
  border:1px solid var(--c-offer-line);border-radius:12px;
  padding:5px;
  box-shadow:0 10px 28px -18px var(--c-offer-shadow);
}
.pm-offer__media{position:relative}
.pm-offer__media img{
  width:100%;aspect-ratio:2/1.02;object-fit:cover;border-radius:8px 8px 4px 4px;
}
.pm-offer__nr{
  position:absolute;left:20px;bottom:-27px;
  width:54px;height:54px;border-radius:50%;
  display:grid;place-items:center;
  background:var(--c-offer-badge);color:#fff;
  border:3px solid var(--c-offer-card);
  font-family:var(--f-head);font-size:1.15rem;font-weight:400;line-height:1;
  transition:transform .4s var(--ease-out-expo);
}
.pm-offer:hover .pm-offer__nr{transform:translateY(-2px)}
.pm-offer__nr--m{display:none}

.pm-offer__body{display:flex;flex-direction:column;flex:1;padding:2.2rem 1.35rem 1.2rem}
.pm-offer__body h3{
  font-family:var(--f-head);font-weight:400;font-size:clamp(1.45rem,2.1vw,1.7rem);
  line-height:1.2;letter-spacing:-.01em;margin:0 0 .55rem;
}
.pm-offer__text{font-size:.9rem;line-height:1.45;color:var(--c-ink);margin:0 0 1rem;max-width:none}
.pm-offer__kurz{display:none}

.pm-offer__list{
  list-style:none;margin:0 0 1.5rem;padding:1.05rem 0 0;
  border-top:1px solid var(--c-offer-line);
  display:grid;gap:.95rem;
}
.pm-offer__list li{display:flex;align-items:center;gap:1.15rem;font-size:.9rem;color:var(--c-ink);line-height:1.3}
.pm-offer__list .pm-icon{flex:none;color:var(--c-sage-deep)}

.pm-offer__price{display:flex;align-items:baseline;gap:.9rem;margin:auto 0 1.1rem;max-width:none}
.pm-offer__price strong{font-family:var(--f-head);font-weight:400;font-size:1.65rem;color:var(--c-ink)}
.pm-offer__price span{font-size:.95rem;color:var(--c-ink)}
.pm-offer__dot{color:var(--c-ink-soft)}

.pm-offer__meta,.pm-offer__round{display:none}

.pm-offers .pm-btn{border-radius:var(--radius-pill)}
.pm-offer__btn{align-self:flex-start;padding:1rem 2.2rem;font-size:.95rem}
.pm-offer__btn .pm-icon{color:currentColor}

/* CTA-Leiste */
.pm-offers__cta{
  display:grid;grid-template-columns:auto auto auto auto;align-items:center;justify-content:center;
  column-gap:clamp(1rem,2.4vw,2rem);
  margin-top:clamp(1.6rem,3vw,2.2rem);
}
.pm-offers__cta p{margin:0;max-width:none}
.pm-offers__cta-icon{
  width:56px;height:56px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--c-offer-blob) 70%,var(--c-offers-bg));
}
.pm-offers__cta-icon .pm-icon{color:var(--c-ink-soft)}
.pm-offers__cta-q{
  font-family:var(--f-head);font-size:1.08rem;line-height:1.3;color:var(--c-ink);
  padding-right:clamp(1rem,2.4vw,2rem);border-right:1px solid var(--c-offer-line);
}
.pm-offers__cta-t{font-size:.82rem;line-height:1.6;color:var(--c-ink-soft)}
.pm-offers a.pm-offers__cta-btn{
  background:transparent;color:var(--c-ink);border:1px solid var(--c-ink-soft);
  padding:.85rem 1.7rem;font-size:.85rem;
}
.pm-offers a.pm-offers__cta-btn:hover{background:var(--c-sage-deep);border-color:var(--c-sage-deep);color:#fff}
.pm-offers__cta-btn .pm-icon{color:currentColor}

@media(max-width:1100px){
  .pm-offer__body{padding-inline:1.1rem}
  .pm-offer__btn{padding-inline:1.6rem}
  .pm-offer__list li{gap:.8rem}
}

/* ---------- Handy / schmales Tablet ---------- */
@media(max-width:899px){
  .pm-offers{padding-block:2.6rem 2rem}
  .pm-offers__deko,.pm-offers__blob{display:none}
  .pm-offers__zweig{
    display:block;position:absolute;z-index:0;top:0;right:0;
    width:130px;height:auto;pointer-events:none;
    -webkit-mask-image:radial-gradient(circle at 100% 0,#000 45%,transparent 72%);
            mask-image:radial-gradient(circle at 100% 0,#000 45%,transparent 72%);
  }
  .pm-offers__head{max-width:560px;margin-bottom:1.6rem}
  .pm-offers__eyebrow{font-size:.75rem}
  .pm-offers__head h2{font-size:clamp(1.9rem,8vw,2.4rem);line-height:1.1;margin-bottom:.9rem}
  .pm-offers__head p:last-child{font-size:.84rem;line-height:1.65}

  .pm-offers__grid{grid-template-columns:1fr;gap:.9rem}
  .pm-offer{
    display:grid;grid-template-columns:clamp(96px,28vw,150px) 1fr;column-gap:1.3rem;
    padding:8px;border-radius:10px;
  }
  .pm-offer__media img{height:100%;min-height:150px;aspect-ratio:auto;border-radius:4px}
  .pm-offer__media .pm-offer__nr,
  .pm-offer__text,.pm-offer__list,.pm-offer__price,.pm-offer__btn{display:none}

  .pm-offer__body{padding:.35rem 0 .2rem;position:relative}
  .pm-offer__nr--m{
    display:grid;position:static;width:42px;height:42px;border-width:0;
    font-size:1rem;margin-bottom:.55rem;
  }
  .pm-offer__body h3{font-size:1.3rem;margin-bottom:.4rem}
  .pm-offer__kurz{display:block;font-size:.78rem;line-height:1.55;color:var(--c-ink);margin:0 0 .9rem;max-width:none;padding-right:.3rem}
  .pm-offer__meta{
    display:flex;align-items:center;gap:.45rem;margin:auto 0 .2rem;
    font-size:.72rem;color:var(--c-ink);max-width:none;
  }
  .pm-offer__meta .pm-icon{color:var(--c-ink)}
  .pm-offer__meta strong{font-weight:500}
  .pm-offer__sep{width:1px;height:12px;background:var(--c-offer-line);margin-inline:.35rem}
  .pm-offer__round{
    display:grid;place-items:center;position:absolute;right:0;bottom:0;
    width:38px;height:38px;border-radius:50%;
    background:var(--c-sage-deep);color:#fff;
    transition:background .25s var(--ease),transform .25s var(--ease);
  }
  .pm-offer__round .pm-icon{color:#fff}
  .pm-offer__round:hover{background:var(--c-ink);transform:translateX(2px)}

  .pm-offers__cta{
    grid-template-columns:56px 1fr;column-gap:1.1rem;row-gap:.35rem;
    justify-content:stretch;margin-top:1.4rem;padding-top:1.4rem;
    border-top:1px solid var(--c-offer-line);
  }
  .pm-offers__cta-icon{grid-row:1 / span 2;align-self:start}
  .pm-offers__cta-q{border:0;padding:0;font-size:1rem}
  .pm-offers__cta-t{font-size:.78rem}
  .pm-offers a.pm-offers__cta-btn{
    grid-column:1 / -1;justify-content:center;margin-top:1.2rem;
    background:var(--c-sage-deep);border-color:var(--c-sage-deep);color:#fff;
    padding:1.05rem 1.5rem;font-size:.95rem;
  }
  .pm-offers a.pm-offers__cta-btn:hover{background:var(--c-ink);border-color:var(--c-ink)}
}
@media(max-width:899px) and (min-width:560px){
  .pm-offers__head p:last-child{font-size:.95rem}
  .pm-offer__kurz{font-size:.9rem}
  .pm-offer__meta{font-size:.82rem}
}

/* ==========================================================================
   21. Übergänge Hero → Angebote → Ablauf — 27.09.2026
   Kein Block darf mit einer harten Kante enden: jede Fläche läuft in die
   Grundfarbe des nächsten Blocks aus.
   ========================================================================== */
.pm-hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;z-index:1;pointer-events:none;
  height:clamp(140px,16vw,240px);
  background:linear-gradient(to bottom,
    color-mix(in srgb,var(--c-offers-bg) 0%,transparent) 0,
    color-mix(in srgb,var(--c-offers-bg) 55%,transparent) 45%,
    var(--c-offers-bg) 100%);
}
.pm-offers{
  background:linear-gradient(to bottom,var(--c-offers-bg) 0,var(--c-offers-bg) 68%,var(--c-surface) 100%);
  margin-top:-2px;   /* überdeckt die Subpixel-Naht am Hero-Rand */
}
/* Flecken weich statt abgeschnitten */
.pm-offers__blob{
  background:radial-gradient(closest-side,
    color-mix(in srgb,var(--c-offer-blob) 70%,transparent) 0,
    color-mix(in srgb,var(--c-offer-blob) 45%,transparent) 55%,
    transparent 100%);
}
.pm-offers__blob--l{left:-140px;bottom:10px;width:440px;height:280px}
.pm-offers__blob--r{right:-140px;bottom:20px;width:420px;height:260px}

@media(max-width:899px){
  /* Handy: Foto läuft in den Textbereich aus, Textbereich in die Angebote */
  .pm-hero__bg::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:90px;pointer-events:none;
    background:linear-gradient(to bottom,color-mix(in srgb,var(--c-bg) 0%,transparent),var(--c-bg));
  }
  .pm-hero::after{height:140px}
  .pm-offers__zweig{
    top:14px;
    -webkit-mask-image:radial-gradient(circle at 100% 30%,#000 30%,transparent 68%),linear-gradient(to bottom,transparent 0,#000 30%,#000 55%,transparent 100%);
            mask-image:radial-gradient(circle at 100% 30%,#000 30%,transparent 68%),linear-gradient(to bottom,transparent 0,#000 30%,#000 55%,transparent 100%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}

/* ==========================================================================
   22. Ein Canvas statt Kästen: Hero → Angebote — 27.09.2026
   Globales Prinzip siehe design-system/MASTER.md: Sections sind transparent,
   die Farbe liegt auf body.home. Die organischen Formen gehören dem Hero und
   laufen über die Grenze in die Angebote hinein.
   ========================================================================== */
body.home{background:var(--c-offers-bg);overflow-x:clip}
body.home #pm-main{background:transparent}

/* Hero darf nach unten „überlaufen“ — geclippt wird nur das Foto selbst */
body.home .pm-hero{overflow:visible;background:transparent}
body.home .pm-hero__bg{overflow:hidden}
body.home .pm-hero::after{z-index:0}
.pm-hero__inner{z-index:2}

/* Angebote: oben völlig transparent, damit die Formen des Hero durchscheinen */
body.home .pm-offers{
  margin-top:0;
  background:linear-gradient(to bottom,transparent 0,transparent 66%,var(--c-surface) 100%);
}

.pm-flow{
  --flow-h:640px;          /* Höhe der Form-Bühne */
  --flow-lift:262px;       /* so weit beginnt sie oberhalb der Hero-Unterkante */
  position:absolute;left:0;right:0;z-index:1;
  top:calc(100% - var(--flow-lift));
  height:var(--flow-h);
  pointer-events:none;
}
.pm-flow__shape{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.pm-flow__cream{fill:var(--c-offers-bg)}
.pm-flow__veil{fill:var(--c-bg);opacity:.55}
.pm-flow__arc{
  fill:none;stroke:var(--c-sage-mist);stroke-width:1;opacity:.75;
  vector-effect:non-scaling-stroke;
}
.pm-flow__arc--2{opacity:.45}

/* Sage-Blob kreuzt die Grenze links, weich ohne Rand */
.pm-flow__sage{
  position:absolute;left:-180px;top:140px;width:560px;height:440px;
  background:radial-gradient(closest-side,
    color-mix(in srgb,var(--c-sage-mist) 26%,transparent) 0,
    color-mix(in srgb,var(--c-sage-mist) 12%,transparent) 55%,
    transparent 100%);
}

/* Feine Botanik-Linie im linken Rand, läuft vom Hero in die Angebote */
.pm-flow__botanik{
  position:absolute;left:clamp(12px,2.2vw,44px);top:30px;width:110px;height:350px;
  fill:color-mix(in srgb,var(--c-sage-mist) 14%,transparent);
  stroke:var(--c-sage-mist);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;
  opacity:.9;display:none;
}
@media(min-width:1320px){.pm-flow__botanik{display:block}}

/* linken Angebote-Blob übernimmt jetzt der Sage-Blob der Flow-Form */
body.home .pm-offers__blob--l{display:none}

@media (prefers-reduced-motion:no-preference){
  .pm-flow__shape,.pm-flow__botanik{animation:pm-flow-in 1.6s var(--ease-out-expo) .3s both}
}
@keyframes pm-flow-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ---------- Handy ---------- */
@media(max-width:899px){
  /* Foto endet in einer weichen Kurve statt mit gerader Kante */
  body.home .pm-hero__bg{
    -webkit-mask-image:radial-gradient(ellipse 120% 100% at 50% 0,#000 78%,transparent 100%);
            mask-image:radial-gradient(ellipse 120% 100% at 50% 0,#000 78%,transparent 100%);
  }
  body.home .pm-hero{background:linear-gradient(to bottom,var(--c-bg) 0,var(--c-bg) 60%,var(--c-offers-bg) 100%)}
  .pm-flow{--flow-h:420px;--flow-lift:172px}
  .pm-flow__arc--2{display:none}
  .pm-flow__sage{left:auto;right:-170px;top:40px;width:380px;height:320px}
}

/* ==========================================================================
   23. Block 3 "Der Ablauf" — nach Vorlage "block3-ablauf.png", 27.09.2026
   Teil des Canvas: oben/unten transparent auslaufend, Formen statt Kasten.
   ========================================================================== */
:root{
  --c-ablauf-bg:#F9F3E8;       /* heller Cream der Vorlage */
  --c-ablauf-band:#EDE3D1;     /* Beige-Formen */
  --c-gold-line:#D9BA8E;       /* feine Goldlinie */
  --stage-l:max(0px,calc((100vw - var(--offers-stage)) / 2));
}

/* Angebote laufen jetzt in den Ablauf aus, nicht mehr in --c-surface */
body.home .pm-offers{background:transparent}

.pm-ablauf{
  position:relative;isolation:isolate;
  background:linear-gradient(to bottom,
    color-mix(in srgb,var(--c-ablauf-bg) 0%,transparent) 0,
    var(--c-ablauf-bg) 160px,
    var(--c-ablauf-bg) calc(100% - 180px),
    color-mix(in srgb,var(--c-ablauf-bg) 0%,transparent) 100%);
  padding-top:clamp(3rem,5vw,4.2rem);
}
.pm-ablauf__bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pm-ablauf__band{fill:var(--c-ablauf-band)}
.pm-ablauf__band--leise{opacity:.55}

/* Foto oben rechts mit Wellen-Unterkante, oben weich im Canvas */
.pm-ablauf__oben{
  position:absolute;top:0;right:var(--stage-l);z-index:0;
  width:min(57vw,780px);height:auto;pointer-events:none;
  clip-path:url(#pm-clip-oben);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 14%),linear-gradient(to right,transparent 0,#000 16%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 14%),linear-gradient(to right,transparent 0,#000 16%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
@media(min-width:1321px){
  .pm-ablauf__oben{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 14%),linear-gradient(to right,transparent 0,#000 16%,#000 90%,transparent 100%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 14%),linear-gradient(to right,transparent 0,#000 16%,#000 90%,transparent 100%);
  }
}
.pm-ablauf__linie{
  position:absolute;top:0;right:var(--stage-l);z-index:0;
  width:min(66vw,900px);height:clamp(230px,20vw,280px);overflow:visible;pointer-events:none;
}
.pm-ablauf__linie path{fill:none;stroke:var(--c-gold-line);stroke-width:1.2;vector-effect:non-scaling-stroke}

/* Vektor-Zweige */
.pm-zweig{position:absolute;z-index:1;pointer-events:none;overflow:visible}
.pm-zweig__stiel,.pm-zweig__rippe{fill:none;stroke:color-mix(in srgb,var(--c-sage-deep) 55%,var(--c-sage-mist));stroke-width:1.1;stroke-linecap:round}
.pm-zweig__rippe{stroke-width:.7;opacity:.7}
.pm-zweig__blatt{
  fill:color-mix(in srgb,var(--c-sage-mist) 62%,var(--c-ablauf-bg));
  stroke:color-mix(in srgb,var(--c-sage-deep) 45%,var(--c-sage-mist));stroke-width:.8;
}
.pm-ablauf__zweig--oben{right:calc(var(--stage-l) + 40px);top:clamp(150px,12.5vw,178px);width:clamp(96px,8vw,112px);transform:rotate(-76deg);transform-origin:50% 50%}
.pm-ablauf__zweig--unten{right:calc(var(--stage-l) + 12px);bottom:10px;width:clamp(120px,11vw,160px);transform:rotate(-14deg)}

.pm-ablauf__inner{position:relative;z-index:2}

/* Kopf */
.pm-ablauf__head{max-width:640px}
.pm-ablauf__head h2{
  font-weight:400;font-size:clamp(2.3rem,4.3vw,3.5rem);line-height:1.08;letter-spacing:-.015em;margin:0 0 .9rem;
}
.pm-ablauf__head p:last-child{font-size:clamp(1rem,1.3vw,1.15rem);line-height:1.5;color:var(--c-ink-soft);margin:0;max-width:600px}

/* Schritte */
.pm-ablauf__steps{
  list-style:none;margin:clamp(2.6rem,4.5vw,3.6rem) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.1rem,2vw,1.8rem);
}
.pm-schritt{display:flex;flex-direction:column;margin:0}
.pm-schritt__kopf{display:flex;align-items:center;gap:clamp(.8rem,1.4vw,1.2rem)}
.pm-schritt__nr,.pm-schritt__icon{
  flex:none;width:clamp(56px,4.8vw,66px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
}
.pm-schritt__nr{background:var(--c-offer-badge);color:#fff;font-family:var(--f-head);font-size:clamp(1.25rem,1.9vw,1.55rem);font-weight:400}
.pm-schritt__icon{background:color-mix(in srgb,var(--c-ablauf-band) 70%,var(--c-ablauf-bg))}
.pm-schritt__icon .pm-icon{color:var(--c-sage-deep)}
.pm-schritt__pfeil{
  position:relative;flex:1;height:1px;margin-inline:.6rem .2rem;
  background:color-mix(in srgb,var(--c-ink-soft) 45%,transparent);
}
.pm-schritt__pfeil::after{
  content:"";position:absolute;right:0;top:50%;width:9px;height:9px;
  border-top:1px solid color-mix(in srgb,var(--c-ink-soft) 70%,transparent);
  border-right:1px solid color-mix(in srgb,var(--c-ink-soft) 70%,transparent);
  transform:translate(0,-50%) rotate(45deg);
}
.pm-schritt__body{padding-left:calc(clamp(56px,4.8vw,66px) + clamp(.8rem,1.4vw,1.2rem));margin-top:1.1rem}
.pm-schritt__body h3{font-family:var(--f-head);font-weight:400;font-size:clamp(1.2rem,1.55vw,1.4rem);white-space:nowrap;line-height:1.25;margin:0 0 .6rem;letter-spacing:-.01em}
.pm-schritt__body p{font-size:.93rem;line-height:1.55;color:var(--c-ink-soft);margin:0;max-width:none}
.pm-schritt__mehr{display:none}

.pm-schritt__chips{list-style:none;margin:1.6rem 0 0 -.5rem;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.pm-schritt__chips li{
  display:inline-flex;align-items:center;gap:.45rem;margin:0;
  padding:.4rem .7rem .4rem .5rem;border-radius:var(--radius-pill);
  background:color-mix(in srgb,var(--c-offer-card) 80%,transparent);
  border:1px solid var(--c-offer-line);
  font-size:.7rem;line-height:1.2;color:var(--c-ink);
}
.pm-schritt__chips .pm-icon{flex:none;color:var(--c-sage-deep)}

/* CTA mit Sessel-Foto */
.pm-ablauf__cta{
  position:relative;margin-top:clamp(2.4rem,4vw,3.2rem);
  min-height:clamp(420px,34vw,480px);
  padding-bottom:clamp(4.5rem,7vw,5.5rem);
}
.pm-ablauf__foto{
  position:absolute;top:0;bottom:clamp(1.5rem,3vw,2.5rem);left:var(--stage-l);z-index:0;
  width:min(50vw,660px);
}
.pm-ablauf__foto img{
  width:100%;height:100%;object-fit:cover;object-position:40% 50%;
  clip-path:url(#pm-clip-sessel);
  -webkit-mask-image:linear-gradient(to top,transparent 0,#000 18%);
          mask-image:linear-gradient(to top,transparent 0,#000 18%);
}
@media(min-width:1321px){
  .pm-ablauf__foto img{
    -webkit-mask-image:linear-gradient(to top,transparent 0,#000 18%),linear-gradient(to right,transparent 0,#000 12%);
            mask-image:linear-gradient(to top,transparent 0,#000 18%),linear-gradient(to right,transparent 0,#000 12%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}
.pm-ablauf__cta-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;min-height:inherit;align-items:center}
.pm-ablauf__cta-text{grid-column:2;padding-left:clamp(1rem,2vw,1.6rem);padding-block:2rem}
.pm-ablauf__cta-text h3{font-family:var(--f-head);font-weight:400;font-size:clamp(1.5rem,2.15vw,1.9rem);line-height:1.2;letter-spacing:-.012em;margin:0 0 1rem}
.pm-ablauf__cta-text p{font-size:.98rem;line-height:1.6;color:var(--c-ink-soft);margin:0 0 1.6rem}
.pm-ablauf__actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem}
.pm-ablauf .pm-btn{border-radius:var(--radius-pill);padding:1.05rem 2rem}
.pm-ablauf .pm-btn .pm-icon{color:currentColor}
.pm-ablauf__faq{display:inline-flex;align-items:center;gap:.4rem;font-size:.92rem;color:var(--c-sage-deep);text-decoration:underline;text-underline-offset:.25em}
.pm-ablauf__faq .pm-icon{color:currentColor}

.pm-ablauf__script{
  position:absolute;z-index:2;bottom:clamp(.8rem,1.6vw,1.4rem);
  left:calc(var(--stage-l) + clamp(14rem,24vw,21rem));
  margin:0;max-width:none;
  font-family:"Caveat",cursive;font-size:clamp(1.3rem,1.9vw,1.65rem);color:var(--c-sage-deep);
}
.pm-ablauf__script::after{
  content:"";display:block;width:48%;height:1px;margin-top:.25rem;background:var(--c-gold-line);
}

/* ---------- Handy ---------- */
@media(max-width:899px){
  .pm-ablauf{padding-top:2.6rem}
  .pm-ablauf__oben{width:82vw;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 48%),linear-gradient(to right,transparent 0,#000 22%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 48%),linear-gradient(to right,transparent 0,#000 22%)}
  .pm-ablauf__linie{width:78vw;height:92px}
  .pm-ablauf__band:not(.pm-ablauf__band--leise){display:none}
  .pm-ablauf__zweig--oben{right:-6px;top:110px;width:92px;transform:rotate(-40deg)}
  .pm-ablauf__head{padding-right:4.5rem}
  .pm-ablauf__head h2{font-size:clamp(1.9rem,8vw,2.4rem)}
  .pm-ablauf__head p:last-child{font-size:.86rem}

  .pm-ablauf__steps{grid-template-columns:1fr;gap:.85rem;margin-top:1.8rem}
  .pm-schritt{
    position:relative;display:grid;
    grid-template-columns:auto 1fr auto;grid-template-areas:"kopf body mehr" "chips chips chips";
    column-gap:.9rem;align-items:start;
    padding:.9rem .85rem .85rem;border-radius:12px;
    background:color-mix(in srgb,var(--c-offer-card) 85%,transparent);
    border:1px solid var(--c-offer-line);
  }
  .pm-schritt__kopf{grid-area:kopf;gap:.55rem}
  .pm-schritt__nr,.pm-schritt__icon{width:44px}
  .pm-schritt__nr{font-size:1.1rem}
  .pm-schritt__icon .pm-icon{width:22px;height:22px}
  .pm-schritt__pfeil{display:none}
  .pm-schritt__body{grid-area:body;padding:0;margin:0}
  .pm-schritt__body h3{font-size:1.08rem;margin:.2rem 0 .35rem;white-space:normal}
  .pm-schritt__body p{font-size:.78rem;line-height:1.5}
  .pm-schritt__mehr{
    grid-area:mehr;display:grid;place-items:center;align-self:start;margin-top:.35rem;
    width:28px;height:28px;color:var(--c-ink-soft);
  }
  .pm-schritt__mehr::after{content:"";position:absolute;inset:0;border-radius:12px}
  .pm-schritt__mehr .pm-icon{color:currentColor}
  .pm-schritt__chips{grid-area:chips;margin:.8rem 0 0;gap:.35rem}
  .pm-schritt__chips li{font-size:.64rem;padding:.35rem .6rem .35rem .45rem;gap:.3rem;position:relative;z-index:1}
  .pm-schritt__chips .pm-icon{width:12px;height:12px}

  .pm-ablauf__cta{min-height:0;padding-bottom:2.2rem;margin-top:1.6rem}
  .pm-ablauf__foto{position:relative;left:0;width:100%;height:clamp(190px,55vw,300px)}
  .pm-ablauf__foto img{clip-path:url(#pm-clip-sessel-m);object-position:55% 45%;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 30%);mask-image:linear-gradient(to bottom,transparent 0,#000 30%)}
  .pm-ablauf__cta-inner{display:block}
  .pm-ablauf__cta-text{padding:1.1rem 0 0}
  .pm-ablauf__cta-text h3{font-size:1.25rem;margin-bottom:.7rem}
  .pm-ablauf__cta-text p{font-size:.8rem;margin-bottom:1.3rem}
  .pm-ablauf__actions{flex-direction:column;align-items:stretch;gap:1rem}
  .pm-ablauf .pm-btn{justify-content:center}
  .pm-ablauf__faq{align-self:center;font-size:.8rem}
  .pm-ablauf__script{display:none}
  .pm-ablauf__zweig--unten{bottom:auto;top:calc(clamp(190px,55vw,300px) - 70px);right:-4px;width:84px}
}

/* ==========================================================================
   24. Block 4 "Über mich" — nach Vorlage (27.09.2026)
   Portrait: Gemini-Bild aus ihrem echten Foto (Subscription, 0 €).
   Liegt direkt auf dem Canvas, Formen statt Kasten (MASTER.md).
   ========================================================================== */
.pm-ueber{position:relative;isolation:isolate;padding-top:clamp(2rem,4vw,3rem)}
.pm-ueber__bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pm-ueber__band{fill:var(--c-ablauf-band);opacity:.75}
.pm-ueber__band--leise{opacity:.5}

/* Oben: Text links, Portrait rechts bis an die Bühnenkante */
.pm-ueber__top{position:static;min-height:clamp(430px,34vw,480px)}
.pm-ueber__text{position:relative;z-index:2;max-width:min(52%,600px);padding-top:clamp(1.5rem,3vw,2.6rem)}
.pm-ueber__text h2{font-weight:400;font-size:clamp(2.2rem,3.9vw,3.2rem);line-height:1.1;letter-spacing:-.015em;margin:0 0 1rem}
.pm-ueber__text p:not(.pm-offers__eyebrow){font-size:clamp(.98rem,1.2vw,1.08rem);line-height:1.6;color:var(--c-ink-soft);margin:0 0 1.6rem}
.pm-ueber__text strong{color:var(--c-ink);font-weight:500}
.pm-ueber .pm-btn{border-radius:var(--radius-pill);padding:1rem 1.9rem}
.pm-ueber .pm-btn .pm-icon{color:currentColor}

.pm-ueber__portrait{
  position:absolute;z-index:1;margin:0;
  top:0;right:var(--stage-l);width:min(46vw,640px);
}
.pm-ueber__portrait img{
  width:100%;height:auto;aspect-ratio:1400/1045;object-fit:cover;object-position:62% 40%;
  clip-path:url(#pm-clip-portrait);
}
@media(min-width:1321px){
  .pm-ueber__portrait img{
    -webkit-mask-image:linear-gradient(to left,transparent 0,#000 10%);
            mask-image:linear-gradient(to left,transparent 0,#000 10%);
  }
}
.pm-ueber__zweig--portrait{left:-38px;bottom:-54px;width:clamp(110px,10vw,140px);transform:rotate(-128deg);transform-origin:50% 50%;z-index:2}

/* Vier Werte */
.pm-ueber__werte{
  list-style:none;position:relative;z-index:2;
  margin-top:clamp(1.8rem,3vw,2.6rem);margin-bottom:0;padding-block:0;
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.8rem);
}
.pm-ueber__werte li{display:flex;align-items:center;gap:.9rem;margin:0}
.pm-ueber__wert-icon{
  flex:none;width:clamp(58px,4.8vw,68px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--c-sage-mist) 22%,var(--c-ablauf-bg));
}
.pm-ueber__wert-icon .pm-icon{color:var(--c-sage-deep)}
.pm-ueber__wert-text{font-size:.82rem;line-height:1.5;color:var(--c-ink-soft)}
.pm-ueber__wert-text strong{display:block;font-family:var(--f-head);font-weight:400;font-size:1.02rem;color:var(--c-ink);margin-bottom:.35rem;white-space:nowrap}

/* Unten: Sesselfoto links, Zitat rechts */
.pm-ueber__unten{
  position:relative;margin-top:clamp(2.2rem,4vw,3.2rem);
  min-height:clamp(400px,32vw,460px);padding-bottom:clamp(2rem,4vw,3rem);
}
.pm-ueber__foto{position:absolute;top:0;bottom:0;left:var(--stage-l);width:min(50vw,660px);z-index:0}
.pm-ueber__foto img{
  width:100%;height:100%;object-fit:cover;object-position:60% 55%;
  clip-path:url(#pm-clip-ecke);
  -webkit-mask-image:linear-gradient(to top,transparent 0,#000 14%);
          mask-image:linear-gradient(to top,transparent 0,#000 14%);
}
@media(min-width:1321px){
  .pm-ueber__foto img{
    -webkit-mask-image:linear-gradient(to top,transparent 0,#000 14%),linear-gradient(to right,transparent 0,#000 12%);
            mask-image:linear-gradient(to top,transparent 0,#000 14%),linear-gradient(to right,transparent 0,#000 12%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}
.pm-ueber__unten-inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;min-height:inherit;align-items:center}
.pm-ueber__zitat{grid-column:2;position:relative;margin:0;padding:2.4rem 0 1rem clamp(2.4rem,4vw,3.4rem);border:0;font-style:normal;background:none}
.pm-ueber__zitat *{font-style:normal}
.pm-ueber__zitat::before{
  content:"\201C";position:absolute;left:0;top:1.6rem;
  font-family:var(--f-head);font-size:clamp(3.4rem,5vw,4.4rem);line-height:1;color:var(--c-sage-deep);
}
.pm-ueber__satz{
  font-family:"Caveat",cursive;font-size:clamp(1.7rem,2.5vw,2.2rem);line-height:1.3;color:var(--c-sage-deep);
  margin:0 0 1.2rem;max-width:none;
}
.pm-ueber__satz::after{content:"";display:block;width:90px;height:1px;margin-top:1.1rem;background:var(--c-gold-line)}
.pm-ueber__lauf{font-size:.93rem;line-height:1.65;color:var(--c-ink-soft);margin:0 0 1.8rem;max-width:440px}
.pm-ueber__zitat footer{display:flex;flex-direction:column;gap:.35rem}
.pm-ueber__signatur{font-family:"Caveat",cursive;font-size:clamp(1.8rem,2.6vw,2.3rem);line-height:1;color:var(--c-ink)}
.pm-ueber__rolle{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--c-ink-soft)}
.pm-ueber__zweig--unten{right:calc(var(--stage-l) + 14px);bottom:0;width:clamp(120px,11vw,160px);transform:rotate(-18deg)}

.pm-themen-alt{padding-top:clamp(2rem,4vw,3rem)}

@media(max-width:1100px){
  .pm-ueber__werte{grid-template-columns:repeat(2,1fr)}
}

/* ---------- Handy ---------- */
@media(max-width:899px){
  .pm-ueber{padding-top:2rem}
  .pm-ueber__top{min-height:0}
  .pm-ueber__text{max-width:none;padding-top:0}
  .pm-ueber__text h2{font-size:clamp(1.9rem,8vw,2.4rem)}
  .pm-ueber__text p:not(.pm-offers__eyebrow){font-size:.86rem;margin-bottom:1.2rem}
  .pm-ueber .pm-btn{padding:.8rem 1.4rem;font-size:.88rem}
  .pm-ueber__portrait{position:relative;right:auto;width:100%;margin-top:1.6rem}
  .pm-ueber__portrait img{object-position:66% 40%}
  .pm-ueber__zweig--portrait{left:-22px;bottom:-30px;width:78px}
  .pm-ueber__werte{grid-template-columns:1fr;gap:.9rem;margin-top:1.8rem}
  .pm-ueber__wert-icon{width:54px}
  .pm-ueber__wert-icon .pm-icon{width:22px;height:22px}
  .pm-ueber__band{display:none}
  .pm-ueber__unten{min-height:0;margin-top:1.4rem;padding-bottom:1.6rem}
  .pm-ueber__foto{display:none}
  .pm-ueber__unten-inner{display:block}
  .pm-ueber__zitat{padding:1.6rem 0 0 2.4rem}
  .pm-ueber__zitat::before{top:1.2rem;font-size:3rem}
  .pm-ueber__satz{font-size:1.5rem}
  .pm-ueber__lauf{font-size:.82rem}
  .pm-ueber__zweig--unten{right:-8px;bottom:auto;top:-70px;width:62px}
}

/* ==========================================================================
   25. Block 5 "Meine Themen" — nach Vorlage (27.09.2026)
   8 Karten → je eine Landingpage /themen/{slug}/ (Daten: pm_themen()).
   Bilder: Gemini-App (Subscription, 0 €), einheitlicher Look.
   ========================================================================== */
.pm-themen{position:relative;isolation:isolate;padding:clamp(2.4rem,4vw,3.4rem) 0 clamp(2.6rem,4vw,3.4rem)}
.pm-themen__bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pm-themen__band{fill:var(--c-ablauf-band);opacity:.7}
.pm-themen__band--leise{opacity:.5}

.pm-themen__kopfbild{
  position:absolute;z-index:0;top:0;right:var(--stage-l);
  width:min(46vw,620px);height:auto;pointer-events:none;
  clip-path:url(#pm-clip-themen-kopf);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22%),linear-gradient(to right,transparent 0,#000 20%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 22%),linear-gradient(to right,transparent 0,#000 20%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
@media(min-width:1321px){
  .pm-themen__kopfbild{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 22%),linear-gradient(to right,transparent 0,#000 20%,#000 90%,transparent 100%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 22%),linear-gradient(to right,transparent 0,#000 20%,#000 90%,transparent 100%);
  }
}
.pm-themen__zweig--kopf{right:calc(var(--stage-l) + min(40vw,540px));top:20px;width:clamp(100px,9vw,130px);transform:rotate(-40deg)}
.pm-themen__zweig--links{left:calc(var(--stage-l) - 10px);bottom:90px;width:clamp(90px,8vw,120px);transform:rotate(30deg)}

.pm-themen__inner{position:relative;z-index:2}

/* Kopf */
.pm-themen__kopf{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:end;margin-bottom:clamp(1.6rem,3vw,2.2rem)}
.pm-themen__intro h2{font-weight:400;font-size:clamp(2.2rem,3.9vw,3.2rem);line-height:1.08;letter-spacing:-.015em;margin:0 0 1rem;max-width:560px}
.pm-themen__intro p:not(.pm-offers__eyebrow){font-size:clamp(.96rem,1.15vw,1.05rem);line-height:1.6;color:var(--c-ink-soft);margin:0 0 1.5rem;max-width:560px}
.pm-themen .pm-btn{border-radius:var(--radius-pill);padding:1rem 1.9rem}
.pm-themen .pm-btn .pm-icon{color:currentColor}
.pm-themen__motto{
  font-family:"Caveat",cursive;font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.4;color:var(--c-ink);
  margin:0 0 .4rem;max-width:340px;justify-self:start;
}
.pm-themen__motto::after{content:"";display:block;width:100px;height:1px;margin-top:.8rem;background:var(--c-gold-line)}

/* Karten */
.pm-themen__grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.8rem,1.4vw,1.1rem)}
.pm-thema{
  position:relative;margin:0;display:grid;
  grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"bild bild" "icon icon" "titel pfeil" "text text";
  background:color-mix(in srgb,var(--c-offer-card) 88%,transparent);
  border:1px solid var(--c-offer-line);border-radius:12px;overflow:hidden;
  padding-bottom:1.1rem;align-content:start;
  transition:transform .35s var(--ease-out-expo),box-shadow .35s var(--ease-out-expo);
}
.pm-thema:hover{transform:translateY(-3px);box-shadow:0 14px 30px -20px var(--c-offer-shadow)}
.pm-thema__bild{grid-area:bild;aspect-ratio:2.35/1;overflow:hidden}
.pm-thema__bild img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out-expo)}
.pm-thema:hover .pm-thema__bild img{transform:scale(1.04)}
.pm-thema__icon{
  grid-area:icon;justify-self:start;margin:-26px 0 0 .9rem;position:relative;z-index:1;
  width:50px;height:50px;border-radius:50%;display:grid;place-items:center;
  background:var(--c-offer-card);border:1px solid var(--c-offer-line);
}
.pm-thema__icon .pm-icon{color:var(--c-sage-deep)}
.pm-thema__titel{grid-area:titel;margin:.55rem 0 0 1.1rem;min-height:2.5em;display:flex;align-items:center;font-family:var(--f-head);font-weight:400;font-size:clamp(1.05rem,1.35vw,1.22rem);line-height:1.25;letter-spacing:-.01em}
.pm-thema__titel a{color:var(--c-ink);text-decoration:none}
.pm-thema__titel a::after{content:"";position:absolute;inset:0;border-radius:12px}
.pm-thema__titel a:focus-visible{outline:none}
.pm-thema:focus-within{outline:2px solid var(--c-focus);outline-offset:2px}
.pm-thema__pfeil{
  grid-area:pfeil;align-self:center;margin:.55rem .9rem 0 .5rem;
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:var(--c-sage-deep);color:#fff;transition:background .25s var(--ease),transform .25s var(--ease);
}
.pm-thema__pfeil .pm-icon{color:#fff}
.pm-thema:hover .pm-thema__pfeil{background:var(--c-ink);transform:translateX(2px)}
.pm-thema__text{grid-area:text;margin:.55rem 1.1rem 0;font-size:.8rem;line-height:1.5;color:var(--c-ink-soft);max-width:none}

/* Nummer neben dem Icon, in der Icon-Zeile */
.pm-thema__nr{grid-area:icon;font-size:.8rem;color:var(--c-ink-soft);justify-self:start;align-self:end;margin:0 0 .15rem calc(.9rem + 60px)}

/* Fuß */
.pm-themen__fuss{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;margin-top:clamp(1.8rem,3vw,2.4rem)}
.pm-themen__zitat{position:relative;margin:0;padding:0 0 0 clamp(2.4rem,4vw,3.2rem);border:0;background:none;font-style:normal}
.pm-themen__zitat::before{content:"\201C";position:absolute;left:0;top:-.4rem;font-family:var(--f-head);font-size:clamp(3rem,4.4vw,4rem);line-height:1;color:var(--c-sage-deep)}
.pm-themen__zitat p{font-family:"Caveat",cursive;font-style:normal;font-size:clamp(1.4rem,2vw,1.8rem);line-height:1.35;color:var(--c-ink);margin:0;max-width:none}
.pm-themen__zitat p::after{content:"";display:block;width:100px;height:1px;margin-top:.8rem;background:var(--c-gold-line)}
.pm-themen__cta p{font-size:.82rem;line-height:1.55;color:var(--c-ink-soft);margin:0 0 1rem;max-width:none}
.pm-themen a.pm-themen__cta-btn{background:transparent;color:var(--c-ink);border:1px solid var(--c-ink-soft);padding:.85rem 1.7rem;font-size:.88rem}
.pm-themen a.pm-themen__cta-btn:hover{background:var(--c-sage-deep);border-color:var(--c-sage-deep);color:#fff}

@media(max-width:1100px){
  .pm-themen__grid{grid-template-columns:repeat(2,1fr)}
}

/* ---------- Handy: kompakte Liste ---------- */
@media(max-width:899px){
  .pm-themen{padding-top:calc(34vw + .6rem)}
  .pm-themen__kopfbild{width:66vw}
  .pm-themen__zweig--kopf{right:-6px;left:auto;top:calc(24vw);width:64px;transform:rotate(-30deg)}
  .pm-themen__zweig--links{display:none}
  .pm-themen__band{display:none}
  .pm-themen__kopf{grid-template-columns:1fr;gap:1rem}
  .pm-themen__intro h2{font-size:clamp(1.9rem,8vw,2.4rem);padding-right:2.5rem}
  .pm-themen__intro p:not(.pm-offers__eyebrow){font-size:.86rem}
  .pm-themen .pm-btn{padding:.85rem 1.5rem;font-size:.9rem}
  .pm-themen__motto{display:none}

  .pm-themen__grid{grid-template-columns:1fr;gap:.55rem}
  .pm-thema{
    grid-template-columns:62px 40px auto 1fr auto;grid-template-areas:"bild icon nr titel pfeil";
    align-items:center;column-gap:.6rem;padding:4px .6rem 4px 4px;border-radius:10px;
  }
  .pm-thema__bild{aspect-ratio:1;border-radius:7px;align-self:stretch}
  .pm-thema__icon{grid-area:icon;margin:0;width:38px;height:38px;justify-self:center}
  .pm-thema__icon .pm-icon{width:18px;height:18px}
  .pm-thema__nr{grid-area:nr;margin:0;align-self:center;font-size:.72rem}
  .pm-thema__titel{grid-area:titel;margin:0;font-size:.92rem;line-height:1.25}
  .pm-thema__pfeil{grid-area:pfeil;margin:0;width:30px;height:30px}
  .pm-thema__text{display:none}

  .pm-themen__fuss{grid-template-columns:1fr;gap:1.4rem;margin-top:1.8rem}
  .pm-themen__zitat p{font-size:1.35rem}
  .pm-themen a.pm-themen__cta-btn{
    display:flex;justify-content:center;width:100%;
    background:var(--c-sage-deep);border-color:var(--c-sage-deep);color:#fff;padding:1rem 1.4rem;font-size:.95rem;
  }
}

/* Noch nicht neu gestaltete Sections liegen bis zu ihrem Redesign auf dem Canvas
   statt als farbige Rechtecke (MASTER.md: keine harten Kanten). */
body.home .pm-section--tint{background:transparent}
.pm-thema__titel{hyphens:auto;-webkit-hyphens:auto}

/* ==========================================================================
   26. THEMEN-LANDINGPAGE-SYSTEM (.pmt-) — Master „Ängste und innere Unruhe“
   Eine Vorlage (page-thema.php) für alle Themen. Nur Tokens aus :root.
   Doku: design-system/pages/thema.md
   ========================================================================== */
body.pm-canvas{background:var(--c-offers-bg);overflow-x:clip}
body.pm-canvas #pm-main{background:transparent}
.pmt-defs{position:absolute;width:0;height:0;overflow:hidden}

.pmt{--pmt-bild:min(48vw,640px);--pmt-gap:clamp(3rem,6vw,5rem)}
.pmt section{position:relative;isolation:isolate}
:where(.pmt) h1{font-weight:400;font-size:clamp(2.4rem,4.6vw,3.6rem);line-height:1.06;letter-spacing:-.02em;margin:0 0 1rem}
:where(.pmt) h2{font-weight:400;font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1.15;letter-spacing:-.015em;margin:0 0 .9rem}
:where(.pmt) h3{font-family:var(--f-head);font-weight:400;font-size:1.15rem;line-height:1.3;margin:0 0 .4rem}
:where(.pmt) p{color:var(--c-ink-soft);font-size:.98rem;line-height:1.65}
:where(.pmt) p a{color:var(--c-sage-deep)}
.pmt-btn{border-radius:var(--radius-pill);padding:1rem 1.9rem}
.pmt-btn .pm-icon{color:currentColor}

/* Icon-Kreis — ein Stil für Vertrauen, Anzeichen */
.pmt-rund{
  flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
  background:color-mix(in srgb,var(--c-sage-mist) 22%,var(--c-ablauf-bg));
}
.pmt-rund .pm-icon{color:var(--c-sage-deep)}
.pmt-rund--gross{width:clamp(62px,5vw,74px);height:clamp(62px,5vw,74px);background:color-mix(in srgb,var(--c-offer-card) 70%,transparent);border:1px solid var(--c-offer-line)}

/* Organische Bänder hinter Sektionen */
.pmt-band{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pmt-band path{fill:var(--c-ablauf-band);opacity:.7}
.pmt-band--leise path{opacity:.45}

/* Bild-Bühne: Fotos laufen an die 1320px-Bühnenkante, Maske weich */
.pmt figure{margin:0;position:absolute;z-index:0}
.pmt figure img{width:100%;height:100%;object-fit:cover}

/* Checkliste mit Blatt */
.pmt-check{list-style:none;margin:1.2rem 0 0;padding:0;display:grid;gap:.7rem}
.pmt-check li{display:flex;gap:.8rem;align-items:flex-start;font-size:.93rem;line-height:1.45;color:var(--c-ink);margin:0}
.pmt-check .pm-icon{flex:none;margin-top:.1rem;color:var(--c-sage-deep)}

.pmt-kopf-mitte{text-align:center;max-width:720px;margin:0 auto clamp(1.6rem,3vw,2.2rem)}
.pmt-kopf-mitte p{margin:0 auto;font-size:.9rem}

.pmt-zweig{position:absolute;z-index:1}

/* ---------- 02 Hero ---------- */
.pmt-hero{padding:clamp(2.2rem,4vw,3.4rem) 0 clamp(2rem,4vw,3rem);min-height:clamp(500px,41vw,580px)}
.pmt-hero__bild{top:0;right:var(--stage-l);width:min(50vw,680px);aspect-ratio:1024/687}
.pmt-hero__bild img{clip-path:url(#pmt-clip-hero);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%);mask-image:linear-gradient(to bottom,transparent 0,#000 12%)}
.pmt-zweig--hero{right:calc(var(--stage-l) + min(41vw,560px));top:clamp(330px,29vw,410px);width:clamp(90px,7.5vw,112px);transform:rotate(-115deg)}
.pmt-hero__inner{position:relative;z-index:2}
.pmt-hero__inner > *{max-width:min(46%,520px)}
.pmt-crumbs{display:flex;gap:.5rem;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink-soft);margin-bottom:1.2rem}
.pmt-crumbs a{color:var(--c-rose);text-decoration:none}
.pmt-crumbs a:hover{text-decoration:underline}
.pmt-hero__unter{font-size:clamp(1.05rem,1.4vw,1.2rem);line-height:1.45;color:var(--c-ink);margin:0 0 .8rem}
.pmt-hero__intro{font-size:.92rem;margin:0 0 1.5rem}
.pmt-vertrauen{list-style:none;margin:1.6rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:1.4rem}
.pmt-vertrauen li{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:var(--c-ink);margin:0}
.pmt-hero__motto{
  position:absolute;z-index:2;right:calc(var(--stage-l) + 2rem);bottom:clamp(.5rem,2vw,1.6rem);
  width:min(22vw,280px);margin:0;
  font-family:"Caveat",cursive;font-size:clamp(1.25rem,1.7vw,1.55rem);line-height:1.4;color:var(--c-ink);
}
.pmt-hero__motto::after{content:"";display:block;width:90px;height:1px;margin-top:.7rem;background:var(--c-gold-line)}

/* ---------- 03 Was ---------- */
.pmt-was{padding-block:clamp(1.5rem,3vw,2.5rem) clamp(2.5rem,5vw,4rem);min-height:clamp(300px,24vw,340px)}
.pmt-was__bild{top:0;right:var(--stage-l);width:min(44vw,600px);height:clamp(250px,22vw,300px)}
.pmt-was__bild img{clip-path:url(#pmt-clip-pille)}
.pmt-was__text{position:relative;z-index:2;max-width:min(50%,540px)}

/* ---------- 04 Anzeichen ---------- */
.pmt-anzeichen{padding-block:clamp(2.6rem,5vw,3.6rem)}
.pmt-anzeichen__liste{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.pmt-anzeichen__liste li{display:flex;flex-direction:column;align-items:center;gap:.8rem;text-align:center;font-size:.84rem;line-height:1.35;color:var(--c-ink);margin:0}
.pmt-hinweis{text-align:center;font-size:.78rem;margin:1.6rem auto 0;max-width:620px}

/* ---------- 05 Unterstützung ---------- */
.pmt-hilfe{padding-block:clamp(2.5rem,5vw,4rem);min-height:clamp(400px,32vw,460px)}
.pmt-hilfe__bild{top:0;bottom:0;left:var(--stage-l);width:min(46vw,620px)}
.pmt-hilfe__bild img{clip-path:url(#pmt-clip-links);object-position:40% 45%}
.pmt-hilfe__text{position:relative;z-index:2;margin-left:auto;max-width:min(48%,520px)}

/* ---------- 06 Weg ---------- */
.pmt-weg{padding-block:clamp(2.6rem,5vw,3.6rem)}
.pmt-schritte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.8rem)}
.pmt-schritte li{margin:0}
.pmt-schritte__kopf{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.pmt-nr{flex:none;width:clamp(48px,4vw,56px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
  background:var(--c-offer-badge);color:#fff;font-family:var(--f-head);font-size:1.15rem}
.pmt-schritte__pfeil{position:relative;flex:1;height:1px;background:color-mix(in srgb,var(--c-ink-soft) 45%,transparent)}
.pmt-schritte__pfeil::after{content:"";position:absolute;right:0;top:50%;width:8px;height:8px;
  border-top:1px solid var(--c-ink-soft);border-right:1px solid var(--c-ink-soft);transform:translate(0,-50%) rotate(45deg)}
.pmt-schritte p{font-size:.86rem;margin:0}

/* ---------- 07 Für wen ---------- */
.pmt-fuer{padding-block:clamp(2.5rem,5vw,4rem);min-height:clamp(380px,30vw,430px)}
.pmt-fuer__bild{top:0;bottom:0;left:var(--stage-l);width:min(44vw,600px)}
.pmt-fuer__bild img{clip-path:url(#pmt-clip-welle)}
.pmt-zweig--fuer{right:calc(var(--stage-l) + 10px);top:0;width:clamp(96px,8vw,130px);transform:rotate(-20deg)}
.pmt-fuer__text{position:relative;z-index:2;margin-left:auto;max-width:min(52%,560px)}

/* ---------- 08 FAQ ---------- */
.pmt-faq{padding-block:clamp(2rem,4vw,3rem);min-height:clamp(360px,28vw,420px)}
.pmt-faq__bild{top:0;bottom:0;right:var(--stage-l);width:min(40vw,540px)}
.pmt-faq__bild img{clip-path:url(#pmt-clip-rechts);object-position:60% 55%}
.pmt-faq__text{position:relative;z-index:2;max-width:min(52%,560px)}
.pmt-akkordeon{display:grid;gap:.55rem}
.pmt-akkordeon details{
  background:color-mix(in srgb,var(--c-offer-card) 85%,transparent);
  border:1px solid var(--c-offer-line);border-radius:10px;
}
.pmt-akkordeon summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.8rem 1rem;font-size:.88rem;color:var(--c-ink);
}
.pmt-akkordeon summary::-webkit-details-marker{display:none}
.pmt-plus{position:relative;flex:none;width:14px;height:14px}
.pmt-plus::before,.pmt-plus::after{content:"";position:absolute;left:0;top:50%;width:14px;height:1.4px;background:var(--c-ink);transition:transform .3s var(--ease)}
.pmt-plus::after{transform:rotate(90deg)}
.pmt-akkordeon details[open] .pmt-plus::after{transform:rotate(0)}
.pmt-akkordeon details p{margin:0;padding:0 1rem 1rem;font-size:.86rem}

/* ---------- 09 Abschluss ---------- */
.pmt-cta{padding-block:clamp(2.5rem,5vw,3.6rem)}
.pmt-cta__inner{display:grid;grid-template-columns:1.3fr .7fr;gap:2rem;align-items:center;padding-left:clamp(0rem,6vw,5rem)}
.pmt-cta__inner p{margin:0 0 1.4rem}
.pmt-vertrauen--spalte{flex-direction:column;gap:.9rem;margin:0}
.pmt-zweig--cta{left:calc(var(--stage-l) + 10px);bottom:0;width:clamp(96px,8vw,130px);transform:rotate(40deg)}

/* ---------- 10 Weitere Themen ---------- */
.pmt-weitere{padding-block:clamp(1.5rem,3vw,2.5rem) clamp(3rem,6vw,4.5rem)}
.pmt-weitere h2{margin-bottom:1.4rem}
.pmt-weitere__grid{grid-template-columns:repeat(3,1fr)}

@media(min-width:1321px){
  .pmt-hero__bild img{-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%),linear-gradient(to left,transparent 0,#000 10%);
    mask-image:linear-gradient(to bottom,transparent 0,#000 12%),linear-gradient(to left,transparent 0,#000 10%);-webkit-mask-composite:source-in;mask-composite:intersect}
  .pmt-was__bild img,.pmt-faq__bild img{-webkit-mask-image:linear-gradient(to left,transparent 0,#000 12%);mask-image:linear-gradient(to left,transparent 0,#000 12%)}
  .pmt-hilfe__bild img,.pmt-fuer__bild img{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 12%);mask-image:linear-gradient(to right,transparent 0,#000 12%)}
}
@media(max-width:1100px){
  .pmt-anzeichen__liste{grid-template-columns:repeat(3,1fr);row-gap:1.6rem}
  .pmt-schritte{grid-template-columns:repeat(2,1fr);row-gap:2rem}
  .pmt-schritte li:nth-child(2) .pmt-schritte__pfeil{visibility:hidden}
}

/* ---------- Handy: eigener Aufbau, nicht verkleinert ---------- */
@media(max-width:899px){
  .pmt figure{position:relative;left:auto;right:auto;top:auto;bottom:auto}
  .pmt .pmt-hero__bild{position:absolute;top:0;right:0;left:auto;margin:0}
  .pmt-hero{min-height:0;padding:1.6rem 0 1rem}
  .pmt-hero__bild{position:absolute;top:0;right:0;width:46vw;aspect-ratio:3/4}
  .pmt-hero__bild img{object-position:62% 30%}
  .pmt-zweig--hero{right:-10px;left:auto;top:calc(46vw * 1.1);width:64px;transform:rotate(-30deg)}
  .pmt-hero__inner > *{max-width:none}
  .pmt-crumbs,.pmt-hero h1,.pmt-hero__unter{padding-right:44vw}
  .pmt-crumbs{font-size:.62rem}
  :where(.pmt) h1{font-size:clamp(1.8rem,7.4vw,2.3rem)}
  .pmt-hero__unter{font-size:.92rem}
  .pmt-hero__intro{font-size:.84rem}
  .pmt-vertrauen{justify-content:space-between;gap:.6rem}
  .pmt-vertrauen li{flex-direction:column;gap:.4rem;font-size:.72rem;text-align:center}
  .pmt-hero__motto{display:none}

  .pmt-was,.pmt-hilfe,.pmt-fuer,.pmt-faq{min-height:0;padding-block:1.8rem;display:flex;flex-direction:column}
  .pmt-was .pm-wrap,.pmt-hilfe .pm-wrap,.pmt-fuer .pm-wrap,.pmt-faq .pm-wrap{order:1}
  .pmt .pmt-was__bild,.pmt .pmt-hilfe__bild,.pmt .pmt-fuer__bild,.pmt .pmt-faq__bild{order:2;width:calc(100% - 2rem);margin:1.2rem auto 0;height:clamp(170px,48vw,240px)}
  .pmt .pmt-hilfe__bild,.pmt .pmt-fuer__bild,.pmt .pmt-faq__bild{display:none}
  .pmt-was__text,.pmt-hilfe__text,.pmt-fuer__text,.pmt-faq__text{max-width:none;margin:0}
  :where(.pmt) h2{font-size:clamp(1.45rem,6.2vw,1.8rem)}
  :where(.pmt) p{font-size:.86rem}

  .pmt-anzeichen{padding-block:2rem}
  .pmt-kopf-mitte{text-align:left;margin-bottom:1.2rem}
  .pmt-kopf-mitte p{margin:0}
  .pmt-anzeichen__liste{grid-template-columns:1fr;gap:.7rem}
  .pmt-anzeichen__liste li{flex-direction:row;text-align:left;gap:1rem;font-size:.88rem}
  .pmt-rund--gross{width:44px;height:44px}
  .pmt-rund--gross .pm-icon{width:20px;height:20px}
  .pmt-hinweis{text-align:left;margin-left:0}

  .pmt-schritte{grid-template-columns:1fr;row-gap:1.1rem}
  .pmt-schritte li{display:grid;grid-template-columns:auto 1fr;column-gap:1rem;align-items:start}
  .pmt-schritte__kopf{grid-row:1 / span 2;margin:0}
  .pmt-schritte__pfeil{display:none}
  .pmt-nr{width:44px;font-size:1rem}
  .pmt-schritte h3{margin:.1rem 0 .2rem;font-size:1.05rem}

  .pmt-zweig--fuer,.pmt-zweig--cta{display:none}
  .pmt-cta__inner{grid-template-columns:1fr;padding-left:clamp(1rem,4vw,2rem);gap:1.4rem}
  .pmt-cta .pmt-btn{display:flex;justify-content:center}
  .pmt-vertrauen--spalte{flex-direction:row;justify-content:space-between}
  .pmt-weitere__grid{grid-template-columns:1fr}
}

/* 26b. Fotos der Themenseiten: oben/unten weich — keine gerade Kante (MASTER.md) */
.pmt-hilfe__bild img,.pmt-fuer__bild img,.pmt-faq__bild img,.pmt-was__bild img{
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%);
          mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%);
}
@media(min-width:1321px){
  .pmt-was__bild img,.pmt-faq__bild img{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(to left,transparent 0,#000 12%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(to left,transparent 0,#000 12%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
  .pmt-hilfe__bild img,.pmt-fuer__bild img{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(to right,transparent 0,#000 12%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(to right,transparent 0,#000 12%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}

/* 26c. Lange Themen-Titel (z. B. „Niedergeschlagenheit“) — Silbentrennung statt Überlauf */
.pmt-hero h1,.pmt h2{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word}
@media(max-width:899px){
  .pmt .pmt-hero h1{font-size:clamp(1.65rem,6.6vw,2.1rem)}
  .pmt-crumbs span[aria-current],.pmt-crumbs span[aria-hidden]{display:none}
}

/* 27. Kein seitliches Verschieben auf dem Handy (27.09.2026)
   Dekor (Blobs, Zweige, Bänder) ragt bewusst über den Rand. overflow-x:clip auf
   <body> wird auf Mobilgeräten nicht auf den Viewport übertragen — das Dokument
   wurde 562px breit und ließ sich wischen. Geclippt wird deshalb am Inhalts-
   Container selbst (nur X-Achse, vertikal laufen die Formen weiter über Sections). */
html{overflow-x:clip}
#pm-main{overflow-x:clip;overflow-y:visible}

/* ==========================================================================
   28. Block 6 "Ausbildung und Qualifikationen" — nach Vorlage (27.09.2026)
   Nur belegte Angaben (pm_qualifikation()). Echte Zertifikat-Scans.
   ========================================================================== */
.pm-quali{position:relative;isolation:isolate;padding:clamp(2.6rem,4.5vw,3.6rem) 0 clamp(2.6rem,4.5vw,3.6rem)}
.pm-quali__bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pm-quali__band{fill:var(--c-ablauf-band);opacity:.7}
.pm-quali__band--leise{opacity:.5}
.pm-quali__kopfbild{
  position:absolute;z-index:0;top:0;right:var(--stage-l);width:min(52vw,720px);height:auto;pointer-events:none;
  clip-path:url(#pm-clip-quali);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%);mask-image:linear-gradient(to bottom,transparent 0,#000 16%);
}
@media(min-width:1321px){
  .pm-quali__kopfbild{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%),linear-gradient(to left,transparent 0,#000 10%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 16%),linear-gradient(to left,transparent 0,#000 10%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}
.pm-quali__zweig--kopf{right:calc(var(--stage-l) + min(40vw,560px));top:clamp(230px,20vw,280px);width:clamp(100px,8.5vw,130px);transform:rotate(-130deg)}
.pm-quali__zweig--rechts{right:calc(var(--stage-l) - 10px);top:clamp(520px,44vw,620px);width:clamp(80px,7vw,110px);transform:rotate(-20deg)}
.pm-quali__inner{position:relative;z-index:2}

.pm-quali__head{max-width:min(46%,560px);min-height:clamp(320px,26vw,380px)}
.pm-quali__head h2{font-weight:400;font-size:clamp(2.1rem,3.6vw,3rem);line-height:1.1;letter-spacing:-.015em;margin:0 0 1rem}
.pm-quali__head p:not(.pm-offers__eyebrow){font-size:clamp(.96rem,1.15vw,1.05rem);line-height:1.6;color:var(--c-ink-soft);margin:0 0 1.5rem}
.pm-quali .pm-btn{border-radius:var(--radius-pill);padding:1rem 1.9rem}
.pm-quali .pm-btn .pm-icon{color:currentColor}

.pm-quali__werte{list-style:none;margin:clamp(1.4rem,2.5vw,2rem) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2vw,1.8rem)}
.pm-quali__werte li{display:flex;align-items:center;gap:.9rem;margin:0}

.pm-quali__zwei{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(1.6rem,4vw,3.5rem);margin-top:clamp(2rem,3.5vw,2.8rem)}
.pm-quali__zwei h3{font-family:var(--f-head);font-weight:400;font-size:clamp(1.5rem,2.2vw,1.9rem);letter-spacing:-.01em;margin:0 0 1.2rem}
.pm-quali__zwei h3 span{font-size:.8em}

/* Zeitleiste */
.pm-zeitleiste{list-style:none;margin:0;padding:0;position:relative}
.pm-zeitleiste::before{content:"";position:absolute;left:6px;top:.6rem;bottom:.6rem;width:1px;background:var(--c-offer-badge);opacity:.7}
.pm-zeitleiste li{position:relative;display:grid;grid-template-columns:7.5rem 1fr;gap:1rem;padding:0 0 1.35rem 2rem;margin:0}
.pm-zeitleiste li::before{content:"";position:absolute;left:0;top:.45rem;width:13px;height:13px;border-radius:50%;background:var(--c-offer-badge);border:2px solid var(--c-offers-bg)}
.pm-zeitleiste__jahr{font-size:.86rem;color:var(--c-ink);padding-top:.1rem}
.pm-zeitleiste__text{font-size:.8rem;line-height:1.45;color:var(--c-ink-soft)}
.pm-zeitleiste__text strong{display:block;font-family:var(--f-head);font-weight:400;font-size:1.02rem;color:var(--c-ink);margin-bottom:.15rem}

/* Karussell */
.pm-karussell{position:relative;padding:0 2.6rem}
.pm-karussell__spur{
  list-style:none;margin:0;padding:.3rem .1rem .6rem;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2rem) / 3);column-gap:1rem;
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;
}
.pm-karussell__spur::-webkit-scrollbar{display:none}
.pm-karussell__spur li{scroll-snap-align:start;margin:0;text-align:center;display:flex;flex-direction:column;gap:.2rem}
.pm-zert{
  display:block;padding:5px;border:1px solid var(--c-offer-line);border-radius:6px;background:var(--c-offer-card);cursor:zoom-in;
  box-shadow:0 10px 24px -18px var(--c-offer-shadow);transition:transform .35s var(--ease-out-expo);
}
.pm-zert:hover{transform:translateY(-3px)}
.pm-zert img{width:100%;aspect-ratio:1.4;object-fit:cover;border-radius:3px}
.pm-karussell__spur strong{font-family:var(--f-head);font-weight:400;font-size:.92rem;line-height:1.3;color:var(--c-ink);margin-top:.5rem}
.pm-karussell__spur span{font-size:.74rem;color:var(--c-ink-soft)}
.pm-karussell__pfeil{
  position:absolute;top:calc(50% - 2.4rem);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
  background:var(--c-offer-card);border:1px solid var(--c-offer-line);color:var(--c-ink);cursor:pointer;padding:0;
}
.pm-karussell__pfeil .pm-icon{color:currentColor}
.pm-karussell__pfeil--l{left:0}
.pm-karussell__pfeil--l .pm-icon{transform:rotate(180deg)}
.pm-karussell__pfeil--r{right:0}
.pm-karussell__pfeil:hover{background:var(--c-sage-deep);border-color:var(--c-sage-deep);color:#fff}
.pm-karussell__punkte{display:flex;justify-content:center;gap:.5rem;margin-top:.8rem}
.pm-karussell__punkte i{width:7px;height:7px;border-radius:50%;background:var(--c-surface-2)}
.pm-karussell__punkte i.ist-aktiv{background:var(--c-offer-badge)}

.pm-quali__notiz{
  display:flex;align-items:center;gap:1.2rem;margin-top:1.6rem;padding:1.1rem 1.4rem;border-radius:24px;
  background:color-mix(in srgb,var(--c-ablauf-band) 55%,transparent);
}
.pm-quali__notiz p{margin:0;max-width:none;font-family:"Caveat",cursive;font-size:clamp(1.15rem,1.5vw,1.35rem);line-height:1.4;color:var(--c-ink)}

/* Lightbox */
.pm-lightbox{border:0;padding:0;background:transparent;max-width:min(92vw,1100px);max-height:90vh;overflow:visible}
.pm-lightbox::backdrop{background:color-mix(in srgb,var(--c-ink) 72%,transparent)}
.pm-lightbox img{display:block;max-width:min(92vw,1100px);max-height:86vh;width:auto;height:auto;border-radius:6px;box-shadow:0 30px 60px -20px rgba(0,0,0,.5)}
.pm-lightbox__zu{
  position:absolute;top:-14px;right:-14px;width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;
  background:var(--c-offer-card);color:var(--c-ink);font-size:1.5rem;line-height:1;
}

@media(max-width:1100px){
  .pm-quali__werte{grid-template-columns:repeat(2,1fr)}
  .pm-quali__zwei{grid-template-columns:1fr}
}

/* ---------- Handy ---------- */
@media(max-width:899px){
  .pm-quali{padding-top:calc(40vw + .6rem)}
  .pm-quali__kopfbild{width:78vw}
  .pm-quali__zweig--kopf{right:-6px;top:30vw;width:66px;transform:rotate(-30deg)}
  .pm-quali__zweig--rechts,.pm-quali__band{display:none}
  .pm-quali__head{max-width:none;min-height:0}
  .pm-quali__head h2{font-size:clamp(1.8rem,7.6vw,2.3rem)}
  .pm-quali__head p:not(.pm-offers__eyebrow){font-size:.86rem}
  .pm-quali .pm-btn{padding:.85rem 1.5rem;font-size:.9rem}
  .pm-quali__werte{grid-template-columns:1fr;gap:.8rem}
  .pm-zeitleiste li{grid-template-columns:5.6rem 1fr;gap:.6rem;padding-left:1.7rem}
  .pm-zeitleiste__jahr{font-size:.78rem}
  .pm-karussell{padding:0}
  .pm-karussell__pfeil{display:none}
  .pm-karussell__spur{grid-auto-columns:72%}
  .pm-quali__notiz{border-radius:18px;padding:1rem}
}
.pm-quali__zwei > *{min-width:0}   /* Karussell darf die Spalte nicht aufblähen */
.pm-zeitleiste li{grid-template-columns:6.2rem 1fr}
@media(max-width:899px){.pm-zeitleiste li{grid-template-columns:5.2rem 1fr}}
.pm-quali__zwei{grid-template-columns:.85fr 1.15fr}
.pm-lightbox .pm-lightbox__zu,.pm-lightbox .pm-lightbox__zu:hover{background:var(--c-offer-card)!important;color:var(--c-ink)!important;border:0!important;box-shadow:0 6px 18px rgba(0,0,0,.25)}
@media(max-width:1100px){.pm-quali__zwei{grid-template-columns:1fr}}

/* ==========================================================================
   29. Block 7 "Kontakt" nach Vorlage + heller Footer (27.09.2026)
   ========================================================================== */
.pm-kontakt{position:relative;isolation:isolate;padding:clamp(2.6rem,4.5vw,3.6rem) 0 clamp(2rem,4vw,3rem)}
.pm-kontakt__bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pm-kontakt__band{fill:var(--c-ablauf-band);opacity:.7}
.pm-kontakt__band--leise{opacity:.55}

.pm-kontakt__oben{
  position:absolute;z-index:0;top:0;right:var(--stage-l);width:min(50vw,700px);height:auto;pointer-events:none;
  clip-path:url(#pm-clip-kontakt-oben);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%);mask-image:linear-gradient(to bottom,transparent 0,#000 16%);
}
@media(min-width:1321px){
  .pm-kontakt__oben{
    -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 16%),linear-gradient(to left,transparent 0,#000 10%);
            mask-image:linear-gradient(to bottom,transparent 0,#000 16%),linear-gradient(to left,transparent 0,#000 10%);
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}
.pm-kontakt__zweig--oben{right:calc(var(--stage-l) + min(42vw,590px));top:clamp(90px,8vw,120px);width:clamp(100px,8.5vw,130px);transform:rotate(-120deg)}
.pm-kontakt__zweig--unten{right:calc(var(--stage-l) - 10px);bottom:0;width:clamp(90px,8vw,120px);transform:rotate(-20deg)}
.pm-kontakt__motto{
  position:absolute;z-index:2;right:calc(var(--stage-l) + min(18vw,260px));top:clamp(260px,21vw,300px);margin:0;max-width:240px;
  font-family:"Caveat",cursive;font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.4;color:var(--c-ink);
}
.pm-kontakt__motto::before{content:"\201C";position:absolute;left:-2.4rem;top:-.6rem;font-family:var(--f-head);font-size:3rem;color:var(--c-sage-deep)}
.pm-kontakt__motto::after{content:"";display:block;width:90px;height:1px;margin-top:.8rem;background:var(--c-gold-line)}

.pm-kontakt__kopf{position:relative;z-index:2;min-height:clamp(330px,26vw,380px)}
.pm-kontakt__kopf h2{font-weight:400;font-size:clamp(2.2rem,3.9vw,3.3rem);line-height:1.08;letter-spacing:-.015em;margin:0 0 1rem;max-width:560px}
.pm-kontakt__kopf > p:not(.pm-offers__eyebrow){font-size:clamp(.98rem,1.2vw,1.08rem);line-height:1.55;color:var(--c-ink-soft);margin:0;max-width:560px}
.pm-kontakt__werte{list-style:none;margin:1.8rem 0 0;padding:0;display:flex;gap:clamp(1rem,2.4vw,2.2rem);max-width:min(62%,760px)}
.pm-kontakt__werte li{display:flex;align-items:center;gap:.8rem;margin:0}
.pm-kontakt__werte .pm-ueber__wert-icon{width:56px}

/* Mitte: Tisch-Foto links, Formular, weitere Wege */
.pm-kontakt__mitte{position:relative;margin-top:clamp(1rem,2vw,1.6rem)}
.pm-kontakt__tisch{position:absolute;z-index:0;margin:0;left:var(--stage-l);top:0;width:min(34vw,470px);aspect-ratio:4/3.1}
.pm-kontakt__tisch img{width:100%;height:100%;object-fit:cover;clip-path:url(#pm-clip-kontakt-tisch)}
@media(min-width:1321px){
  .pm-kontakt__tisch img{-webkit-mask-image:linear-gradient(to right,transparent 0,#000 12%);mask-image:linear-gradient(to right,transparent 0,#000 12%)}
}
.pm-kontakt__raster{position:relative;z-index:2;display:grid;grid-template-columns:.62fr 1.1fr .95fr;gap:clamp(1.4rem,2.6vw,2.4rem);align-items:start}
.pm-kontakt__raster > *{min-width:0}
.pm-kontakt__raster h3{font-family:var(--f-head);font-weight:400;font-size:clamp(1.4rem,2vw,1.75rem);margin:0 0 1rem;letter-spacing:-.01em}

/* Formular nach Vorlage: Platzhalter-artige Felder, Pille */
.pm-kontakt .pm-form{max-width:none;gap:.75rem}
.pm-kontakt .pm-form__row{gap:.75rem}
.pm-kontakt .pm-form label{font-size:.7rem;letter-spacing:.1em;margin-bottom:.3rem}
.pm-kontakt .pm-form input[type=text],.pm-kontakt .pm-form input[type=email],.pm-kontakt .pm-form select,.pm-kontakt .pm-form textarea{
  background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line);border-radius:12px;
  padding:.8rem .95rem;font-size:.92rem;color:var(--c-ink);width:100%;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.pm-kontakt .pm-form select{appearance:none;-webkit-appearance:none;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--c-ink-soft) 50%),linear-gradient(135deg,var(--c-ink-soft) 50%,transparent 50%);
  background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.pm-kontakt .pm-form input:focus,.pm-kontakt .pm-form select:focus,.pm-kontakt .pm-form textarea:focus{outline:none;border-color:var(--c-sage);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-sage-mist) 40%,transparent)}
.pm-kontakt .pm-form textarea{min-height:110px}
.pm-kontakt .pm-form__consent label{text-transform:none;letter-spacing:0;font-size:.8rem;line-height:1.5}
.pm-kontakt .pm-form__hint{font-size:.76rem;color:var(--c-ink-soft);margin:0}
.pm-kontakt .pm-form .pm-btn{border-radius:var(--radius-pill);padding:1rem 2rem;justify-content:center;width:min(100%,340px)}
.pm-kontakt .pm-form .pm-btn .pm-icon{color:currentColor}
.pm-form__vertraulich{display:flex;align-items:center;gap:.5rem;margin:0;font-size:.76rem;color:var(--c-ink-soft);max-width:none}
.pm-form__vertraulich .pm-icon{flex:none;color:var(--c-ink-soft)}

/* Weitere Kontaktwege */
.pm-weg-karte{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1rem;margin-bottom:.7rem;
  padding:1rem 1rem 1rem 1.1rem;border-radius:14px;text-decoration:none;
  background:color-mix(in srgb,var(--c-offer-card) 88%,transparent);border:1px solid var(--c-offer-line);
  transition:transform .3s var(--ease-out-expo),box-shadow .3s var(--ease-out-expo);
}
.pm-weg-karte:hover{transform:translateY(-2px);box-shadow:0 14px 28px -20px var(--c-offer-shadow)}
.pm-weg-karte__icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:var(--c-offer-badge);color:#fff}
.pm-weg-karte__icon .pm-icon{color:#fff}
.pm-weg-karte__text{display:flex;flex-direction:column;font-size:.78rem;line-height:1.45;color:var(--c-ink-soft)}
.pm-weg-karte__text strong{font-family:var(--f-head);font-weight:400;font-size:1rem;color:var(--c-ink);margin-bottom:.15rem}
.pm-weg-karte__text em{font-style:normal;color:var(--c-sage-deep);font-size:.82rem;margin-top:.2rem}
.pm-weg-karte__pfeil{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--c-sage-deep);color:#fff}
.pm-weg-karte__pfeil .pm-icon{color:#fff}
.pm-kontakt__notfall{display:flex;gap:.55rem;align-items:flex-start;margin:1rem 0 0;font-size:.74rem;line-height:1.5;color:var(--c-ink-soft);max-width:none}
.pm-kontakt__notfall .pm-icon{flex:none;margin-top:.15rem;color:var(--c-sage-deep)}
.pm-kontakt__notfall a{color:var(--c-ink);font-weight:600;white-space:nowrap}

.pm-kontakt__zitat{
  position:relative;z-index:2;margin:clamp(1.4rem,3vw,2.4rem) 0 0 calc(var(--stage-l) + clamp(3rem,7vw,7rem));
  padding:0 0 0 2.6rem;border:0;background:none;max-width:380px;font-style:normal;
}
.pm-kontakt__zitat::before{content:"\201C";position:absolute;left:0;top:-.5rem;font-family:var(--f-head);font-size:3.2rem;line-height:1;color:var(--c-sage-deep)}
.pm-kontakt__zitat p{margin:0;font-family:"Caveat",cursive;font-style:normal;font-size:clamp(1.25rem,1.7vw,1.5rem);line-height:1.4;color:var(--c-ink);max-width:none}
.pm-kontakt__zitat p::after{content:"";display:block;width:90px;height:1px;margin-top:.8rem;background:var(--c-gold-line)}

/* Heller Footer */
.pm-footer{position:relative;background:var(--c-bg);color:var(--c-ink);padding-block:clamp(1.6rem,3vw,2.2rem) 1.2rem;margin-top:clamp(3rem,6vw,5rem)}
.pm-footer__kante{position:absolute;left:0;right:0;bottom:calc(100% - 1px);width:100%;height:clamp(40px,5vw,80px);pointer-events:none}
.pm-footer__kante path{fill:var(--c-bg)}
.pm-footer__zeile{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap}
.pm-footer__marke{display:flex;align-items:center;gap:.8rem;text-decoration:none;color:var(--c-ink)}
.pm-footer__marke img{width:52px;height:52px;border-radius:50%}
.pm-footer__marke strong{display:block;font-family:var(--f-head);font-weight:400;font-size:1.05rem;line-height:1.2}
.pm-footer__marke small{display:block;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c-ink-soft)}
.pm-footer__nav{display:flex;flex-wrap:wrap;gap:clamp(1rem,2.4vw,2.2rem)}
.pm-footer__nav a,.pm-footer__recht a{color:var(--c-ink);text-decoration:none;font-size:.92rem}
.pm-footer__nav a:hover,.pm-footer__recht a:hover{color:var(--c-sage-deep);text-decoration:underline}
.pm-footer__recht{display:flex;gap:1.2rem}
.pm-footer__recht a{font-size:.78rem;color:var(--c-ink-soft)}
.pm-footer__hoch{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:var(--c-sage-deep);color:#fff;flex:none}
.pm-footer__hoch .pm-icon{color:#fff;transform:rotate(-90deg)}
.pm-footer__hoch:hover{background:var(--c-ink)}
.pm-footer__unten{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem 1.5rem;margin-top:1.2rem;padding-top:1rem;border-top:1px solid var(--c-surface-2);font-size:.74rem;color:var(--c-ink-soft)}
.pm-footer__unten a{color:var(--c-ink-soft)}
/* Astra-Knopf „nach oben“ entfällt — der Footer hat seinen eigenen */
#ast-scroll-top,.ast-scroll-top-icon,.hfe-scroll-to-top-wrap{display:none!important}

@media(max-width:1100px){
  .pm-kontakt__raster{grid-template-columns:1fr 1fr}
  .pm-kontakt__platz{display:none}
  .pm-kontakt__tisch{display:none}
}

/* ---------- Handy ---------- */
@media(max-width:899px){
  .pm-kontakt{padding-top:calc(38vw + .6rem)}
  .pm-kontakt__oben{width:76vw}
  .pm-kontakt__zweig--oben{right:-8px;top:26vw;width:64px;transform:rotate(-30deg)}
  .pm-kontakt__zweig--unten,.pm-kontakt__band,.pm-kontakt__motto{display:none}
  .pm-kontakt__kopf{min-height:0}
  .pm-kontakt__kopf h2{font-size:clamp(1.9rem,8vw,2.4rem)}
  .pm-kontakt__kopf > p:not(.pm-offers__eyebrow){font-size:.88rem}
  .pm-kontakt__werte{flex-direction:column;max-width:none;gap:.8rem;margin-top:1.4rem}
  .pm-kontakt__werte .pm-ueber__wert-icon{width:48px}
  .pm-kontakt__raster{grid-template-columns:1fr;gap:2rem}
  .pm-kontakt .pm-form .pm-btn{width:100%}
  .pm-kontakt__zitat{margin:2rem 1rem 0;max-width:none}
  .pm-footer__zeile{flex-direction:column;align-items:flex-start}
  .pm-footer__nav{gap:.6rem 1.2rem}
  .pm-footer__hoch{position:absolute;right:1rem;top:1.2rem;width:44px;height:44px}
  .pm-footer__unten{flex-direction:column}
}
/* 29b. Feinschliff Kontakt/Footer */
.pm-kontakt__werte{max-width:640px}
.pm-kontakt__werte li{flex:1 1 0;min-width:0}
.pm-kontakt__werte .pm-ueber__wert-text strong{white-space:nowrap}
.pm-kontakt__zweig--oben{top:clamp(40px,4vw,60px);right:calc(var(--stage-l) + min(40vw,560px))}
.pm-kontakt__motto{top:clamp(290px,22vw,320px);right:calc(var(--stage-l) + min(26vw,370px));max-width:230px}
@media(min-width:1101px){.pm-kontakt__tisch{width:min(28vw,400px)}}
@media(min-width:1101px){.pm-kontakt__raster{grid-template-columns:.8fr 1.1fr .95fr}}
.pm-kontakt .pm-form select{height:auto;line-height:1.4;padding:.8rem 2.4rem .8rem .95rem}
.pm-footer .pm-footer__marke strong{color:var(--c-ink)}
.pm-footer .pm-footer__marke small{color:var(--c-ink-soft)}
.pm-footer{margin-top:clamp(2rem,4vw,3rem)}
@media(min-width:900px){
  .pm-kontakt__werte{max-width:600px;gap:1.2rem}
  .pm-kontakt__werte .pm-ueber__wert-text strong{white-space:normal}
  .pm-kontakt__werte .pm-ueber__wert-icon{width:50px}
  .pm-kontakt__motto{right:calc(var(--stage-l) + min(20vw,290px));top:clamp(300px,23vw,335px)}
}

/* 30. Angebote: Deko-Foto als Herz-Fenster (Logo-Motiv), oben weich — 27.09.2026 */
@media(min-width:900px){
  .pm-offers__deko{
    width:min(40vw,560px);aspect-ratio:120/112;height:auto;object-fit:cover;object-position:70% 62%;
    top:-40px;right:calc(var(--stage-l) + clamp(0px,2vw,40px));
    -webkit-mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 30%);
            mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 30%);
    -webkit-mask-size:100% 100%,100% 100%;mask-size:100% 100%,100% 100%;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-composite:source-in;mask-composite:intersect;
  }
}
@media(min-width:900px){
  .pm-offers__deko{
    width:min(30vw,420px);top:-90px;right:calc(var(--stage-l) + clamp(20px,5vw,90px));object-position:66% 60%;
    -webkit-mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 16%);
            mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 16%);
  }
}
@media(min-width:900px){.pm-offers__deko{top:0;width:min(28vw,390px)}}
/* Herz-Fenster groß, reicht bis in den Hero hinauf (oben weich) */
@media(min-width:900px){
  body.home .pm-offers{overflow:visible}
  .pm-offers__deko{top:-230px;width:min(46vw,640px);right:calc(var(--stage-l) + clamp(0px,2vw,30px));object-position:64% 58%;
    -webkit-mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 24%);
            mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 24%)}
}
@media(min-width:900px){.pm-offers__deko{right:calc(var(--stage-l) - clamp(40px,7vw,120px));object-position:88% 58%}}
@media(min-width:900px){
  .pm-offers__deko{top:-110px;width:min(40vw,570px);right:calc(var(--stage-l) - clamp(0px,1.5vw,24px));
    -webkit-mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 7%);
            mask-image:url("assets/img/herz-maske.svg?v=2"),linear-gradient(to bottom,transparent 0,#000 7%)}
}
/* Pfeil auf Themenkarten ist selbst ein Link und liegt über allem */
.pm-thema__pfeil{position:relative;z-index:2;text-decoration:none}
.pm-thema__bild{pointer-events:none}
.pm-form__ok,.pm-form__err{padding:.9rem 1.1rem;border-radius:12px;font-size:.9rem;margin:0 0 1rem}
.pm-form__ok{background:color-mix(in srgb,var(--c-sage-mist) 35%,var(--c-offers-bg));color:var(--c-sage-deep)}
.pm-form__err{background:color-mix(in srgb,var(--c-rose-soft) 35%,var(--c-offers-bg));color:var(--c-ink)}

/* ==========================================================================
   31. Seite /therapie/ „Meine Angebote“ (.pmx-) — baut auf .pmt- auf
   ========================================================================== */
.pmx .pmt-hero h1{max-width:560px}
.pmx-angebote{padding-block:clamp(2.2rem,4vw,3.2rem)}
.pmx-karten{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem)}
.pmx-karte{display:flex;flex-direction:column;background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line);border-radius:14px;overflow:hidden;box-shadow:0 10px 28px -20px var(--c-offer-shadow)}
.pmx-karte__bild{aspect-ratio:1.75}
.pmx-karte__bild img{width:100%;height:100%;object-fit:cover}
.pmx-karte__body{display:flex;flex-direction:column;flex:1;padding:1.3rem 1.3rem 1.4rem}
.pmx-karte__body h3{font-size:1.4rem;margin:0 0 .3rem}
.pmx .pmx-karte__preis{margin:0 0 .6rem;font-size:.9rem;color:var(--c-ink)}
.pmx-karte__preis strong{font-family:var(--f-head);font-weight:400;font-size:1.2rem}
.pmx-karte__body > p:not(.pmx-karte__preis){font-size:.88rem;margin:0 0 1rem}
.pmx-haken{list-style:none;margin:0 0 1.4rem;padding:0;display:grid;gap:.5rem}
.pmx-haken li{display:flex;gap:.6rem;align-items:flex-start;margin:0;font-size:.84rem;color:var(--c-ink)}
.pmx-haken .pm-icon{flex:none;margin-top:.15rem;color:var(--c-sage-deep)}
.pmx-karte .pmt-btn{margin-top:auto;align-self:flex-start}
.pmx-rund{width:48px;height:48px}
.pmx .pmt-schritte__kopf{gap:.7rem}
.pmx-mehr{text-align:center;margin:1.6rem 0 0}
.pmx-mehr a{display:inline-flex;align-items:center;gap:.4rem;color:var(--c-sage-deep)}
.pmx-mehr .pm-icon{color:currentColor}
.pmx-rahmen__liste{list-style:none;margin:1.2rem 0 0;padding:1.2rem;display:grid;gap:1rem;border-radius:16px;background:color-mix(in srgb,var(--c-offer-card) 85%,transparent);border:1px solid var(--c-offer-line)}
.pmx-rahmen__liste li{display:flex;gap:1rem;align-items:flex-start;margin:0}
.pmx-rahmen__liste li > span:last-child{display:flex;flex-direction:column;font-size:.86rem;line-height:1.5;color:var(--c-ink-soft)}
.pmx-rahmen__liste strong{color:var(--c-ink);font-weight:600;margin-bottom:.1rem}
.pmx-cta{position:relative;padding-block:clamp(2.5rem,5vw,4rem);min-height:clamp(320px,26vw,380px)}
.pmx-cta__bild{position:absolute;margin:0;right:var(--stage-l);top:0;bottom:0;width:min(38vw,520px);z-index:0}
.pmx-cta__bild img{width:100%;height:100%;object-fit:cover;clip-path:url(#pmt-clip-rechts);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 15%,#000 85%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 15%,#000 85%,transparent 100%)}
.pmx-cta__text{position:relative;z-index:2;max-width:min(56%,620px)}
.pmx-cta__zeile{display:flex;flex-wrap:wrap;align-items:center;gap:1.4rem 2rem}
.pmx-cta__zeile .pmt-vertrauen{margin:0}
.pmx-cta__motto{position:absolute;z-index:2;right:calc(var(--stage-l) + 2rem);bottom:1.2rem;margin:0;font-family:"Caveat",cursive;font-size:1.4rem;color:var(--c-ink);max-width:260px}
@media(max-width:1100px){.pmx-karten{grid-template-columns:1fr 1fr}}
@media(max-width:899px){
  .pmx-karten{grid-template-columns:1fr;gap:.8rem}
  .pmx-karte{flex-direction:row}
  .pmx-karte__bild{flex:none;width:32%;aspect-ratio:auto}
  .pmx-karte__body{padding:1rem}
  .pmx-karte__body h3{font-size:1.15rem}
  .pmx-haken{display:none}
  .pmx-karte .pmt-btn{padding:.7rem 1.2rem;font-size:.85rem}
  .pmx .pmt-schritte__kopf .pmx-rund{display:none}
  .pmx-cta__bild,.pmx-cta__motto{display:none}
  .pmx-cta__text{max-width:none}
  .pmx-cta .pmt-btn{width:100%;justify-content:center}
}
@media(min-width:1100px){.pm-footer__zeile{flex-wrap:nowrap}.pm-footer__nav{gap:1.4rem}.pm-footer__marke small{white-space:nowrap}}
@media(max-width:899px){.pmx .pmt-hero h1{min-height:calc(61vw - 3.2rem)}}

/* ==========================================================================
   32. Seite /kontakt/ (.pmk-) — nach Vorlage 27.09.2026
   ========================================================================== */
.pmk .pmt-vertrauen{gap:1.1rem 1.6rem}
.pmk-haupt{padding-block:clamp(1.5rem,3vw,2.5rem)}
.pmk-raster{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(1.2rem,2.4vw,2rem);align-items:stretch}
.pmk-raster > *{min-width:0}
.pmk-karte{background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line);border-radius:22px;padding:clamp(1.4rem,2.6vw,2.2rem);box-shadow:0 20px 50px -40px var(--c-offer-shadow)}
.pmk .pmk-karte h2{font-size:clamp(1.5rem,2.2vw,1.9rem);margin:0 0 1.3rem}
.pmk-wege{list-style:none;margin:0;padding:0;display:grid;gap:1.6rem}
.pmk-wege li{display:flex;gap:1.1rem;align-items:flex-start;margin:0}
.pmk-kreis{flex:none;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--c-ablauf-band) 75%,var(--c-ablauf-bg))}
.pmk-kreis .pm-icon{color:var(--c-sage-deep)}
.pmk-wege li > span:last-child{display:flex;flex-direction:column;gap:.2rem}
.pmk-wege strong{font-weight:600;font-size:.98rem;color:var(--c-ink)}
.pmk-wege small{font-size:.8rem;line-height:1.5;color:var(--c-ink-soft)}
.pmk-wege a,.pmk-wege b{font-weight:600;font-size:1rem;color:var(--c-ink);text-decoration:none;margin-top:.3rem}
.pmk-wege a:hover{color:var(--c-sage-deep);text-decoration:underline}
.pmk .pm-form{max-width:none;gap:.75rem}
.pmk .pm-form__row{gap:.75rem}
.pmk .pm-form label{font-size:.7rem;letter-spacing:.1em;margin-bottom:.3rem}
.pmk .pm-form input[type=text],.pmk .pm-form input[type=email],.pmk .pm-form select,.pmk .pm-form textarea{
  background:var(--c-offers-bg);border:1px solid var(--c-offer-line);border-radius:12px;padding:.8rem .95rem;font-size:.92rem;color:var(--c-ink);width:100%}
.pmk .pm-form select{appearance:none;-webkit-appearance:none;padding-right:2.4rem;
  background-image:linear-gradient(45deg,transparent 50%,var(--c-ink-soft) 50%),linear-gradient(135deg,var(--c-ink-soft) 50%,transparent 50%);
  background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.pmk .pm-form input:focus,.pmk .pm-form select:focus,.pmk .pm-form textarea:focus{outline:none;border-color:var(--c-sage);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-sage-mist) 40%,transparent)}
.pmk .pm-form textarea{min-height:120px}
.pmk .pm-form__consent label{text-transform:none;letter-spacing:0;font-size:.8rem;line-height:1.5}
.pmk .pm-form__hint{font-size:.76rem;color:var(--c-ink-soft);margin:0}
.pmk .pm-form .pm-btn{border-radius:var(--radius-pill);padding:1rem 2rem;justify-content:center;width:100%}
.pmk .pm-form .pm-btn .pm-icon{color:currentColor}
.pmk-notfall{display:flex;gap:.55rem;align-items:flex-start;margin:1.2rem 0 0;font-size:.78rem;line-height:1.5;color:var(--c-ink-soft);max-width:none}
.pmk-notfall .pm-icon{flex:none;margin-top:.15rem;color:var(--c-sage-deep)}
.pmk-notfall a{color:var(--c-ink);font-weight:600;white-space:nowrap}

.pmk-ort{position:relative;padding-block:clamp(2.2rem,4vw,3.4rem);min-height:clamp(420px,34vw,500px)}
.pmk-ort__bild{position:absolute;margin:0;right:var(--stage-l);top:0;bottom:0;width:min(34vw,470px);z-index:0}
.pmk-ort__bild img{width:100%;height:100%;object-fit:cover;clip-path:url(#pmt-clip-rechts);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 12%,#000 88%,transparent 100%)}
.pmk-ort__text{position:relative;z-index:2;max-width:min(66%,780px)}
.pmk .pmk-ort__text h2{margin-bottom:.6rem}
.pmk-karte-box{display:grid;grid-template-columns:.8fr 1.2fr;margin-top:1.4rem;border-radius:22px;overflow:hidden;border:1px solid var(--c-offer-line);background:color-mix(in srgb,var(--c-offer-card) 90%,transparent)}
.pmk-ort__liste{list-style:none;margin:0;padding:1.4rem;display:grid;gap:1.1rem;align-content:center}
.pmk-ort__liste li{display:flex;gap:.8rem;align-items:flex-start;margin:0;font-size:.86rem;color:var(--c-ink)}
.pmk-ort__liste .pm-icon{flex:none;color:var(--c-sage-deep)}
.pmk-ort__liste a{color:var(--c-sage-deep)}
.pmk-map{position:relative;min-height:260px;background:
  linear-gradient(0deg,color-mix(in srgb,var(--c-ablauf-band) 60%,transparent) 1px,transparent 1px) 0 0/34px 34px,
  linear-gradient(90deg,color-mix(in srgb,var(--c-ablauf-band) 60%,transparent) 1px,transparent 1px) 0 0/34px 34px,
  color-mix(in srgb,var(--c-sage-mist) 18%,var(--c-offers-bg))}
.pmk-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pmk-map__laden{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;padding:1.2rem;background:transparent!important;border:0;cursor:pointer;color:var(--c-ink)!important;text-align:center}
.pmk-map__laden .pm-icon{width:44px;height:44px;padding:10px;border-radius:50%;background:var(--c-sage-deep);color:#fff}
.pmk-map__laden strong{font-weight:600;font-size:.95rem}
.pmk-map__laden small{font-size:.72rem;color:var(--c-ink-soft);max-width:260px}

.pmk-faq{padding-block:clamp(1.5rem,3vw,2.5rem)}
.pmk-faq__raster{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;align-items:start;margin-top:1.2rem}
.pmk-frage{background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line);border-radius:16px;padding:1rem}
.pmk-frage summary{list-style:none;display:flex;gap:.7rem;align-items:flex-start;cursor:pointer}
.pmk-frage summary::-webkit-details-marker{display:none}
.pmk-frage summary strong{flex:1;font-size:.86rem;line-height:1.35;font-weight:600;color:var(--c-ink)}
.pmk-frage .pmt-plus{margin-top:.35rem}
.pmk-frage[open] .pmt-plus::after{transform:rotate(0)}
.pmk-frage p{margin:.8rem 0 0;font-size:.82rem}
.pmk-cta{min-height:clamp(320px,26vw,380px)}
.pmk-cta .pmk-cta__bild{left:var(--stage-l);right:auto}
.pmk-cta__bild img{clip-path:url(#pmt-clip-links)}
.pmk-cta__text{margin-left:auto;max-width:min(48%,520px)}

@media(max-width:1100px){.pmk-faq__raster{grid-template-columns:1fr 1fr}}
@media(max-width:899px){
  .pmk .pmt-hero h1{min-height:calc(61vw - 5rem)}
  .pmk-raster{grid-template-columns:1fr}
  .pmk-kreis{width:52px;height:52px}
  .pmk-ort{min-height:0}
  .pmk .pmk-ort__bild,.pmk .pmk-cta__bild{display:none}
  .pmk-ort__text,.pmk-cta__text{max-width:none;margin:0}
  .pmk-karte-box{grid-template-columns:1fr}
  .pmk-map{min-height:220px}
  .pmk-faq__raster{grid-template-columns:1fr;gap:.6rem}
  .pmk-cta .pmt-btn{width:100%;justify-content:center}
}
@media(min-width:900px){.pmk-frage summary{pointer-events:none;cursor:default}.pmk-frage .pmt-plus{display:none}}
@media(max-width:899px){.pmk .pmt-hero h1{min-height:calc(61vw - 2.2rem)}}
@media(min-width:900px){.pmk-faq__raster{align-items:stretch}.pmk-frage summary{align-items:center;min-height:3.4em}.pmk-frage summary strong{display:-webkit-box}}
.pmk-map{display:block;overflow:hidden;background:none;text-decoration:none}
.pmk-map img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out-expo)}
.pmk-map:hover img{transform:scale(1.03)}
.pmk-map__route{position:absolute;right:1rem;bottom:1rem;display:inline-flex;align-items:center;gap:.4rem;padding:.55rem 1rem;border-radius:var(--radius-pill);background:var(--c-sage-deep);color:#fff;font-size:.8rem}
.pmk-map__route .pm-icon{color:#fff}
.pmk-map__quelle{position:absolute;left:.6rem;bottom:.4rem;font-size:.62rem;color:var(--c-ink-soft);background:color-mix(in srgb,var(--c-offers-bg) 80%,transparent);padding:.1rem .35rem;border-radius:4px}

/* 33. Kontakt: Ranken an den Seitenrändern + näher an der Vorlage (27.09.2026) */
.pm-ranke{position:absolute;z-index:1;pointer-events:none;overflow:visible}
.pm-ranke__stiel{fill:none;stroke:color-mix(in srgb,var(--c-sage-deep) 50%,var(--c-sage-mist));stroke-width:1.6;stroke-linecap:round}
.pm-ranke__blatt--1{fill:color-mix(in srgb,var(--c-sage-mist) 78%,var(--c-sage-deep));fill-opacity:.62}
.pm-ranke__blatt--2{fill:color-mix(in srgb,var(--c-sage-mist) 92%,var(--c-ablauf-bg));fill-opacity:.75}
.pm-ranke__blatt{stroke:color-mix(in srgb,var(--c-sage-deep) 35%,var(--c-sage-mist));stroke-width:.6}
.pm-ranke__rippe{fill:none;stroke:color-mix(in srgb,var(--c-sage-deep) 40%,var(--c-sage-mist));stroke-width:.7;opacity:.8}

.pmk section{position:relative}
.pmk-ranke--hero{right:calc(var(--stage-l) + min(40vw,560px));top:clamp(90px,8vw,130px);width:clamp(120px,11vw,160px);transform:rotate(-24deg);z-index:3}
.pmk-ranke--links1{left:calc(var(--stage-l) - 60px);top:clamp(300px,24vw,360px);width:clamp(90px,8vw,120px);transform:rotate(24deg)}
.pmk-ranke--form{right:calc(var(--stage-l) - 50px);top:-10px;width:clamp(100px,9vw,140px);transform:rotate(-8deg);z-index:3}
.pmk-ranke--ort{right:calc(var(--stage-l) - 40px);top:-60px;width:clamp(90px,8vw,120px);transform:rotate(-14deg);z-index:3}
.pmk-ranke--links2{left:calc(var(--stage-l) - 50px);bottom:-40px;width:clamp(90px,8vw,120px);transform:rotate(30deg);z-index:3}
.pmk-ranke--cta{right:calc(var(--stage-l) - 30px);top:-30px;width:clamp(100px,9vw,140px);transform:rotate(-18deg)}
.pmk-ranke--links3{left:calc(var(--stage-l) - 40px);bottom:-10px;width:clamp(80px,7vw,110px);transform:rotate(38deg);z-index:3}

/* Hero näher an der Vorlage: größeres Foto, Vertrauenszeile einreihig */
.pmk .pmt-hero__bild{width:min(54vw,760px)}
.pmk .pmt-vertrauen{flex-wrap:nowrap;gap:1.3rem}
.pmk .pmt-vertrauen li{white-space:nowrap}
.pmk-blob{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.pmk-blob path{fill:var(--c-ablauf-band);opacity:.55}

/* Karte: Infokarte liegt auf der Karte (Vorlage) */
.pmk-karte-box{position:relative;display:block;min-height:320px;background:none}
.pmk-karte-box .pmk-map{position:absolute;inset:0;min-height:0}
.pmk-karte-box .pmk-ort__liste{position:relative;z-index:2;margin:1.1rem;width:min(46%,260px);padding:1.2rem;border-radius:16px;
  background:color-mix(in srgb,var(--c-offer-card) 94%,transparent);box-shadow:0 14px 30px -20px var(--c-offer-shadow)}

@media(max-width:1100px){.pmk .pmt-vertrauen{flex-wrap:wrap}}
@media(max-width:899px){
  .pmk-ranke--hero,.pmk-ranke--links1,.pmk-ranke--links2,.pmk-ranke--links3{display:none}
  .pmk-ranke--form{right:-30px;width:80px}
  .pmk-ranke--ort{right:-24px;width:70px;top:-30px}
  .pmk-ranke--cta{right:-24px;width:80px}
  .pmk .pmt-hero__bild{width:46vw}
  .pmk-karte-box{min-height:0}
  .pmk-karte-box .pmk-map{position:relative;display:block;height:220px}
  .pmk-karte-box .pmk-ort__liste{width:auto;margin:0;border-radius:0;box-shadow:none}
}
@media(min-width:900px){.pmk .pmt-hero__bild{width:min(49vw,690px)}.pmk .pmt-hero__inner > *{max-width:min(42%,500px)}.pmk .pmt-hero__inner > .pmt-vertrauen{max-width:none}.pmk .pmt-vertrauen{gap:1rem}.pmk-ranke--hero{right:calc(var(--stage-l) + min(43vw,600px));top:clamp(200px,17vw,250px);width:clamp(110px,9vw,140px);transform:rotate(-40deg)}}
@media(min-width:900px){.pmk-ranke--hero{right:calc(var(--stage-l) + min(40vw,560px));top:clamp(70px,6vw,95px);width:clamp(110px,9vw,140px);transform:rotate(-30deg)}}

/* 34. Kontakt-Stil wie Vorlage: Platzhalter statt Überschriften, farbige Karte, weiche Flecken */
.pmk .pm-form > div:not(.pm-form__consent) > label,
.pmk .pm-form__row label,
.pm-kontakt .pm-form > div:not(.pm-form__consent) > label,
.pm-kontakt .pm-form__row label{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pmk .pm-form input::placeholder,.pmk .pm-form textarea::placeholder,.pm-kontakt .pm-form input::placeholder,.pm-kontakt .pm-form textarea::placeholder{color:var(--c-ink-soft);opacity:1}
.pmk .pm-form select,.pm-kontakt .pm-form select{color:var(--c-ink-soft)}
.pmk .pm-form input,.pmk .pm-form select,.pmk .pm-form textarea{background:color-mix(in srgb,var(--c-offer-card) 95%,transparent)!important}

.pmk-map__pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);width:44px;height:44px;border-radius:50% 50% 50% 0;rotate:-45deg;
  display:grid;place-items:center;background:var(--c-sage-deep);box-shadow:0 8px 18px -6px rgba(0,0,0,.35)}
.pmk-map__pin .pm-icon{rotate:45deg;color:#fff;width:20px;height:20px}

.pmk{position:relative}
.pmk-flecken{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.pmk-flecken span{position:absolute;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c-ablauf-band) 85%,transparent),transparent);filter:blur(10px)}
.pmk-flecken span:nth-child(1){left:-12%;top:2%;width:46vw;height:520px}
.pmk-flecken span:nth-child(2){right:-10%;top:18%;width:40vw;height:600px}
.pmk-flecken span:nth-child(3){left:-8%;top:44%;width:44vw;height:560px}
.pmk-flecken span:nth-child(4){right:-12%;top:62%;width:46vw;height:520px}
.pmk-flecken span:nth-child(5){left:10%;bottom:-4%;width:60vw;height:500px}
.pmk .pm-form select,.pm-kontakt .pm-form select{height:auto!important;min-height:48px;line-height:1.3!important;padding-top:.75rem!important;padding-bottom:.75rem!important}
.pm-ranke{height:auto}

/* 35. Aquarell-Ranken überall (Bild statt Vektor) — Größe/Winkel neu */
img.pm-zweig{height:auto;transform:none}
.pm-ablauf__zweig--oben{width:clamp(80px,7vw,105px)!important;transform:rotate(-8deg)!important}
.pm-ablauf__zweig--unten{width:clamp(90px,8vw,120px)!important;transform:rotate(-6deg)!important}
.pm-ueber__zweig--portrait{width:clamp(80px,7vw,105px)!important;left:-40px!important;bottom:-60px!important;transform:rotate(-30deg)!important}
.pm-ueber__zweig--unten{width:clamp(90px,8vw,120px)!important;transform:rotate(-6deg)!important}
.pm-themen__zweig--kopf{width:clamp(80px,7vw,105px)!important;transform:rotate(-20deg)!important}
.pm-themen__zweig--links{width:clamp(80px,7vw,110px)!important;transform:rotate(8deg)!important}
.pm-quali__zweig--kopf{width:clamp(80px,7vw,105px)!important;transform:rotate(-20deg)!important}
.pm-quali__zweig--rechts{width:clamp(80px,7vw,105px)!important;transform:rotate(-6deg)!important}
.pm-kontakt__zweig--oben{width:clamp(80px,7vw,105px)!important;transform:rotate(-20deg)!important}
.pm-kontakt__zweig--unten{width:clamp(90px,8vw,115px)!important;transform:rotate(-6deg)!important}
.pmt-zweig--hero{width:clamp(80px,7vw,105px)!important;transform:rotate(-20deg)!important}
.pmt-zweig--fuer{width:clamp(80px,7vw,105px)!important;transform:rotate(-6deg)!important}
.pmt-zweig--cta{width:clamp(80px,7vw,105px)!important;transform:rotate(6deg)!important}
@media(max-width:899px){
  img.pm-zweig{width:56px!important}
}
.pm-flow__botanik{height:auto!important;width:clamp(90px,7vw,115px)!important;opacity:1!important}

/* ==========================================================================
   36. Kopfleiste hell wie der Footer (27.09.2026) — überschreibt die grüne
   Leiste aus Abschnitt 18/19 auf allen Seiten und in allen Zuständen.
   ========================================================================== */
html body .pm-header,
html body.home .pm-header,
html body .pm-header.is-stuck,
html body.home .pm-header.is-stuck{
  background:color-mix(in srgb,var(--c-bg) 88%,transparent)!important;
  -webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px);
  border-bottom:1px solid transparent!important;
  box-shadow:none;
  transition:background .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
}
html body .pm-header::before{opacity:0!important}
html body.home .pm-header:not(.is-stuck){background:transparent!important;-webkit-backdrop-filter:none;backdrop-filter:none}
html body .pm-header.is-stuck,
html body:not(.home) .pm-header{
  background:color-mix(in srgb,var(--c-bg) 94%,transparent)!important;
  border-bottom-color:color-mix(in srgb,var(--c-offer-line) 80%,transparent)!important;
  box-shadow:0 10px 30px -18px rgba(60,50,30,.28),0 1px 0 rgba(255,255,255,.6) inset!important;
}
html body .pm-header .pm-brand,
html body .pm-header .pm-brand__name,
html body .pm-header.is-stuck .pm-brand__name{color:var(--c-ink)!important}
html body .pm-header .pm-brand__role,
html body .pm-header.is-stuck .pm-brand__role{color:var(--c-ink-soft)!important}
html body .pm-header .pm-brand__mark{border-radius:50%;box-shadow:0 2px 8px -3px rgba(60,50,30,.35)}
@media(min-width:861px){
  html body .pm-header .pm-nav a:not(.pm-btn),
  html body .pm-header.is-stuck .pm-nav a:not(.pm-btn){color:var(--c-ink)!important;text-decoration:none}
  html body .pm-header .pm-nav a:not(.pm-btn):hover,
  html body .pm-header .pm-nav a[aria-current="page"]:not(.pm-btn){color:var(--c-sage-deep)!important;text-decoration:underline;text-underline-offset:.35em;text-decoration-thickness:1px}
}
html body .pm-header .pm-btn--primary,
html body .pm-header a.pm-btn--primary,
html body .pm-header.is-stuck a.pm-btn--primary{
  background:var(--c-sage-deep)!important;color:#fff!important;border-color:var(--c-sage-deep)!important;border-radius:var(--radius-pill)!important;
  box-shadow:0 8px 18px -10px rgba(63,89,69,.6)!important}
html body .pm-header a.pm-btn--primary:hover{background:var(--c-ink)!important;border-color:var(--c-ink)!important}
html body .pm-header .pm-lang a,
html body .pm-header.is-stuck .pm-lang a{color:var(--c-ink-soft)!important;background:transparent!important}
html body .pm-header .pm-lang a[aria-current="true"],
html body .pm-header.is-stuck .pm-lang a[aria-current="true"]{color:var(--c-ink)!important;background:color-mix(in srgb,var(--c-ablauf-band) 80%,transparent)!important;border-radius:6px}
html body .pm-header .pm-burger,
html body .pm-header.is-stuck .pm-burger{color:var(--c-ink)!important}
html body.home .pm-header:not(.is-stuck){background:color-mix(in srgb,var(--c-bg) 82%,transparent)!important;-webkit-backdrop-filter:saturate(1.2) blur(14px);backdrop-filter:saturate(1.2) blur(14px)}

/* ==========================================================================
   37. Seite /ueber-mich/ (.pmu-) nach Vorlage 27.09.2026
   ========================================================================== */
.pmu section{position:relative}
.pmu-ranke{width:clamp(90px,8vw,120px)}
.pmu-ranke--hero{right:calc(var(--stage-l) + min(38vw,520px));top:clamp(110px,9vw,140px);width:clamp(120px,10vw,160px);transform:rotate(-25deg);z-index:3}
.pmu-ranke--links1{left:calc(var(--stage-l) - 60px);top:clamp(120px,10vw,160px);transform:rotate(20deg)}
.pmu-ranke--weg{right:calc(var(--stage-l) - 40px);top:0;transform:rotate(-10deg)}
.pmu-ranke--arbeit{right:calc(var(--stage-l) + min(40vw,560px));bottom:0;transform:rotate(-30deg);z-index:3}
.pmu-ranke--links2{left:calc(var(--stage-l) - 60px);top:0;transform:rotate(20deg)}
.pmu-ranke--links3{left:calc(var(--stage-l) - 60px);bottom:-20px;transform:rotate(24deg)}
.pmu-ranke--zitat{right:calc(var(--stage-l) - 40px);top:-10px;transform:rotate(-12deg)}
.pmu-ranke--cta{right:calc(var(--stage-l) + min(44vw,600px));top:-10px;transform:rotate(-20deg);z-index:3}

.pmu-hero{padding:clamp(2rem,4vw,3rem) 0 clamp(2rem,4vw,3rem);min-height:clamp(560px,46vw,660px)}
.pmu-hero__bild{position:absolute;margin:0;top:0;right:var(--stage-l);width:min(46vw,640px);aspect-ratio:1378/1450;z-index:0}
.pmu-hero__bild img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;clip-path:url(#pmu-clip-portrait)}
@media(min-width:1321px){.pmu-hero__bild img{-webkit-mask-image:linear-gradient(to left,transparent 0,#000 10%);mask-image:linear-gradient(to left,transparent 0,#000 10%)}}
.pmu-hero__inner{position:relative;z-index:2}
.pmu-hero__inner > *{max-width:min(46%,560px)}
.pmu .pmu-hero h1{font-size:clamp(2.4rem,4.4vw,3.6rem);margin:0 0 1rem}
.pmu .pmu-hero__intro{font-size:.96rem;line-height:1.65;margin:0 0 1.6rem}
.pmu-hero__intro strong{color:var(--c-ink);font-weight:600}
.pmu .pmu-hero__inner > .pmt-vertrauen{max-width:none;flex-wrap:wrap;gap:1rem 1.4rem;margin-top:1.8rem}
.pmu-hero__zitat{position:absolute;z-index:3;right:calc(var(--stage-l) + 1rem);bottom:clamp(1rem,2vw,2rem);margin:0;max-width:240px;padding:1rem 1.2rem 1rem 2.6rem;border-radius:20px;
  background:color-mix(in srgb,var(--c-offers-bg) 92%,transparent);font-family:"Caveat",cursive;font-size:clamp(1.2rem,1.5vw,1.4rem);line-height:1.35;color:var(--c-ink)}
.pmu-hero__zitat::before{content:"\201C";position:absolute;left:.7rem;top:.2rem;font-family:var(--f-head);font-size:2.6rem;color:var(--c-sage-deep)}

.pmu h2{font-size:clamp(1.7rem,2.6vw,2.2rem)!important;margin:0 0 .5rem!important}
.pmu .pmu-lead{font-size:.92rem;max-width:640px;margin:0 0 1.8rem}

.pmu-weg{padding-block:clamp(2rem,4vw,3rem)}
.pmu-zeit{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.pmu-zeit li{margin:0;display:flex;flex-direction:column}
.pmu-zeit__kopf{display:flex;align-items:center;gap:.6rem;margin-bottom:.8rem}
.pmu-zeit .pmk-kreis{width:56px;height:56px}
.pmu-zeit small{font-size:.74rem;color:var(--c-ink-soft)}
.pmu-zeit strong{font-family:var(--f-head);font-weight:400;font-size:1.3rem;color:var(--c-ink);line-height:1.2}
.pmu-zeit__titel{font-size:.86rem;font-weight:600;color:var(--c-ink);margin-top:.3rem}
.pmu-zeit__text{font-size:.78rem;line-height:1.45;color:var(--c-ink-soft)}
.pmu .pmu-geschichte{margin:2rem 0 0;max-width:760px;font-size:.92rem;padding-left:1rem;border-left:2px solid var(--c-gold-line)}

.pmu-arbeit{padding-block:clamp(2.2rem,4vw,3.2rem);min-height:clamp(460px,36vw,540px)}
.pmu-arbeit__bild{position:absolute;margin:0;right:var(--stage-l);top:0;bottom:0;width:min(44vw,610px);z-index:0}
.pmu-arbeit__bild img{width:100%;height:100%;object-fit:cover;clip-path:url(#pmt-clip-rechts);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%)}
.pmu-arbeit__text{position:relative;z-index:2;max-width:min(48%,560px)}
.pmu-arbeit__text > p{font-size:.92rem;margin:0 0 1.4rem}
.pmu-punkte{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.pmu-punkte li{display:flex;gap:1rem;align-items:center;margin:0}
.pmu-punkte .pmk-kreis{width:52px;height:52px}
.pmu-punkte li > span:last-child,.pmu-karten li > span:last-child{display:flex;flex-direction:column;font-size:.82rem;line-height:1.45;color:var(--c-ink-soft)}
.pmu-punkte strong,.pmu-karten strong{font-weight:600;font-size:.92rem;color:var(--c-ink);margin-bottom:.1rem}

.pmu-wichtig{padding-block:clamp(1.8rem,3.5vw,2.8rem)}
.pmu-karten{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.pmu-karten li{display:flex;gap:.9rem;align-items:center;margin:0;padding:1.1rem;border-radius:16px;
  background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line)}
.pmu-karten .pmk-kreis{width:52px;height:52px}

.pmu-zitat{padding-block:clamp(2rem,4vw,3rem);min-height:clamp(200px,16vw,240px)}
.pmu-zitat__bild{position:absolute;margin:0;left:var(--stage-l);top:0;bottom:0;width:min(44vw,600px);z-index:0}
.pmu-zitat__bild img{width:100%;height:100%;object-fit:cover;clip-path:url(#pmu-clip-streifen)}
.pmu-zitat__text{position:relative;z-index:2;margin:0 0 0 auto;max-width:min(46%,520px);padding-left:2.8rem;border:0;background:none;font-style:normal}
.pmu-zitat__text::before{content:"\201C";position:absolute;left:0;top:-.6rem;font-family:var(--f-head);font-size:3.4rem;color:var(--c-sage-deep)}
.pmu-zitat__text p{margin:0;font-family:"Caveat",cursive;font-style:normal;font-size:clamp(1.5rem,2.1vw,1.9rem);line-height:1.35;color:var(--c-ink)}
.pmu-zitat__text p::after{content:"";display:block;width:90px;height:1px;margin-top:.8rem;background:var(--c-gold-line)}

.pmu-ausbildung{padding-block:clamp(1.8rem,3.5vw,2.8rem)}
.pmu-ausbildung__zeile{display:grid;grid-template-columns:1fr auto;gap:1.4rem;align-items:center}
.pmu-ausbildung__zeile > *{min-width:0}
.pmu-karussell .pm-karussell__spur{grid-auto-columns:calc((100% - 2rem) / 3)}
.pmu-zert{display:flex!important;gap:.8rem;align-items:center;text-align:left;width:100%;padding:.8rem!important;border-radius:14px!important}
.pmu-zert img{width:70px!important;aspect-ratio:1!important;flex:none;border-radius:8px!important}
.pmu-zert span{display:flex;flex-direction:column;font-size:.74rem;color:var(--c-ink-soft);line-height:1.4}
.pmu-zert strong{font-family:var(--f-head);font-weight:400;font-size:.92rem;color:var(--c-ink);margin:0!important}
.pmu-cta .pmk-cta__bild{width:min(46vw,640px)}

@media(max-width:1100px){
  .pmu-zeit{grid-template-columns:repeat(3,1fr);row-gap:1.6rem}
  .pmu-karten{grid-template-columns:1fr 1fr}
  .pmu-ausbildung__zeile{grid-template-columns:1fr}
}
@media(max-width:899px){
  .pmu .pmu-ranke{display:none}
  .pmu-hero{min-height:0;padding-top:1.4rem}
  .pmu-hero__bild{position:relative;right:auto;width:100%;aspect-ratio:1.05;margin-top:1.4rem}
  .pmu-hero{display:flex;flex-direction:column}
  .pmu-hero__inner{order:1}.pmu-hero__bild{order:2}.pmu-hero__zitat{order:3;position:relative;right:auto;bottom:auto;margin:-2.4rem 1rem 0 auto}
  .pmu-hero__inner > *{max-width:none}
  .pmu .pmu-hero h1{font-size:clamp(1.9rem,8vw,2.4rem)}
  .pmu-zeit{grid-template-columns:1fr;gap:1rem}
  .pmu-zeit li{display:grid;grid-template-columns:auto 1fr;column-gap:1rem}
  .pmu-zeit__kopf{grid-row:1 / span 4;margin:0}
  .pmu-zeit .pmt-schritte__pfeil{display:none}
  .pmu-arbeit{min-height:0}
  .pmu-arbeit__bild,.pmu-zitat__bild{display:none}
  .pmu-arbeit__text,.pmu-zitat__text{max-width:none;margin:0}
  .pmu-karten{grid-template-columns:1fr}
  .pmu-karussell .pm-karussell__spur{grid-auto-columns:82%}
}
.pmu-ranke--cta{right:auto!important;left:calc(var(--stage-l) + min(30vw,420px));top:-50px!important;transform:rotate(-10deg)!important}
.pmu h2,.pmk h2,.pmx h2{hyphens:manual;-webkit-hyphens:manual}

/* ==========================================================================
   38. Seite /mein-ansatz/ (.pma-) nach Vorlage 28.09.2026 — baut auf .pmu- auf
   ========================================================================== */
.pma-hero__bild{aspect-ratio:1.05}
.pma-hero__bild img{object-position:55% 50%}
.pma-karten{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.pma-karten li{display:flex;flex-direction:column;gap:.5rem;margin:0;padding:1.3rem;border-radius:18px;
  background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line)}
.pma-karten .pmk-kreis{width:60px;height:60px;margin-bottom:.4rem}
.pma-karten strong{font-weight:600;font-size:.96rem;color:var(--c-ink)}
.pma-karten span:last-child{font-size:.84rem;line-height:1.5;color:var(--c-ink-soft)}
.pma-methoden__bild{position:absolute;margin:0;left:var(--stage-l);top:0;bottom:0;width:min(40vw,560px);z-index:0}
.pma-methoden__bild img{width:100%;height:100%;object-fit:cover;clip-path:url(#pmt-clip-links);
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 90%,transparent 100%)}
.pma-methoden__text{margin-left:auto}
.pma-ranke--methoden{left:calc(var(--stage-l) + min(34vw,470px));bottom:-20px;transform:rotate(10deg);z-index:3}
.pma-weg h3 small{display:block;font-family:var(--f-body);font-size:.74rem;color:var(--c-ink-soft);margin-top:.15rem}
.pma-zitat{min-height:clamp(420px,34vw,500px);padding-bottom:clamp(2.5rem,5vw,4rem)}
.pma-zitat .pmu-zitat__bild{width:min(44vw,610px);bottom:auto;height:clamp(240px,20vw,290px)}
.pma-cta{position:relative;z-index:2;margin:clamp(2.5rem,5vw,4rem) 0 0 auto;max-width:min(56%,640px)}
.pma-cta h2{margin-bottom:.6rem!important}
.pma-cta > p:not(.pm-offers__eyebrow){font-size:.92rem;margin:0 0 1.3rem}
.pma-ranke--unten{left:calc(var(--stage-l) - 50px);bottom:0;transform:rotate(22deg)}
@media(max-width:1100px){.pma-karten{grid-template-columns:1fr 1fr}}
@media(max-width:899px){
  .pma-karten{grid-template-columns:1fr}
  .pma-methoden__bild{display:none}
  .pma-methoden__text{margin:0}
  .pma-cta{max-width:none;margin-top:2rem}
  .pma-cta .pmt-btn{width:100%;justify-content:center}
}

/* ==========================================================================
   39. Seite /faq/ (.pmf-) nach Vorlage 28.09.2026
   ========================================================================== */
html{scroll-padding-top:100px}
.pmf-haupt{padding-block:clamp(1.5rem,3vw,2.5rem)}
.pmf-raster{display:grid;grid-template-columns:.8fr 1.3fr;gap:clamp(1.6rem,3vw,2.6rem);align-items:start}
.pmf-raster > *{min-width:0}
.pmf-seite{position:sticky;top:96px;display:grid;gap:1.4rem}
.pmf-nav{display:grid;gap:.35rem;padding:1rem;border-radius:22px;background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line)}
.pmf-nav a{display:flex;gap:.9rem;align-items:center;padding:.55rem .6rem;border-radius:14px;text-decoration:none;transition:background .25s var(--ease)}
.pmf-nav a:hover,.pmf-nav a.ist-aktiv{background:color-mix(in srgb,var(--c-ablauf-band) 70%,transparent)}
.pmf-nav .pmk-kreis{width:44px;height:44px}
.pmf-nav a > span:last-child{display:flex;flex-direction:column}
.pmf-nav strong{font-weight:600;font-size:.88rem;color:var(--c-ink)}
.pmf-nav small{font-size:.72rem;color:var(--c-ink-soft)}
.pmf-seite__bild{margin:0;aspect-ratio:1.3}
.pmf-seite__bild img{width:100%;height:100%;object-fit:cover;clip-path:url(#pmt-clip-links)}
.pmf-zitat{position:relative;margin:0;padding:0 0 0 2.6rem;border:0;background:none;font-style:normal}
.pmf-zitat::before{content:"\201C";position:absolute;left:0;top:-.5rem;font-family:var(--f-head);font-size:3rem;color:var(--c-sage-deep)}
.pmf-zitat p{margin:0 0 .6rem;font-family:"Caveat",cursive;font-style:normal;font-size:1.35rem;line-height:1.35;color:var(--c-ink);max-width:none}
.pmf-zitat footer{font-family:"Caveat",cursive;font-size:1.25rem;color:var(--c-ink-soft)}
.pmf-listen{display:grid;gap:clamp(1.6rem,3vw,2.4rem)}
.pmf .pmf-kat h2{font-size:clamp(1.4rem,2.1vw,1.8rem);margin:0 0 .8rem}
.pmf-akk details{border-radius:14px}
.pmf-akk summary{justify-content:flex-start;gap:.9rem;padding:.9rem 1rem;font-size:.92rem}
.pmf-plus{position:relative;flex:none;width:14px;height:14px}
.pmf-plus::before,.pmf-plus::after{content:"";position:absolute;left:0;top:50%;width:14px;height:1.5px;background:var(--c-ink);transition:transform .3s var(--ease)}
.pmf-plus::after{transform:rotate(90deg)}
.pmf-akk details[open] .pmf-plus::after{transform:rotate(0)}
.pmf-akk details p{padding:0 1rem 1rem 2.9rem;font-size:.88rem}
.pmf-akk details p a{color:var(--c-sage-deep)}
@media(max-width:899px){
  .pmf-raster{grid-template-columns:1fr}
  .pmf-seite{position:static}
  .pmf-seite__bild,.pmf-zitat{display:none}
  .pmf-nav small{display:none}
}
.pmt .pmf-seite__bild{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:100%;height:auto;aspect-ratio:1.3}
.pmf .pmt-hero__inner > .pmt-vertrauen{flex-wrap:wrap;max-width:560px}

/* ==========================================================================
   40. Blog /blog/ + Einzelbeitrag (.pmb-) nach Vorlage 28.09.2026
   ========================================================================== */
.pmb-liste{padding-block:clamp(1.5rem,3vw,2.5rem)}
.pmb-filter{display:flex;flex-wrap:wrap;gap:.6rem;margin:0 0 1.8rem}
.pmb-filter a{padding:.6rem 1.1rem;border-radius:var(--radius-pill);border:1px solid var(--c-offer-line);background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);color:var(--c-ink);text-decoration:none;font-size:.84rem}
.pmb-filter a[aria-current="page"]{background:var(--c-sage-deep);border-color:var(--c-sage-deep);color:#fff}
.pmb-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.6rem)}
.pmb-karte{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:color-mix(in srgb,var(--c-offer-card) 92%,transparent);border:1px solid var(--c-offer-line);box-shadow:0 14px 34px -26px var(--c-offer-shadow);transition:transform .35s var(--ease-out-expo)}
.pmb-karte:hover{transform:translateY(-3px)}
.pmb-karte__bild{display:block;aspect-ratio:1.9;overflow:hidden}
.pmb-karte__bild img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out-expo)}
.pmb-karte:hover .pmb-karte__bild img{transform:scale(1.04)}
.pmb-karte__body{display:flex;flex-direction:column;flex:1;padding:1.2rem 1.3rem 1.3rem}
.pmb .pmb-tags{display:flex;gap:.4rem;margin:0 0 .7rem}
.pmb-tags span{font-size:.68rem;padding:.25rem .6rem;border-radius:var(--radius-pill);background:color-mix(in srgb,var(--c-ablauf-band) 80%,transparent);color:var(--c-ink)}
.pmb .pmb-karte h2{font-size:1.3rem!important;line-height:1.25;margin:0 0 .6rem!important}
.pmb-karte h2 a{color:var(--c-ink);text-decoration:none}
.pmb-karte h2 a:hover{color:var(--c-sage-deep)}
.pmb .pmb-karte__body > p:not(.pmb-tags):not(.pmb-meta){font-size:.86rem;line-height:1.55;margin:0 0 1rem}
.pmb .pmb-meta{display:flex;flex-wrap:wrap;gap:1.2rem;margin:auto 0 .8rem;font-size:.76rem;color:var(--c-ink-soft)}
.pmb-meta span{display:inline-flex;align-items:center;gap:.4rem}
.pmb-meta .pm-icon{color:var(--c-sage-deep)}
.pmb-weiter{display:inline-flex;align-items:center;gap:.4rem;font-size:.86rem;color:var(--c-ink);text-decoration:underline;text-underline-offset:.3em}
.pmb-weiter .pm-icon{color:currentColor}
.pmb-mehr{text-align:center;margin:2rem 0 0}
.pmb-leer{text-align:center;padding:2rem 0}
/* Einzelbeitrag */
.pmb-single .pmt-hero{min-height:clamp(380px,32vw,460px)}
.pmb-single .pmt-hero h1{font-size:clamp(2rem,3.6vw,3rem)}
.pmb-single .pmt-hero .pmb-meta{margin-top:1.2rem}
.pmb-text{padding-block:clamp(1.5rem,3vw,2.5rem)}
.pmb-inhalt{max-width:760px;margin:0 auto;padding:clamp(1.4rem,3vw,2.6rem);border-radius:22px;background:color-mix(in srgb,var(--c-offer-card) 90%,transparent);border:1px solid var(--c-offer-line)}
.pmb-inhalt p,.pmb-inhalt li{font-size:1rem;line-height:1.8;color:var(--c-ink)}
.pmb-inhalt h2{font-size:1.55rem!important;margin:2rem 0 .8rem!important}
.pmb-inhalt h3{font-family:var(--f-head);font-weight:400;font-size:1.25rem;margin:1.6rem 0 .6rem}
.pmb-inhalt img{border-radius:14px;margin:1rem 0}
@media(max-width:1100px){.pmb-raster{grid-template-columns:1fr 1fr}}
@media(max-width:899px){
  .pmb-filter{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-1rem;padding-inline:1rem}
  .pmb-filter a{flex:none}
  .pmb-raster{grid-template-columns:1fr;gap:.8rem}
  .pmb-karte{flex-direction:row}
  .pmb-karte__bild{flex:none;width:34%;aspect-ratio:auto}
  .pmb-karte__body{padding:.9rem}
  .pmb .pmb-karte h2{font-size:1.02rem!important}
  .pmb .pmb-karte__body > p:not(.pmb-tags):not(.pmb-meta){display:none}
  .pmb .pmb-meta{gap:.8rem;font-size:.7rem;margin-bottom:.5rem}
}
.pmb-inhalt hr{border:0;height:1px;background:var(--c-offer-line);margin:2rem 0}
.pmb-inhalt strong{color:var(--c-ink);font-weight:600}
.pmb-inhalt ul{margin:0 0 1.2rem;padding-left:1.2rem}
.pmb-inhalt li{margin-bottom:.35rem}
.pmb .pmt-hero__inner > .pmt-vertrauen{flex-wrap:wrap;max-width:min(46%,540px)}
.pmb-single .pmt-hero h1{hyphens:manual;-webkit-hyphens:manual;max-width:min(46%,540px)}
@media(max-width:899px){.pmb .pmt-hero__inner > .pmt-vertrauen,.pmb-single .pmt-hero h1{max-width:none}}
@media(min-width:861px){html body .pm-header .pm-nav{gap:clamp(.9rem,1.6vw,1.5rem)}html body .pm-header .pm-nav a:not(.pm-btn){font-size:clamp(.84rem,.95vw,.95rem);white-space:nowrap}}
@media(min-width:861px) and (max-width:1180px){html body .pm-header .pm-brand__role{display:none}html body .pm-header .pm-brand__name{font-size:.95rem}}
.pm-footer__nav{gap:.6rem 1.3rem}
@media(min-width:861px){html body .pm-header .pm-header__inner{max-width:1320px}html body .pm-header .pm-brand__name{white-space:nowrap}html body .pm-header .pm-brand__role{white-space:nowrap}html body .pm-header .pm-btn--primary{white-space:nowrap;padding:.7rem 1.2rem!important;font-size:.88rem!important}html body .pm-header .pm-lang{gap:.2rem}}
@media(min-width:861px) and (max-width:1320px){html body .pm-header .pm-brand__role{display:none}html body .pm-header .pm-brand__mark{width:44px!important;height:44px!important}}
@media(min-width:861px) and (max-width:1120px){html body .pm-header .pm-brand__name{font-size:.88rem}html body .pm-header .pm-nav{gap:.75rem}html body .pm-header .pm-nav a:not(.pm-btn){font-size:.8rem}}
@media(min-width:861px) and (max-width:1100px){html body .pm-header .pm-nav__start{display:none}}

/* ==========================================================================
   41. Rechtstexte (.pmr-) Impressum / Datenschutz / AGB
   ========================================================================== */
.pmr-kopf{position:relative;padding:clamp(7rem,11vw,9rem) 0 clamp(1rem,2vw,1.5rem);text-align:center}
.pmr-kopf h1{font-size:clamp(2.1rem,4vw,3.2rem);margin:.3rem 0 .5rem}
.pmr .pmr-stand{font-size:.85rem;color:var(--c-ink-soft);margin:0}
.pmr-inhalt{max-width:820px}
.pmr-inhalt h2{font-size:1.35rem!important;margin:2.2rem 0 .7rem!important}
.pmr-inhalt h2:first-child{margin-top:0!important}
.pmr-inhalt p,.pmr-inhalt li{font-size:.95rem;line-height:1.75}
.pmr-inhalt a{color:var(--c-sage-deep);word-break:break-word}
.pmr-kopf .pm-wrap{text-align:center}
.pmr-kopf .pm-wrap > p{margin-inline:auto;max-width:none;text-align:center}
.pmr-kopf .pmk-ranke--hero{left:auto;right:max(2vw,calc(50% - 640px));top:4.5rem;width:clamp(110px,12vw,180px);height:auto;transform:none}
@media(max-width:899px){.pmr-kopf .pmk-ranke--hero{display:none}}