/* PhysioPower Venwegen — Stil. Farben aus dem Logo, Schrift vom System (keine externen Fonts, kein Tracking). */
:root{
  --gruen:#80b646; --gruen-dunkel:#4f8420; --gruen-tief:#2f5a12; --gruen-hell:#eaf4dd; --gruen-h:#9dcc6a;
  --dunkel:#0b1512; --anthrazit:#1e2622; --text:#1b201d; --grau:#5b625e; --grau-hell:#8a918d;
  --linie:#e1e6de; --grund:#fbfcf9; --karte:#ffffff; --gelb:#f2c230; --rot:#d8453a;
  --schrift:"Avenir Next","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --radius:14px; --schatten:0 10px 30px rgba(11,21,18,.08); --innen:min(1180px,calc(100% - 2rem));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--schrift);color:var(--text);background:var(--grund);line-height:1.6;font-size:1.0625rem;-webkit-font-smoothing:antialiased}
img,picture,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--gruen-dunkel);text-underline-offset:.15em}
a:hover{color:var(--gruen-tief)}
h1,h2,h3,h4{line-height:1.15;letter-spacing:-.01em;margin:0 0 .5em;font-weight:700;color:var(--anthrazit)}
h1{font-size:clamp(2rem,4.5vw,3.25rem);letter-spacing:-.02em}
h2{font-size:clamp(1.5rem,3vw,2.1rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em}
ul,ol{padding-left:1.3em}
li{margin-bottom:.3em}
strong{font-weight:700}
small{font-size:.85em}
table{border-collapse:collapse;width:100%}
caption{text-align:left;font-weight:700;margin-bottom:.4em}
th,td{text-align:left;padding:.45em .6em;border-bottom:1px solid var(--linie);vertical-align:top}
th{font-weight:600}
.innen{width:var(--innen);margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sprung{position:absolute;left:-999px;top:0;background:var(--gruen);color:#fff;padding:.5em 1em;z-index:100}
.sprung:focus{left:1rem;top:1rem}
.klein{font-size:.9rem;color:var(--grau)}
.etikett{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gruen-dunkel);margin-bottom:.4em}
.weiter{display:inline-block;margin-top:.6em;font-weight:600;color:var(--gruen-dunkel)}
.weiter::after{content:" →"}

/* Knöpfe */
.knoepfe{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.25rem 0}
.knopf{display:inline-flex;flex-direction:column;justify-content:center;gap:0;padding:.7rem 1.25rem;border-radius:999px;border:2px solid var(--anthrazit);color:var(--anthrazit);font-weight:700;text-decoration:none;line-height:1.2;transition:transform .15s,background .15s,color .15s;min-height:3rem}
.knopf small{font-weight:500;font-size:.78rem;opacity:.8}
.knopf:hover{transform:translateY(-1px);background:var(--anthrazit);color:#fff}
.knopf-gruen{background:var(--gruen);border-color:var(--gruen);color:#0b1512}
.knopf-gruen:hover{background:var(--gruen-h);border-color:var(--gruen-h);color:#0b1512}
.knopf-hell{border-color:#fff;color:#fff}
.knopf-hell:hover{background:#fff;color:var(--dunkel)}

/* Kopf */
.kopf{position:sticky;top:0;z-index:50;background:rgba(251,252,249,.92);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--linie)}
.kopf .innen{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:4.5rem}
.marke{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--anthrazit)}
.marke img{width:64px;height:auto}
.marke-text{font-weight:800;font-size:1.15rem;letter-spacing:-.01em;line-height:1.05;display:flex;flex-direction:column}
.marke-text small{font-weight:500;font-size:.72rem;color:var(--grau);letter-spacing:.02em}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:.25rem;align-items:center}
.nav a:not(.knopf){display:block;padding:.5rem .7rem;text-decoration:none;color:var(--anthrazit);font-weight:600;border-radius:8px}
.nav a:not(.knopf):hover,.nav a[aria-current="page"]{background:var(--gruen-hell);color:var(--gruen-tief)}
.nav{display:flex;align-items:center;gap:.5rem}
.nav-cta{padding:.55rem 1rem;min-height:0}
.nav-knopf{display:none;background:none;border:0;width:44px;height:44px;padding:8px;cursor:pointer;flex-direction:column;justify-content:center;gap:5px}
.nav-knopf span:not(.sr){display:block;height:3px;background:var(--anthrazit);border-radius:2px;transition:transform .2s,opacity .2s}
@media (max-width:900px){
  .nav-knopf{display:flex}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--grund);border-bottom:1px solid var(--linie);padding:1rem;flex-direction:column;align-items:stretch;box-shadow:var(--schatten)}
  .nav.offen{display:flex}
  .nav ul{flex-direction:column;align-items:stretch;gap:0}
  .nav a:not(.knopf){padding:.8rem .6rem;font-size:1.1rem}
  .nav-cta{margin-top:.5rem;text-align:center}
  .nav-knopf[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav-knopf[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-knopf[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .marke-text small{display:none}
}

/* Brotkrumen */
.brot{width:var(--innen);margin:1rem auto 0;font-size:.88rem;color:var(--grau)}
.brot ol{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.3em}
.brot li+li::before{content:"›";margin-right:.3em;color:var(--grau-hell)}
.brot a{color:var(--grau);text-decoration:none}
.brot a:hover{color:var(--gruen-dunkel);text-decoration:underline}

/* Held (Startseite und Seitenköpfe) */
.held{position:relative;color:#fff;background:var(--dunkel);overflow:hidden;isolation:isolate}
.held-foto{position:absolute;inset:0;z-index:-2}
.held-foto img{width:100%;height:100%;object-fit:cover;object-position:center 22%;opacity:.62}
.held::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,21,18,.92) 0%,rgba(11,21,18,.7) 55%,rgba(11,21,18,.35) 100%)}
.held .innen{padding:clamp(3rem,8vw,6.5rem) 0 clamp(2.5rem,6vw,4.5rem);max-width:none}
.held h1{color:#fff;max-width:16em;margin-bottom:.4em}
.held .unter{font-size:clamp(1.05rem,2vw,1.3rem);max-width:36em;color:rgba(255,255,255,.88);margin-bottom:1.4em}
.held .knopf{border-color:#fff;color:#fff}
.held .knopf-gruen{border-color:var(--gruen);background:var(--gruen);color:#0b1512}
.held .knopf:hover{background:#fff;color:var(--dunkel)}
.held .knopf-gruen:hover{background:var(--gruen-h);color:#0b1512}
.held .fakten{display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;list-style:none;padding:0;margin:1.5rem 0 0;font-size:.95rem;color:rgba(255,255,255,.85)}
.held .fakten li::before{content:"✓";color:var(--gruen-h);font-weight:700;margin-right:.4em}
@media (max-width:860px){
  .held::after{background:linear-gradient(180deg,rgba(11,21,18,.55) 0%,rgba(11,21,18,.82) 45%,rgba(11,21,18,.92) 100%)}
  .held-foto img{opacity:.75;object-position:center 32%}
}
.seitenkopf{background:var(--dunkel);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.seitenkopf .held-foto img{opacity:.4}
.seitenkopf .innen{padding:clamp(2.2rem,6vw,4rem) 0}
.seitenkopf h1{color:#fff}
.seitenkopf p{max-width:40em;font-size:1.15rem;color:rgba(255,255,255,.9)}
.seitenkopf-hell{background:var(--gruen-hell);color:var(--text)}
.seitenkopf-hell h1{color:var(--anthrazit)}
.seitenkopf-hell p{color:var(--text)}

/* Auf einen Blick (Startseite) */
.schnell{position:relative;z-index:2;margin-top:-2.5rem;padding-bottom:1rem}
.schnell .karte{box-shadow:var(--schatten)}
.schnell h2{font-size:1.25rem;margin-bottom:.4em}
.schnell .karte p{flex:1}
@media (max-width:860px){.schnell{margin-top:1rem}}

/* Mobile Kontaktleiste */
.mobil-leiste{display:none}
@media (max-width:900px){
  body{padding-bottom:4.4rem}
  .mobil-leiste{display:grid;grid-template-columns:1fr 1.2fr;gap:.4rem;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:.5rem .6rem calc(.5rem + env(safe-area-inset-bottom));background:rgba(251,252,249,.96);backdrop-filter:blur(10px);border-top:1px solid var(--linie)}
  .mobil-leiste a{display:flex;align-items:center;justify-content:center;min-height:2.9rem;border-radius:999px;border:2px solid var(--anthrazit);color:var(--anthrazit);font-weight:700;text-decoration:none;font-size:.95rem}
  .mobil-leiste .leiste-termin{background:var(--gruen);border-color:var(--gruen);color:#0b1512}
  .cta-block{padding-bottom:3rem}
}

/* Abschnitte */
.band{padding:clamp(2.5rem,6vw,4.5rem) 0}
.band-hell{background:var(--gruen-hell)}
.band-dunkel{background:var(--dunkel);color:#fff}
.band-dunkel h2,.band-dunkel h3{color:#fff}
.band-dunkel a{color:var(--gruen-h)}
.band-weiss{background:#fff;border-top:1px solid var(--linie);border-bottom:1px solid var(--linie)}
.band > .innen > h2:first-child,.band > .innen > .vorspann{max-width:40em}
.vorspann{font-size:1.15rem;color:var(--grau);margin-bottom:2rem}
.zwei{display:grid;gap:2rem;align-items:center}
@media (min-width:860px){.zwei{grid-template-columns:1fr 1fr}.zwei.breit-links{grid-template-columns:3fr 2fr}.zwei.breit-rechts{grid-template-columns:2fr 3fr}}
.zwei picture img{border-radius:var(--radius);box-shadow:var(--schatten)}
.text-block{max-width:44em}
.text-block h2{margin-top:1.6em}
.text-block h2:first-child{margin-top:0}
.text-block h3{margin-top:1.4em}
.prosa{width:min(46rem,var(--innen));margin-inline:auto}
.prosa h2{margin-top:1.8em}
.prosa h3{margin-top:1.4em}
.prosa figure{margin:1.5rem 0}
.prosa figure img{border-radius:var(--radius)}
.prosa figcaption{font-size:.88rem;color:var(--grau);margin-top:.5em}
.prosa table{font-size:.95rem;margin:1rem 0 1.5rem}

/* Karten */
.karten{display:grid;gap:1.25rem;margin:1.5rem 0}
.karten-3{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.karten-4{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}
.karten-2{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.karte{background:var(--karte);border:1px solid var(--linie);border-radius:var(--radius);padding:1.4rem;text-decoration:none;color:var(--text);display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
a.karte:hover{transform:translateY(-3px);box-shadow:var(--schatten);border-color:var(--gruen-h)}
.karte h3{margin-bottom:.4em}
.karte p{color:var(--grau);margin-bottom:0;flex:1}
.karte-bild{padding:0;overflow:hidden}
.karte-foto img{aspect-ratio:4/3;object-fit:cover;width:100%}
.karte-text{padding:1.2rem 1.4rem 1.4rem;display:flex;flex-direction:column;flex:1}
.karte-text p{flex:1}
.karte-gruen{background:var(--gruen-hell);border-color:transparent}
.karte-dunkel{background:var(--anthrazit);color:#fff;border-color:transparent}
.karte-dunkel h3{color:#fff}
.karte-dunkel p{color:rgba(255,255,255,.8)}

/* Schritte, Zahlen, Zitate */
.schritte{list-style:none;padding:0;margin:1.5rem 0;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));counter-reset:s}
.schritte li{counter-increment:s;background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:1.3rem 1.3rem 1.3rem 1.3rem;position:relative}
.schritte li::before{content:counter(s,decimal-leading-zero);display:block;font-size:2rem;font-weight:800;color:var(--gruen);line-height:1;margin-bottom:.5rem;letter-spacing:-.03em}
.schritte h3{font-size:1.1rem;margin-bottom:.3em}
.schritte p{margin:0;color:var(--grau);font-size:.98rem}
.zahlen{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));margin:1.5rem 0}
.zahl{background:#fff;border-radius:var(--radius);padding:1.2rem;border:1px solid var(--linie)}
.zahl b{display:block;font-size:2.2rem;font-weight:800;color:var(--gruen-dunkel);letter-spacing:-.03em;line-height:1.1}
.zahl span{color:var(--grau);font-size:.95rem}
.band-dunkel .zahl{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
.band-dunkel .zahl b{color:var(--gruen-h)}
.band-dunkel .zahl span{color:rgba(255,255,255,.8)}
.zitat{border-left:4px solid var(--gruen);padding:.4rem 0 .4rem 1.3rem;margin:1.8rem 0;font-size:1.15rem;line-height:1.5}
.zitat p{margin:0 0 .5em;font-style:normal}
.zitat cite{font-style:normal;font-size:.9rem;color:var(--grau);display:flex;align-items:center;gap:.6rem}
.zitat cite img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.merksatz{font-size:1.25rem;font-weight:700;color:var(--gruen-tief);background:var(--gruen-hell);padding:1rem 1.3rem;border-radius:var(--radius);margin:1.6rem 0}
.kasten{background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:1.3rem 1.5rem;margin:1.5rem 0}
.kasten-gruen{background:var(--gruen-hell);border-color:transparent}
.kasten-warn{background:#fff6e5;border-color:#f3d9a4}
.kasten h3{margin-top:0}
.kasten :last-child{margin-bottom:0}
.liste-haken{list-style:none;padding:0}
.liste-haken li{padding-left:1.6em;position:relative;margin-bottom:.5em}
.liste-haken li::before{content:"✓";position:absolute;left:0;color:var(--gruen-dunkel);font-weight:800}
.liste-kreuz li::before{content:"✕";color:var(--rot)}

/* Ampel */
.ampel{list-style:none;padding:0;margin:1.5rem 0;display:grid;gap:.75rem}
.ampel li{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:1rem 1.2rem}
.ampel b{display:flex;align-items:center;justify-content:center;width:4.2rem;height:4.2rem;border-radius:50%;color:#fff;font-size:1.05rem;text-align:center;line-height:1.1;flex-shrink:0}
.ampel .gruen b{background:var(--gruen-dunkel)}
.ampel .gelb b{background:var(--gelb);color:#3a2f00}
.ampel .rot b{background:var(--rot)}
.ampel h3{margin:0 0 .2em;font-size:1.05rem}
.ampel p{margin:0;color:var(--grau)}

/* FAQ */
.faq{border:1px solid var(--linie);border-radius:12px;background:#fff;margin-bottom:.75rem;padding:0 1.2rem}
.faq summary{cursor:pointer;font-weight:700;padding:1rem 2rem 1rem 0;list-style:none;position:relative;font-size:1.05rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:.85rem;font-size:1.5rem;color:var(--gruen-dunkel);font-weight:400}
.faq[open] summary::after{content:"–"}
.faq > :not(summary){padding-bottom:1rem}
.faq p:last-child{margin-bottom:0}

/* Team */
.person{display:grid;gap:1.5rem;align-items:start;margin:2rem 0}
@media (min-width:760px){.person{grid-template-columns:320px 1fr}}
.person picture img{border-radius:var(--radius);aspect-ratio:4/5;object-fit:cover;object-position:top}
.person h2{margin-bottom:.2em}
.person .rolle{color:var(--gruen-dunkel);font-weight:600;margin-bottom:1em}

/* Öffnungszeiten, Adresse */
.zeiten th{font-weight:600;padding-left:0}
.zeiten td{text-align:right;white-space:nowrap}
.adresse{font-style:normal;line-height:1.7}
.kontakt-raster{display:grid;gap:2rem}
@media (min-width:860px){.kontakt-raster{grid-template-columns:1fr 1fr}}
.kontakt-liste{list-style:none;padding:0}
.kontakt-liste li{padding:.9rem 0;border-bottom:1px solid var(--linie);display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;align-items:center}
.kontakt-liste li:first-child{border-top:1px solid var(--linie)}

/* Formular */
.formular{display:grid;gap:1rem;max-width:40rem}
.formular label{display:grid;gap:.3rem;font-weight:600}
.formular input,.formular textarea,.formular select{font:inherit;padding:.7rem .9rem;border:1px solid #c8cfc5;border-radius:10px;background:#fff;width:100%}
.formular input:focus,.formular textarea:focus{outline:3px solid var(--gruen-h);border-color:var(--gruen-dunkel)}
.formular .zustimmung{display:flex;gap:.6rem;align-items:start;font-weight:400}
.formular .zustimmung input{width:auto;margin-top:.3em}
.honig{position:absolute;left:-9999px;opacity:0;height:0;overflow:hidden}
.meldung{padding:1rem 1.2rem;border-radius:12px;background:#fff6e5;border:1px solid #f3d9a4;margin-bottom:1rem}

/* CTA-Block */
.cta-block{background:var(--dunkel);color:#fff;padding:clamp(2.5rem,6vw,4.5rem) 0;background-image:radial-gradient(60% 80% at 100% 0%,rgba(128,182,70,.25),transparent 60%)}
.cta-block h2{color:#fff}
.cta-block p{max-width:44em;color:rgba(255,255,255,.88)}
.cta-block .klein{color:rgba(255,255,255,.6)}

/* Bewertung */
.sterne{color:var(--gelb);letter-spacing:.05em;font-size:1.1rem}
.bewertung{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:center;font-weight:600}

/* Artikel */
.artikel-kopf{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;font-size:.9rem;color:var(--grau);margin-bottom:1.5rem}
.artikel-kopf span+span::before{content:"·";margin-right:1.2rem;color:var(--grau-hell)}
.hinweis-medizin{width:min(46rem,var(--innen));margin:2.5rem auto;font-size:.92rem;color:var(--grau);border-top:1px solid var(--linie);padding-top:1.2rem}
.inhaltsverzeichnis{background:#fff;border:1px solid var(--linie);border-radius:var(--radius);padding:1rem 1.3rem;margin:1.5rem 0;font-size:.95rem}
.inhaltsverzeichnis ol{margin:0;padding-left:1.2em}
.inhaltsverzeichnis a{text-decoration:none}
.inhaltsverzeichnis a:hover{text-decoration:underline}

/* Bücher */
.buch{display:grid;gap:2rem;align-items:start;margin:2rem 0}
@media (min-width:800px){.buch{grid-template-columns:300px 1fr}}
.buch picture img{border-radius:8px;box-shadow:0 20px 40px rgba(11,21,18,.25);transform:rotate(-1.5deg)}
.download-liste{list-style:none;padding:0;display:grid;gap:.6rem}
.download-liste a{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.9rem 1.1rem;background:#fff;border:1px solid var(--linie);border-radius:12px;text-decoration:none;font-weight:600;color:var(--anthrazit)}
.download-liste a:hover{border-color:var(--gruen-h);box-shadow:var(--schatten)}
.download-liste small{color:var(--grau);font-weight:400}

/* Galerie */
.galerie{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));margin:1.5rem 0}
.galerie figure{margin:0}
.galerie img{border-radius:var(--radius);aspect-ratio:4/3;object-fit:cover;width:100%}
.galerie figcaption{font-size:.85rem;color:var(--grau);margin-top:.4em}
.galerie .hoch img{aspect-ratio:3/4}

/* Fuß */
.fuss{background:var(--dunkel);color:rgba(255,255,255,.85);padding:3rem 0 2rem;margin-top:0}
.fuss h2{font-size:1rem;letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:.8em}
.fuss a{color:#fff}
.fuss ul{list-style:none;padding:0;margin:0}
.fuss li{margin-bottom:.4em}
.fuss-raster{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr))}
.fuss-raster img{width:120px}
.fuss-claim{margin:.8rem 0 1rem;color:var(--gruen-h);font-weight:600}
.fuss .adresse a{color:#fff}
.fuss .zeiten th,.fuss .zeiten td{border-color:rgba(255,255,255,.12);padding-inline:0}
.fuss .zeiten caption{position:absolute;width:1px;height:1px;overflow:hidden}
.fuss .knopf{margin-top:1rem}
.fuss-unten{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.12);font-size:.9rem}
.fuss-unten ul{display:flex;flex-wrap:wrap;gap:1rem}
.fuss-unten li{margin:0}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.kopf,.fuss,.cta-block,.nav-knopf{display:none}body{background:#fff}}

/* ===================== Bewegung und Tiefe ===================== */
/* Einblenden beim Scrollen (nur mit JS, nie bei reduzierter Bewegung) */
html.js:not(.ohne-bewegung) .rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
html.js:not(.ohne-bewegung) .rv.in{opacity:1;transform:none}
/* Kopfzeile */
.kopf .innen{transition:min-height .25s}
.kopf.klein .innen{min-height:3.6rem}
.kopf.klein .marke img{width:48px}
.marke img{transition:width .25s}
/* Titelzeile Wort für Wort */
html.js:not(.ohne-bewegung) .held h1 .wort{display:inline-block;opacity:0;transform:translateY(.5em) rotate(1.5deg);animation:wort .8s cubic-bezier(.2,.7,.2,1) forwards}
@keyframes wort{to{opacity:1;transform:none}}
html.js:not(.ohne-bewegung) .held .unter,html.js:not(.ohne-bewegung) .held .knoepfe,html.js:not(.ohne-bewegung) .held .fakten{opacity:0;animation:wort .9s cubic-bezier(.2,.7,.2,1) forwards}
html.js:not(.ohne-bewegung) .held .unter{animation-delay:.7s}
html.js:not(.ohne-bewegung) .held .knoepfe{animation-delay:.9s}
html.js:not(.ohne-bewegung) .held .fakten{animation-delay:1.1s}
/* Held mit Figur und Nordlicht */
.held-3d{min-height:min(88vh,820px);display:flex;align-items:center}
.held-3d .innen{position:relative;z-index:2;width:var(--innen)}
.held-3d h1,.held-3d .unter{max-width:13.5em}
.held-3d .unter{max-width:30em}
.nordlicht{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;mix-blend-mode:screen;opacity:.85}
.held-figur{position:absolute;right:max(0px,calc((100% - 1180px)/2 - 110px));top:0;height:100%;width:min(40%,560px);z-index:1;pointer-events:none}
.held-3d::after{background:linear-gradient(90deg,rgba(11,21,18,.92) 0%,rgba(11,21,18,.7) 42%,rgba(11,21,18,.28) 100%)}
@media (max-width:900px){
  .held-3d{min-height:0;display:block}
  .nordlicht{display:none}
  .held-figur{position:relative;display:block;width:100%;height:300px;margin:0 0 -1rem;right:auto;top:auto}
  .held-3d::after{background:linear-gradient(180deg,rgba(11,21,18,.5) 0%,rgba(11,21,18,.82) 45%,rgba(11,21,18,.94) 100%)}
}
/* Scroll-Geschichte */
.story{background:radial-gradient(70% 60% at 20% 30%,rgba(128,182,70,.14),transparent 60%),var(--dunkel);overflow:visible}
.story-raster{display:grid;gap:3rem}
@media (min-width:900px){.story-raster{grid-template-columns:1fr 1.1fr;gap:4rem}}
.story-figur{position:sticky;top:5.5rem;height:min(72vh,640px);border-radius:24px;background:radial-gradient(60% 55% at 50% 60%,rgba(128,182,70,.12),transparent 70%)}
.story-figur canvas{width:100%;height:100%;display:block}
@media (max-width:899px){.story-figur{position:relative;top:0;height:min(48vh,380px);margin-inline:-1rem}}
.story-schritte{list-style:none;padding:0;margin:2rem 0 1rem;display:grid;gap:1rem}
.story-schritte li{position:relative;padding:1.4rem 1.4rem 1.4rem 5rem;border-radius:var(--radius);border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);transition:background .5s,border-color .5s,transform .5s}
.story-schritte li.aktiv{background:rgba(128,182,70,.12);border-color:rgba(157,204,106,.55);transform:translateX(6px)}
.story-schritte h3{color:#fff;margin-bottom:.3em;font-size:1.25rem}
.story-schritte p{margin:0;color:rgba(255,255,255,.75)}
.story-nr{position:absolute;left:1.3rem;top:1.25rem;font-size:1.9rem;font-weight:800;letter-spacing:-.04em;color:rgba(157,204,106,.5);transition:color .5s}
.story-schritte li.aktiv .story-nr{color:var(--gruen-h)}
@media (min-width:900px){.story-schritte{gap:1.25rem;margin-top:2.5rem}.story-schritte li{padding-block:1.8rem}}
.zitat-hell{border-left-color:var(--gruen-h);color:#fff}
.zitat-hell cite{color:rgba(255,255,255,.7)}
/* Karten mit Tiefe */
.neigbar{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;transform-style:preserve-3d;will-change:transform}
.neigbar:hover{box-shadow:0 24px 50px rgba(11,21,18,.16)}
.neigbar::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at calc(50% + var(--nx,0%)) calc(50% + var(--ny,0%)),rgba(255,255,255,.22),transparent 55%);opacity:0;transition:opacity .35s}
.neigbar:hover::after{opacity:1}
.karte{position:relative}
/* Das Buch als Körper */
.buch3d-buehne{perspective:1400px;padding:2rem 2.5rem 3rem 1rem;display:flex;justify-content:center}
.buch3d{position:relative;width:min(300px,70vw);transform-style:preserve-3d;transform:perspective(1400px) rotateY(-24deg) rotateX(4deg);transition:transform .6s cubic-bezier(.2,.7,.2,1);filter:drop-shadow(0 30px 40px rgba(11,21,18,.35))}
.buch3d:hover{transform:perspective(1400px) rotateY(-8deg) rotateX(2deg)}
.buch3d-cover img{border-radius:3px 10px 10px 3px;display:block;width:100%;height:auto;transform:none;box-shadow:none}
.buch3d-ruecken{position:absolute;top:0;bottom:0;left:0;width:22px;background:linear-gradient(90deg,#0b1512,#1f2d24 60%,#0b1512);transform:rotateY(-90deg) translateX(-11px) translateZ(0);transform-origin:left;border-radius:3px 0 0 3px}
.buch3d-seiten{position:absolute;top:4px;bottom:4px;right:-14px;width:16px;background:repeating-linear-gradient(90deg,#f5f3ea 0 1.5px,#d9d6c8 1.5px 3px);transform:rotateY(90deg) translateX(8px);transform-origin:right;border-radius:0 2px 2px 0}
.buch3d-buehne + .text-block{align-self:center}
/* Schmerz-Ampel: die drei Stufen leuchten nacheinander */
html.js:not(.ohne-bewegung) .ampel li b{animation:ampel 4.5s ease-in-out infinite}
html.js:not(.ohne-bewegung) .ampel li.gelb b{animation-delay:1.5s}
html.js:not(.ohne-bewegung) .ampel li.rot b{animation-delay:3s}
@keyframes ampel{0%,25%,100%{box-shadow:0 0 0 0 rgba(0,0,0,0);transform:scale(1)}8%{box-shadow:0 0 0 10px rgba(128,182,70,.18);transform:scale(1.06)}}
@media (prefers-reduced-motion:reduce){.rv{opacity:1!important;transform:none!important}.held h1 .wort{opacity:1!important;transform:none!important}}

/* 3D-Entwurf des Anbaus (anbau.js) */
.anbau3d{position:relative;width:100%;background:var(--dunkel);border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3;box-shadow:var(--schatten);background-image:radial-gradient(70% 60% at 50% 100%,rgba(128,182,70,.18),transparent 70%)}
.anbau3d canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y}
.anbau3d canvas.zieht{cursor:grabbing}
.anbau3d noscript picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;box-shadow:none}
.anbau3d-hinweis{position:absolute;right:.9rem;bottom:.6rem;margin:0;font-size:.78rem;color:rgba(255,255,255,.55);pointer-events:none;letter-spacing:.04em}
.anbau3d-etikett{position:absolute;left:.9rem;top:.7rem;margin:0;font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gruen-h);pointer-events:none}

/* Die Praxis als Szene aus Licht (praxis3d.js) */
.praxis3d-band{padding:clamp(1.2rem,3vw,2rem) 0 clamp(2rem,4vw,3rem)}
.praxis3d{position:relative;width:100%;background:var(--dunkel);border-radius:var(--radius);overflow:hidden;aspect-ratio:16/9;box-shadow:var(--schatten);background-image:radial-gradient(60% 55% at 50% 100%,rgba(128,182,70,.2),transparent 70%)}
@media (max-width:700px){.praxis3d{aspect-ratio:4/3}}
.praxis3d canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y}
.praxis3d canvas.zieht{cursor:grabbing}
.praxis3d-text{position:absolute;left:1rem;right:1rem;bottom:.9rem;margin:0;font-weight:700;font-size:clamp(1rem,2.2vw,1.35rem);line-height:1.3;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.7);pointer-events:none;max-width:34ch}
.praxis3d .anbau3d-hinweis{bottom:auto;top:.7rem}
