/* ===== Skizze «Passform»: legt sich über stripe.css ===== */
.pf-svg { display: block; width: 100%; height: auto; overflow: visible; }
.pf-platte { fill: #fff; filter: drop-shadow(0 1px 1px rgb(11 29 43 / .06)) drop-shadow(0 24px 40px rgb(11 29 43 / .12)); }
.pf-mulde { transition: filter 500ms ease; }
.pf-mulde.z-voll { filter: drop-shadow(0 0 10px rgb(83 193 170 / .55)); }
.pf-teil { filter: drop-shadow(0 10px 14px rgb(11 29 43 / .16)); }
.pf-teil.z-sitzt { filter: drop-shadow(0 2px 3px rgb(11 29 43 / .14)); }
/* Einstieg: Platte rechts neben dem Titel */
.pf-einstieg-raster { position: relative; }
.pf-einstieg { position: absolute; right: 0; top: 50%; width: min(34vw, 30rem); translate: 0 -46%; pointer-events: none; }
@media (max-width: 1100px) { .pf-einstieg { position: relative; right: auto; top: auto; translate: none; width: min(100%, 26rem); margin: 0 auto 1.5rem; } }
.pf-einstieg-raster .s-riesig, .pf-einstieg-raster .s-einstieg-lead { max-width: min(100%, 44rem); }
@media (min-width: 1101px) { .pf-einstieg-raster .s-riesig { max-width: 50rem; } .pf-einstieg-raster .s-einstieg-lead { max-width: min(36rem, 100% - 34vw); } }
/* Abschnitt: steht beim Scrollen, Formen fallen nacheinander */
.pf-abschnitt { height: 260vh; padding-block: 0; }
.pf-pin { position: sticky; top: 0; height: 100vh; display: flex; align-items: center; padding-top: 5rem; box-sizing: border-box; }
.pf-raster { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.pf-dienste { display: grid; gap: .6rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.pf-dienst a { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: .9rem 1rem; border-radius: 1rem; color: var(--tinte); text-decoration: none;
  opacity: .45; transition: opacity 400ms ease, background-color 400ms ease, box-shadow 400ms ease; }
.pf-dienst.z-da a { opacity: 1; background: #fff; box-shadow: inset 0 0 0 1px var(--linie), 0 14px 30px -20px rgb(11 29 43 / .35); }
.pf-dienst a:hover { background: #fff; }
.pf-mini { width: 2.2rem; height: 2.2rem; }
.pf-dienst b { display: block; font-weight: 600; }
.pf-kurz { display: block; margin-top: .15rem; font-size: .9375rem; color: var(--grau); line-height: 1.45; }
@media (max-width: 899px), (prefers-reduced-motion: reduce) { .pf-abschnitt { height: auto; padding-block: clamp(3.5rem, 2rem + 4vw, 5.5rem); } .pf-pin { position: static; height: auto; padding-top: 0; } }
@media (max-width: 899px) { .pf-raster { grid-template-columns: minmax(0, 1fr); } .pf-buehne { order: -1; max-width: 26rem; } }
html[data-thema="dunkel"] .pf-platte { fill: #16283a; }
html[data-thema="dunkel"] .pf-dienst.z-da a, html[data-thema="dunkel"] .pf-dienst a:hover { background: #16283a; }
html[data-thema="dunkel"] .pf-dienst a { color: var(--text-hell); }
