/* RAAV Scan (scan.raav.io) — Seiten-Stylesheet · Stand 2026-10-16 (Stufe SC1c: Startseite in einem Blick wie raav.io, Überschrift im Muster von raav.io,
   Breath mit Händen am Brustkorb, Scan beginnt mit Frage 1; davor 2026-10-14 Stufe SC1b: Bildfenster je Seite, Marke, Hinleiten, 404; davor SC1: Umzug von os.raav.io, Farbwelt 2.3 statt Neon)
   Farben, Schrift, Bausteine: raav-farbwelt.css (byte-gleiche Kopie von RAAVio/_Design/ — Regeln in raav-farbwelt.md). Hier nur das Layout.
   Schichten von hinten nach vorn: Bild (seit SC1b je Seite ein Bildfenster .bildfenster: das Foto steht per position:sticky, weicher Auslauf;
   nur im Scan steht es als feste Schicht .rv-bild hinter dem App-Fenster) → Partikel (.fx-back, nur Startseite und Scan) → Inhalt (Glas).
   Seiten über die Klasse am <body>: .start (Startseite) · .scan (System-Scan) · body.modul (Mental, Breath, Soma, Nutri) · .bestaetigung (Danke, Willkommen)
   · .quellen · .umzug (Weiterleitungen Impressum/Datenschutz). Geometrie wie bis f4cb441, geändert ist die Gestaltung. Handy zuerst. */

/* ---------- Gemeinsam ---------- */
*{margin:0;padding:0}
html{overflow-x:clip}
body{position:relative;overflow-x:hidden;-webkit-tap-highlight-color:transparent}  /* Lichthof und Scheine ragen über den Rand: am body abschneiden, nie waagerecht scrollen (wie raav.io) */
@supports (overflow:clip){body{overflow-x:clip}}   /* SC1b (academy A2/A3): „hidden“ macht den Body zum eigenen Scroll-Container — dann klebt kein Bildfenster, und Safari hängt beim Richtungswechsel. Nicht zurückstellen. */
.rv-bild picture{display:contents}
.tabular{font-variant-numeric:tabular-nums}

/* Marke: R-Kachel in Logo-Blau, Wortmarke in Titelschwarz, ® in Gold-Tinte (wie raav.io) */
.logo,.logo-link{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--titel)}
.logo-icon,.logo-box{width:36px;height:36px;background:var(--blau);color:#fff;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:20px;line-height:1;box-shadow:var(--knopf-schatten),inset 0 1px 0 rgba(255,255,255,.28);flex:none;transition:transform var(--tempo)}
.logo-text{font-size:21px;font-weight:700;letter-spacing:.03em;color:var(--titel);line-height:1}
.logo-text sup{color:var(--gold-tinte);font-size:9px;font-weight:700;line-height:0;vertical-align:baseline;position:relative;top:-.85em;margin-left:1px}
@media (hover:hover) and (pointer:fine){.logo:hover .logo-icon,.logo:hover .logo-box,.logo-link:hover .logo-icon{transform:translateY(-1px)}}

/* Kopfleiste (Startseite, Module): helles Glas über dem Bild */
.start>header,body.modul>header{background:rgba(247,244,238,.86);-webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15);border-bottom:1px solid rgba(255,255,255,.7);box-shadow:0 1px 0 rgba(0,20,58,.06)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.start>header,body.modul>header{background:rgba(247,244,238,.97)}}

/* Lichtpartikel (Startseite, Scan): drei Schärfen, Leuchthof als radialer Verlauf — Rezept wie raav.io */
.fx-back{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.fx-pt{position:absolute;border-radius:50%;background:var(--gold);opacity:0;width:4px;height:4px}
.fx-pt::before{content:"";position:absolute;inset:-24px;border-radius:50%;background:radial-gradient(closest-side,rgba(232,168,76,.5) 0%,rgba(232,168,76,.4) 14%,rgba(232,168,76,.26) 32%,rgba(232,168,76,.14) 50%,rgba(232,168,76,.06) 68%,rgba(232,168,76,.018) 84%,rgba(232,168,76,0) 100%)}
.fx-pt.nah{width:6px;height:6px}
.fx-pt.nah::before{inset:-32px}
.fx-pt.mittel{filter:blur(1px)}
.fx-pt.fern{width:3px;height:3px;filter:blur(2.5px)}
.fx-pt.fern::before{inset:-18px}
.fx-pt.p1{left:8%;top:22%;animation:rv-fl1 15s ease-in-out infinite}
.fx-pt.p2{left:88%;top:18%;animation:rv-fl2 19s ease-in-out 2s infinite}
.fx-pt.p3{left:76%;top:66%;animation:rv-fl3 17s ease-in-out 5s infinite}
.fx-pt.p4{left:20%;top:74%;animation:rv-fl1 21s ease-in-out 7s infinite}
.fx-pt.p5{left:5%;top:52%;animation:rv-fl2 13s ease-in-out 1s infinite}
.fx-pt.p6{left:92%;top:82%;animation:rv-fl3 23s ease-in-out 9s infinite}
.fx-pt.p7{left:30%;top:12%;animation:rv-fl2 18s ease-in-out 4s infinite}
.fx-pt.p8{left:94%;top:44%;animation:rv-fl1 16s ease-in-out 11s infinite}
.fx-pt.p9{left:14%;top:40%;animation:rv-fl3 20s ease-in-out 6s infinite}
@media (max-width:700px){.fx-pt.fern,.fx-pt.p4,.fx-pt.p6,.fx-pt.p7,.fx-pt.p9{display:none}}
.licht{position:absolute;left:50%;top:-140px;transform:translateX(-50%);width:min(960px,150vw);height:640px;background:radial-gradient(ellipse 55% 50% at 50% 42%,rgba(232,168,76,.14) 0%,rgba(232,168,76,.06) 38%,rgba(232,168,76,0) 70%);pointer-events:none;z-index:0}

/* Schein — warmweißer Leinen-Schleier hinter Text, der direkt auf dem Bild steht; endet INNERHALB seines Kastens (Regel 12, closest-side).
   SC1: Auslauf weicher (Stopps bis 99 %) und Kästen mindestens ≈ 140 px hoch — bei flachen Kästen fällt der Rest-Schleier sonst in den letzten 2 px messbar ab (Kanten-Gate ≤ 3/255) */
.schein{position:relative}
.schein::before{content:"";position:absolute;inset:-40% -22%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.94) 0%,rgba(255,253,249,.92) 45%,rgba(255,253,249,.81) 60%,rgba(255,253,249,.58) 72%,rgba(255,253,249,.32) 82%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.03) 96%,rgba(255,253,249,0) 100%)}

/* Verlaufstext im Band (Regel 13: Innenabstand oben/unten in em, gleich großer negativer Außenabstand — Lage unverändert, Dauer-Gate B1;
   SC1: oben .16em für Umlaut-Punkte (KÖRPER), auch seitlich .08em — sonst schneidet der Kasten die Überhänge des ersten/letzten Buchstabens ab, gemessen mit Futura und Jost) */
.verlauf{display:inline-block;padding:.16em .08em .26em;margin:-.16em -.08em -.26em;color:var(--blau);background:var(--band);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* Fuß: auslaufendes Band (wie raav.io/raav-therapie.de) — von unten Band-Blau nach oben transparent, Bild läuft darunter durch; weiße R-Marke mittig */
.band-fuss{position:relative;z-index:1;width:100%;margin-top:auto;padding:150px 20px calc(26px + env(safe-area-inset-bottom,0px));text-align:center;color:#d5dcf0;background:linear-gradient(to top,var(--band-b) 0%,rgba(0,32,88,.96) 26%,rgba(0,32,88,.72) 55%,rgba(0,32,88,.3) 80%,rgba(0,32,88,0) 100%);border:0}
.band-fuss a{color:#fff;text-decoration:none;font-weight:500;display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
.band-fuss a:hover{text-decoration:underline;text-underline-offset:.2em}
.band-fuss a:focus-visible{outline-color:#fff}
.band-fuss p,.band-fuss span{color:#d5dcf0}
.band-zeichen{display:block;position:relative;width:100%;height:46px;margin:0 0 8px}
.band-zeichen::before{content:"R";position:absolute;left:50%;top:0;transform:translateX(-50%);width:46px;height:46px;border-radius:11px;background:#fff;color:var(--band-b);font-weight:700;font-size:27px;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,8,30,.35)}

/* ---------- Startseite (body.start) ---------- */
.start{min-height:100vh;display:flex;flex-direction:column;line-height:1.35;--bild-schleier-oben:rgba(247,244,238,.1);--bild-schleier-mitte:rgba(247,244,238,.24)}
.abschnitt-kopf .bf-bild img{filter:contrast(1.14) brightness(.95)}
.abschnitt-kopf .bf-bild::after{background:linear-gradient(180deg,var(--bild-schleier-oben) 0%,var(--bild-schleier-mitte) 50%,rgba(247,244,238,.42) 100%)}
.start>header{position:fixed;top:0;left:0;right:0;z-index:50;padding:12px 20px}
.start .header-content{max-width:800px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}
.start main{flex:1;display:block;position:relative;z-index:1}
.start .abschnitt{position:relative;isolation:isolate}
.start .abschnitt-kopf{display:flex;flex-direction:column;align-items:center;padding:88px 20px 36px}  /* SC1c: oben ausgerichtet, ohne Mindesthöhe — Module folgen direkt auf den Scan-Kasten */
.start .container{width:100%;max-width:600px}
.start .hero{text-align:center;margin-bottom:26px;position:relative}
.start .hero::before{content:"";position:absolute;inset:-34% -18%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.95) 0%,rgba(255,253,249,.93) 40%,rgba(255,253,249,.84) 54%,rgba(255,253,249,.66) 66%,rgba(255,253,249,.44) 76%,rgba(255,253,249,.25) 84%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.05) 94.5%,rgba(255,253,249,.018) 97.5%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}
.start .hero-glow{display:none}
.start .hero-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:9999px;background:rgba(255,253,249,.9);border:1px solid rgba(232,168,76,.55);color:var(--blau);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px;box-shadow:0 6px 16px -10px rgba(0,20,58,.3)}
.start .hero-badge-dot{width:8px;height:8px;background:var(--gold);border-radius:50%;animation:sc-puls 2.4s ease-in-out infinite}
@keyframes sc-puls{0%,100%{opacity:1}50%{opacity:.45}}
/* Überschrift (SC1c Teil B): Muster raav.io „Reclaim Your / Biology“ — gemischte Schreibung, Zeile 1 Titelschwarz, Zeile 2 Band-Verlauf, je Zeile ein Block;
   Größe, Gewicht, Laufweite, Zeilenhöhe und Stufen wie raav-io.css (.title …): Handy clamp(40,11vw,52) bzw. 36 px ≤ 380, ab 768 clamp(56,7vw,82),
   ab 1024 clamp(68,6.2vw,94), niedrige Laptops 5,6vw bzw. 5vw. Ausrichtung wie dort: mittig, ab 1024 links in der Inhaltsspalte. Gate: titel_sc1c.mjs */
.start .title{font-size:clamp(40px,11vw,52px);font-weight:700;letter-spacing:-.015em;line-height:1.02;margin:0 0 16px;color:var(--titel)}
.start .title-white{display:block;color:var(--titel)}
.start .title-gradient{display:block;padding:.1em 0 .26em;margin:-.1em 0 -.26em;color:var(--blau);background:var(--band);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
@media (max-width:380px){.start .title{font-size:36px}}
.start .hero-subtitle{font-size:17px;color:var(--text-lauf);line-height:1.55;max-width:420px;margin:0 auto}
.start .hero-subtitle strong{color:var(--titel);font-weight:700}
.start .hero-subtitle{position:relative}  /* ohne eigene Ebene: der Schein liegt in der Ebene von main, hinter allem Text */
.start .hero-subtitle::before{content:"";position:absolute;inset:-85% -30%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.95) 0%,rgba(255,253,249,.93) 40%,rgba(255,253,249,.84) 54%,rgba(255,253,249,.66) 66%,rgba(255,253,249,.44) 76%,rgba(255,253,249,.25) 84%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.05) 94.5%,rgba(255,253,249,.018) 97.5%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}
/* Scan-Fenster: Glas, Band-Kante oben als Etikett, Knopf in Blau */
.start .scan-banner{position:relative;overflow:hidden;background:var(--glas);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten-hoch);padding:22px 24px;margin-bottom:28px;display:flex;align-items:center;justify-content:space-between;gap:20px;text-decoration:none;color:var(--text);transition:transform var(--tempo),box-shadow var(--tempo),border-color var(--tempo)}
.start .scan-banner::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--band)}
.start .scan-banner-content{display:flex;align-items:center;gap:16px;flex:1}
.start .scan-banner-icon,.start .icon-box{width:48px;height:48px;border-radius:50%;background:rgba(239,232,220,.88);border:1px solid rgba(255,255,255,.75);box-shadow:inset 0 1px 0 rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background-color var(--tempo),border-color var(--tempo)}
.start .scan-banner-icon svg,.start .icon-box svg{width:22px;height:22px;stroke:var(--gold-symbol);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.start .scan-banner-text h3{font-size:16px;font-weight:700;color:var(--titel);margin-bottom:3px}
.start .scan-banner-text p{font-size:14px;color:var(--text-lauf);line-height:1.45}
.start .scan-banner-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;font-size:15px;font-weight:700;color:#fff;background:var(--blau);border-radius:var(--r-knopf);box-shadow:var(--knopf-schatten);white-space:nowrap;flex-shrink:0;transition:background-color var(--tempo)}
.start .scan-banner-btn svg,.start .module-cta svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--tempo)}
/* Vier Module: Glas-Türen, Symbolscheibe in Bone, Symbol in Gold */
.start .module-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-bottom:28px}
@media (min-width:500px){.start .module-grid{grid-template-columns:1fr 1fr}}
.start .module-card{position:relative;background:var(--glas);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:22px;display:flex;flex-direction:column;gap:14px;text-decoration:none;color:var(--text);transition:transform var(--tempo),box-shadow var(--tempo),border-color var(--tempo)}
.start .module-header{display:flex;align-items:flex-start;justify-content:space-between}
.start .status-badge{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:9999px}
.start .status-badge.live{background:rgba(255,253,249,.92);color:var(--gold-tinte);border:1px solid rgba(232,168,76,.6)}
.start .module-content h2{font-size:19px;font-weight:700;margin-bottom:5px;color:var(--titel)}
.start .module-content p{font-size:14px;color:var(--text-lauf);line-height:1.5}
.start .module-cta{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--blau);margin-top:auto}
.start .info-box{background:var(--glas-dicht);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas-klein);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:18px 20px;text-align:center}
.start .info-box p{font-size:14.5px;color:var(--text-lauf);line-height:1.6}
.start .info-box strong{color:var(--titel);font-weight:700}
@media (hover:hover) and (pointer:fine){
  .start .scan-banner:hover,.start .module-card:hover{transform:translateY(-3px);border-color:rgba(232,168,76,.65);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten-hoch)}
  .start .scan-banner:hover .scan-banner-btn{background:var(--blau-hover)}
  .start .module-card:hover .icon-box{background:var(--gold-hauch);border-color:var(--gold)}
  .start .module-card:hover .module-cta svg,.start .scan-banner:hover .scan-banner-btn svg{transform:translateX(4px)}
}
.start .footer-content{max-width:600px;margin:0 auto;display:flex;flex-direction:column;gap:8px;align-items:center}
.start .footer-links{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 22px;font-size:13.5px}
.start .footer-copyright{font-size:12.5px;color:#d5dcf0}
@media (max-width:600px){
  .start .scan-banner{flex-direction:column;align-items:stretch;text-align:center;padding:22px 20px 20px}
  .start .scan-banner-content{flex-direction:column;gap:12px}
  .start .scan-banner-btn{width:100%}
}
/* Startseite am Handy (< 700 px): Tiefen-Fassung -t, Bildschleier nur ein Hauch, Glas dünn und als Verlauf dicht unter dem Text (Farbwelt 2.3, wie raav.io D2.3) */
@media (max-width:700px){
  .start{--glas-blur:6px}
  .start .bf-bild img{object-position:30% 50%;filter:none}
  .start .bf-bild::after{background:linear-gradient(180deg,rgba(247,244,238,0) 0%,rgba(247,244,238,.05) 50%,rgba(247,244,238,.12) 100%)}
  .start .hero::before{inset:-40% -40%}
  .start .scan-banner{background:linear-gradient(180deg,rgba(255,253,249,.5) 0,rgba(255,253,249,.5) 64px,rgba(255,253,249,.86) 108px,rgba(255,253,249,.86) 100%)}
  .start .module-card{background:linear-gradient(180deg,rgba(255,253,249,.44) 0,rgba(255,253,249,.44) 58px,rgba(255,253,249,.86) 92px,rgba(255,253,249,.86) 100%)}
  .start .info-box{background:rgba(255,253,249,.86)}
}
/* Tablet und Desktop */
@media (min-width:768px){
  .start>header{padding:14px 32px}
  .start .hero-subtitle{font-size:19px;max-width:460px}
  .start .abschnitt-kopf{padding:100px 32px 44px}
  .start .abschnitt-kopf .container{max-width:720px}
  .start .title{font-size:clamp(56px,7vw,82px);margin-bottom:18px}
}
/* Startseite am Desktop (ab 1024 px): Säule im linken Drittel (Kontrast-Fassung -k), Inhalt rechts — wie raav.io D2.2 */
@media (min-width:1024px){
  .start{--glas-blur:12px;--glas:rgba(255,253,249,.66)}
  .start .bf-bild img{object-position:0% 50%}
  .start .bf-bild::after{background:linear-gradient(90deg,rgba(247,244,238,0) 0%,rgba(247,244,238,0) 26%,rgba(247,244,238,.36) 42%,rgba(247,244,238,.48) 100%),linear-gradient(180deg,rgba(247,244,238,.06) 0%,rgba(247,244,238,.1) 60%,rgba(247,244,238,.16) 100%)}
  .start .licht{left:auto;right:-6vw;transform:none;top:-120px;width:min(1100px,70vw)}
  .start>header{background:linear-gradient(90deg,rgba(247,244,238,0) 0%,rgba(247,244,238,0) 24%,rgba(247,244,238,.9) 36%,rgba(247,244,238,.92) 100%);-webkit-backdrop-filter:none;backdrop-filter:none;border-bottom:0;box-shadow:none;padding:22px max(56px,6vw) 14px calc(37vw + 24px)}
  .start .header-content{max-width:680px;margin:0}
  .start .abschnitt-kopf{align-items:flex-start;padding:96px max(56px,6vw) 44px calc(37vw + 24px)}
  .start .abschnitt-kopf .container{max-width:760px;margin:0}
  .start .hero{text-align:left;margin-bottom:22px}
  .start .hero::before{inset:-40% -16% -36% -20%}
  .start .hero-subtitle{margin:0;font-size:20px;max-width:540px}
  .start .title{font-size:clamp(68px,6.2vw,94px);margin-bottom:16px}
  .start .hero-badge{margin-bottom:14px}
  .fx-pt.p1{left:6%;top:18%}.fx-pt.p2{left:22%;top:9%}.fx-pt.p3{left:31%;top:34%}.fx-pt.p4{left:12%;top:47%}.fx-pt.p5{left:27%;top:63%}
  .fx-pt.p6{left:4%;top:78%}.fx-pt.p7{left:17%;top:30%}.fx-pt.p8{left:96%;top:22%}.fx-pt.p9{left:33%;top:84%}
}
@media (min-width:1024px) and (max-height:860px){.start .abschnitt-kopf{padding-top:90px}.start .hero{margin-bottom:18px}.start .title{font-size:clamp(60px,5.6vw,84px);margin-bottom:12px}}
@media (min-width:1024px) and (max-height:760px){.start .title{font-size:clamp(56px,5vw,76px)}}

/* ---------- System-Scan (body.scan): App-Rahmen (Kopf, scrollender Inhalt, Fuß) über dem Bild ---------- */
html:has(>body.scan),.scan{height:100%;overflow:hidden}
.scan{--accent:var(--blau);line-height:1.6;--bild-schleier-oben:rgba(247,244,238,.1);--bild-schleier-mitte:rgba(247,244,238,.24)}
.scan .rv-bild img{filter:contrast(1.14) brightness(.95)}
.scan .rv-bild::after{background:linear-gradient(180deg,var(--bild-schleier-oben) 0%,var(--bild-schleier-mitte) 50%,rgba(247,244,238,.42) 100%)}
.scan .app{height:100%;display:flex;flex-direction:column;position:relative;z-index:1}
.scan .header{padding:12px 24px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;background:rgba(247,244,238,.86);-webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15);border-bottom:1px solid rgba(255,255,255,.7);box-shadow:0 1px 0 rgba(0,20,58,.06)}
.scan .progress-container{flex:1;max-width:200px;margin:0 0 0 20px}
.scan .progress-bar{height:5px;background:rgba(0,32,88,.12);border-radius:3px;overflow:hidden}
.scan .progress-fill{height:100%;background:var(--band);border-radius:3px;transition:width .5s ease}
.scan .progress-text{font-size:12px;color:var(--text-hell);margin-top:3px;text-align:right;font-variant-numeric:tabular-nums;font-weight:500}
.scan .main{flex:1;overflow-y:auto;overflow-x:hidden;padding:24px;-webkit-overflow-scrolling:touch}
.scan .slide{display:none;max-width:600px;margin:0 auto;animation:sc-ein .4s ease;min-height:500px}
.scan .slide.active{display:block}
@keyframes sc-ein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
/* Einstieg: Schaufenster — Titel und Untertitel auf Schein, Merkmale als Glas, Knopf in Blau */
.scan .intro-content{text-align:center;padding:26px 0 30px}
.scan .intro-icon{width:84px;height:84px;margin:0 auto 26px;background:rgba(255,253,249,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(232,168,76,.6);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten)}
.scan .intro-icon svg{width:38px;height:38px;stroke:var(--gold-symbol);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.scan .intro-title{font-size:clamp(32px,8.6vw,48px);font-weight:700;letter-spacing:-.015em;margin-bottom:12px;line-height:1.05;color:var(--titel)}
.scan .intro-title .accent{display:inline-block;padding:.16em .08em .26em;margin:-.16em -.08em -.26em;color:var(--blau);background:var(--band);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.scan .intro-subtitle{font-size:16.5px;color:var(--text-lauf);margin-bottom:26px;max-width:400px;margin-left:auto;margin-right:auto;line-height:1.55}
.scan .intro-title,.scan .intro-subtitle,.scan .section-title,.scan .section-desc,.scan .results-title,.scan .results-subtitle{position:relative}
.scan .slide{position:relative;isolation:isolate}  /* alle Scheine einer Ansicht in EINER Ebene hinter dem Text — sonst legt sich der Schein einer Folgezeile über den Text davor */
.scan .intro-title::before,.scan .intro-subtitle::before,.scan .section-header::before,.scan .results-header::before{content:"";position:absolute;inset:-95% -18%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.95) 0%,rgba(255,253,249,.93) 40%,rgba(255,253,249,.84) 54%,rgba(255,253,249,.66) 66%,rgba(255,253,249,.44) 76%,rgba(255,253,249,.25) 84%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.05) 94.5%,rgba(255,253,249,.018) 97.5%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}
.scan .intro-subtitle::before{inset:-85% -12%}
.scan .section-desc{display:inline-block}
.scan .section-desc::before{content:"";position:absolute;inset:-160% -10%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.95) 0%,rgba(255,253,249,.93) 40%,rgba(255,253,249,.84) 54%,rgba(255,253,249,.66) 66%,rgba(255,253,249,.44) 76%,rgba(255,253,249,.25) 84%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.05) 94.5%,rgba(255,253,249,.018) 97.5%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}
.scan .intro-features{display:flex;flex-direction:column;gap:10px;margin-bottom:28px}
.scan .intro-feature{display:flex;align-items:center;gap:12px;padding:12px 16px;background:rgba(255,253,249,.84);-webkit-backdrop-filter:blur(12px) saturate(1.15);backdrop-filter:blur(12px) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas-klein);box-shadow:inset 0 1px 0 var(--glas-licht),0 8px 20px -14px rgba(0,20,58,.35)}
.scan .intro-feature svg{width:20px;height:20px;stroke:var(--gold-symbol);flex-shrink:0;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scan .intro-feature span{font-size:15px;color:var(--text);font-weight:500}
/* Abschnitte */
.scan .section-header{margin-bottom:22px;text-align:center;position:relative}
.scan .section-header::before{inset:-48% -10% -75%}
.scan .section-badge{display:inline-flex;align-items:center;gap:8px;padding:5px 14px;background:rgba(255,253,249,.92);border:1px solid rgba(232,168,76,.6);border-radius:100px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blau);margin-bottom:12px}
.scan .section-title{font-size:clamp(24px,5.4vw,30px);font-weight:700;letter-spacing:-.01em;margin-bottom:4px;color:var(--titel);line-height:1.2}
.scan .section-desc{font-size:15px;color:var(--text-lauf)}
.scan .question-group{background:var(--glas-dicht);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:20px;margin-bottom:16px}
.scan .question-group-title{font-size:13px;font-weight:700;color:var(--blau);margin-bottom:16px;display:flex;align-items:center;gap:8px;letter-spacing:.02em}
.scan .question-group-title svg{width:18px;height:18px;stroke:var(--gold-symbol);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scan .question-item{margin-bottom:24px}
.scan .question-item:last-child{margin-bottom:0}
.scan .question-text{font-size:16px;font-weight:500;margin-bottom:14px;line-height:1.4;color:var(--text)}
/* Regler: Spur in Linie, Füllung im Band, Griff weiß mit blauem Ring */
.scan .slider-container{padding:0 4px}
.scan .slider-labels{display:flex;justify-content:space-between;gap:12px;margin-bottom:6px}
.scan .slider-label{font-size:12px;color:var(--text-hell);font-weight:500}
.scan .slider-wrapper{position:relative;height:44px;display:flex;align-items:center}
.scan .slider-track{position:absolute;width:100%;height:6px;background:rgba(0,32,88,.12);border-radius:3px}
.scan .slider-fill{position:absolute;height:6px;background:var(--band);border-radius:3px;transition:width .1s ease}
.scan .slider-input{position:relative;width:100%;height:44px;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;z-index:2}
.scan .slider-input::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;background:#fff;border:3px solid var(--blau);border-radius:50%;box-shadow:0 2px 8px rgba(0,20,58,.3);cursor:grab;transition:transform .2s ease}
.scan .slider-input::-webkit-slider-thumb:hover{transform:scale(1.08)}
.scan .slider-input::-moz-range-thumb{width:20px;height:20px;background:#fff;border:3px solid var(--blau);border-radius:50%;box-shadow:0 2px 8px rgba(0,20,58,.3);cursor:grab}
.scan .slider-input:focus-visible{outline:none}
.scan .slider-input:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px var(--blau-ring),0 2px 8px rgba(0,20,58,.3)}
.scan .slider-input:focus-visible::-moz-range-thumb{box-shadow:0 0 0 4px var(--blau-ring)}
.scan .slider-wrapper:has(.slider-input:focus-visible){outline:3px solid var(--blau);outline-offset:2px;border-radius:6px}
.scan .slider-value{text-align:right;margin-top:4px;font-variant-numeric:tabular-nums}
.scan .slider-value-number{font-size:21px;font-weight:700;color:var(--blau)}
.scan .slider-value-max{font-size:13px;color:var(--text-hell);font-weight:500}
.scan .textarea-item{margin-bottom:20px}
.scan .textarea-item:last-child{margin-bottom:0}
.scan .textarea-label{font-size:16px;font-weight:500;margin-bottom:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--text)}
.scan .textarea-label .optional{font-size:12px;font-weight:500;color:var(--text-hell)}
.scan .textarea-input{width:100%;min-height:84px;padding:13px 14px;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-glas-klein);color:var(--text);font:inherit;font-size:16px;resize:vertical;outline:none;transition:border-color var(--tempo),box-shadow var(--tempo)}
.scan .textarea-input:focus{border-color:var(--blau);box-shadow:0 0 0 3px var(--blau-ring)}
.scan .textarea-input::placeholder{color:var(--text-hell)}
/* Knöpfe */
.scan .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:13px 26px;border-radius:var(--r-knopf);font:inherit;font-weight:700;font-size:15.5px;border:2px solid transparent;cursor:pointer;transition:background-color var(--tempo),border-color var(--tempo),color var(--tempo),transform var(--tempo);text-decoration:none;line-height:1.3}
.scan .btn:active{transform:translateY(1px)}
.scan .btn-primary{background:var(--blau);border-color:var(--blau);color:#fff;width:100%;box-shadow:var(--knopf-schatten)}
.scan .btn-secondary{background:rgba(255,253,249,.9);color:var(--blau);border-color:rgba(0,0,175,.55)}
.scan .btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.scan .btn-row{display:flex;gap:12px;margin-top:24px}
.scan .btn-row .btn{flex:1}
@media (hover:hover) and (pointer:fine){
  .scan .btn-primary:hover{background:var(--blau-hover);border-color:var(--blau-hover)}
  .scan .btn-secondary:hover{background:var(--karte);border-color:var(--blau)}
  .scan .newsletter-submit:hover{background:var(--blau);color:#fff}
  .scan .btn-pdf:hover{background:var(--karte);border-color:var(--text-hell);color:var(--text)}
}
/* Ergebnis */
.scan .results-container{padding:10px 0}
.scan .results-header{text-align:center;margin-bottom:28px;position:relative}
.scan .results-header::before{inset:-48% -12% -75%}
.scan .results-title{font-size:clamp(30px,7.6vw,40px);font-weight:700;letter-spacing:-.015em;margin-bottom:4px;color:var(--titel);line-height:1.1}
.scan .results-subtitle{font-size:15px;color:var(--text-lauf)}
.scan .radar-container{position:relative;width:100%;max-width:340px;margin:0 auto 28px;aspect-ratio:1;background:rgba(255,253,249,.86);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:50%;box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten-hoch);padding:10px}
.scan .radar-svg{width:100%;height:100%;overflow:visible}
.scan .radar-grid{stroke:rgba(0,32,88,.22);stroke-width:1;fill:none}
.scan .radar-grid-inner{stroke:rgba(0,32,88,.14);stroke-width:.75;fill:none}
.scan .radar-axis{stroke:rgba(0,32,88,.16);stroke-width:1}
.scan .radar-area{fill:rgba(0,0,175,.07);stroke:rgba(0,0,175,.4);stroke-width:1.2}
.scan .radar-segment{stroke-width:3;fill:none;stroke-linecap:round}
.scan .radar-point{stroke:#fff;stroke-width:2}
.scan .radar-label{font-size:12px;font-weight:700;fill:var(--text)}
.scan .radar-value{font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.scan .score-section{margin-bottom:22px}
.scan .score-section-title{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-hell);margin-bottom:10px;padding:2px 8px;display:inline-block;background:rgba(255,253,249,.86);border-radius:6px}
.scan .score-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.scan .score-card{background:var(--glas-dicht);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas-klein);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:16px;position:relative;overflow:hidden}
.scan .score-card-header{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.scan .score-card-icon{width:34px;height:34px;background:rgba(239,232,220,.9);border-radius:50%;display:flex;align-items:center;justify-content:center;flex:none}
.scan .score-card-icon svg{width:18px;height:18px;stroke:var(--gold-symbol);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.scan .score-card-name{font-size:14px;font-weight:700;color:var(--text)}
.scan .score-card-value{font-size:28px;font-weight:700;margin-bottom:8px;font-variant-numeric:tabular-nums;line-height:1.2}
.scan .score-card-bar{height:5px;background:rgba(0,32,88,.1);border-radius:3px;overflow:hidden}
.scan .score-card-bar-fill{height:100%;border-radius:3px;transition:width 1s ease}
.scan .result-text{background:var(--glas-dicht);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:20px;margin-bottom:18px}
.scan .result-text-title{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-hell);margin-bottom:12px;display:flex;align-items:center;gap:8px}
.scan .result-text-title svg{width:16px;height:16px;stroke:var(--gold-symbol);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scan .result-text-content{font-size:15.5px;line-height:1.7;color:var(--text-lauf)}
.scan .result-text-content p{margin-bottom:12px}
.scan .result-text-content p:last-child{margin-bottom:0}
.scan .result-text-content strong{color:var(--titel);font-weight:700}
.scan .result-text-content .highlight{color:var(--blau);font-weight:700}
.scan .recommendation-list{margin:14px 0 0}
.scan .recommendation-item{display:flex;gap:14px;padding:13px 14px;background:rgba(255,253,249,.7);border-radius:var(--r-glas-klein);margin-bottom:10px;border:1px solid var(--linie)}
.scan .recommendation-item:last-child{margin-bottom:0}
.scan .recommendation-item:first-child{background:var(--gold-hauch);border-color:rgba(232,168,76,.6)}
.scan .recommendation-number{width:30px;height:30px;background:var(--blau);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}
.scan .recommendation-item:not(:first-child) .recommendation-number{background:var(--flaeche);color:var(--text-lauf)}
.scan .recommendation-content h4{font-size:15px;font-weight:700;margin-bottom:1px;color:var(--titel)}
.scan .recommendation-content p{font-size:13.5px;color:var(--text-lauf);line-height:1.45}
/* Nächster Schritt: dichtes Glas mit Band-Kante */
.scan .cta-section{position:relative;overflow:hidden;background:rgba(255,253,249,.88);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten-hoch);padding:26px 24px 24px;text-align:center;margin-top:22px}
.scan .cta-section::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--band)}
.scan .cta-title{font-size:19px;font-weight:700;margin-bottom:6px;color:var(--titel)}
.scan .cta-desc{font-size:15px;color:var(--text-lauf);margin-bottom:16px}
.scan .cta-divider{display:flex;align-items:center;gap:16px;margin:20px 0}
.scan .cta-divider::before,.scan .cta-divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.scan .cta-divider::after{background:linear-gradient(90deg,var(--gold),transparent)}
.scan .cta-divider span{font-size:13px;color:var(--text-hell);font-weight:500}
.scan .cta-newsletter-text{font-size:14.5px;color:var(--text-lauf);margin-bottom:12px}
.scan .newsletter-form{display:flex;gap:10px;max-width:420px;margin:0 auto}
.scan .newsletter-input{flex:1;min-width:0;min-height:48px;padding:12px 16px;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-knopf);color:var(--text);font:inherit;font-size:16px;outline:none;transition:border-color var(--tempo),box-shadow var(--tempo)}
.scan .newsletter-input:focus{border-color:var(--blau);box-shadow:0 0 0 3px var(--blau-ring)}
.scan .newsletter-input::placeholder{color:var(--text-hell)}
.scan .newsletter-submit{min-height:48px;padding:12px 20px;background:var(--karte);color:var(--blau);border:2px solid var(--blau);border-radius:var(--r-knopf);font:inherit;font-weight:700;font-size:15px;cursor:pointer;transition:background-color var(--tempo),color var(--tempo);white-space:nowrap}
.scan .newsletter-privacy{font-size:12.5px;color:var(--text-hell);margin-top:10px}
.scan .newsletter-privacy a{color:var(--blau)}
.scan .pdf-section{margin-top:18px;padding-top:16px;border-top:1px solid var(--linie)}
.scan .pdf-hint{font-size:13.5px;color:var(--text-lauf);margin-bottom:10px}
.scan .btn-pdf{background:transparent;border:1px solid rgba(74,72,68,.35);color:var(--text-lauf);width:100%}
@media (max-width:480px){.scan .newsletter-form{flex-direction:column}}
/* Fuß des Scans: schmales Band, oben weich auslaufend (der Fuß bleibt sichtbar, darum ohne hohen Anstieg) */
.scan .footer{padding:30px 24px calc(12px + env(safe-area-inset-bottom,0px));text-align:center;flex-shrink:0;background:linear-gradient(to top,var(--band-b) 0%,var(--band-b) 62%,rgba(0,32,88,.9) 74%,rgba(0,32,88,.45) 88%,rgba(0,32,88,0) 100%);position:relative;z-index:2}
.scan .footer-text{font-size:12.5px;color:#d5dcf0;line-height:1.5}
.scan .footer-legal{font-size:12.5px;color:#d5dcf0;margin-top:2px}
.scan .footer-legal a{color:#fff;text-decoration:none;font-weight:500;display:inline-flex;align-items:center;min-height:36px;padding:0 4px}
.scan .footer-legal a:hover{text-decoration:underline;text-underline-offset:.2em}
.scan .footer-legal a:focus-visible{outline-color:#fff}
@media (max-width:480px){
  .scan .header{padding:10px 16px}
  .scan .progress-container{margin-left:14px}
  .scan .main{padding:16px}
  .scan .question-group{padding:16px}
  .scan .score-cards{grid-template-columns:1fr}
  .scan .btn-row{flex-direction:column}
  .scan .radar-container{max-width:290px}
  .scan .slide{min-height:auto}
}
/* Scan am Handy (< 700 px): Tiefen-Fassung -t, Bildschleier nur ein Hauch; Text steht auf Schein bzw. dichtem Glas */
@media (max-width:700px){
  .scan{--glas-blur:8px}
  .scan .rv-bild img{object-position:50% 40%;filter:none}
  .scan .rv-bild::after{background:linear-gradient(180deg,rgba(247,244,238,0) 0%,rgba(247,244,238,.05) 50%,rgba(247,244,238,.12) 100%)}
  .scan .intro-title::before{inset:-95% -30%}
  .scan .section-header::before,.scan .results-header::before{inset:-48% -30% -75%}
  .scan .intro-subtitle::before{inset:-85% -42%}
  .scan .section-desc::before{inset:-160% -42%}
  .scan .question-group,.scan .score-card,.scan .result-text{background:rgba(255,253,249,.86)}
}
@media (min-width:1024px){
  .scan .rv-bild img{object-position:50% 40%}
  .scan .rv-bild::after{background:linear-gradient(90deg,rgba(247,244,238,.08) 0%,rgba(247,244,238,.3) 30%,rgba(247,244,238,.34) 50%,rgba(247,244,238,.3) 70%,rgba(247,244,238,.08) 100%)}
  .scan .main{padding:40px 24px}
}

/* ---------- Module (body.modul: Mental, Breath, Soma, Nutri) — ruhiger: weiche Grundfassung, dichter Schleier in der Lesespalte, kein Partikel ---------- */
body.modul{--white:var(--titel);--gray-300:var(--text-lauf);--gray-400:var(--text-hell);--gray-500:var(--text-hell);--gray-600:var(--text-hell);--accent:var(--blau);min-height:100vh;display:flex;flex-direction:column;line-height:1.35;color:var(--text)}
body.modul .bf-bild::after{background:linear-gradient(90deg,rgba(247,244,238,.5) 0%,rgba(247,244,238,.8) 50%,rgba(247,244,238,.5) 100%),linear-gradient(180deg,rgba(247,244,238,.3) 0%,rgba(247,244,238,.5) 100%)}
body.modul>header{position:fixed;top:0;left:0;right:0;z-index:50;padding:12px 20px}
body.modul .header-content{max-width:600px;margin:0 auto;display:flex;justify-content:space-between;align-items:center}
body.modul .slide-counter{font-size:13px;font-variant-numeric:tabular-nums;font-weight:500;color:var(--text-hell)}
body.modul .progress-bar{position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(0,32,88,.1)}
body.modul .progress-fill{height:100%;background:var(--band);transition:width .3s ease}
/* Folienbereich (Nachtrag 1, A2): genau eine Fensterhöhe zwischen festem Kopf (--kopf-h) und unterer Leiste (--leiste-h = Punkte + Knopfleiste).
   Die aktive Folie ist das Scrollfenster: passt sie nicht in die Höhe, scrollt sie in sich — nichts Bedienbares liegt je unter Kopf oder Leiste.
   Innen 16 px oben, 24 px unten (≥ 16 px über der Leiste, Platz für den Kartenschatten). Unter main nur noch der Fuß (Seite scrollt nur dorthin). */
body.modul{--kopf-h:67px;--leiste-h:69px}
body.modul main{flex:none;height:100vh;height:100dvh;display:flex;align-items:center;justify-content:center;padding:var(--kopf-h) 0 calc(var(--leiste-h) + env(safe-area-inset-bottom,0px));position:relative;z-index:1}
body.modul .slide-container{width:100%;max-width:560px;max-height:100%;display:flex;flex-direction:column}
body.modul .slide{display:none}
body.modul .slide.active{display:block;flex:0 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:16px 20px 24px;animation:sc-ein .4s ease}
/* Überzeile als Pille: dichtes Glas, goldener Rand, blaue Schrift */
body.modul .badge{display:inline-flex;align-items:center;gap:8px;padding:6px 16px;border-radius:9999px;background:rgba(255,253,249,.92);border:1px solid rgba(232,168,76,.6);color:var(--blau);font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;box-shadow:0 6px 16px -10px rgba(0,20,58,.3)}
body.modul .badge-dot{width:8px;height:8px;background:var(--gold);border-radius:50%}
body.modul .card{position:relative;background:var(--glas-lesen);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:24px}
body.modul .accent-card{position:relative;background:linear-gradient(135deg,rgba(255,246,228,.9) 0%,rgba(255,253,249,.84) 100%);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid rgba(232,168,76,.55);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:24px}
body.modul .icon-box{width:48px;height:48px;background:rgba(239,232,220,.9);border-radius:12px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(232,168,76,.45);flex-shrink:0}
body.modul .icon-box.white{background:var(--karte);border:1px solid var(--linie)}
body.modul .icon-box svg{width:24px;height:24px;stroke:var(--gold-symbol);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
body.modul .icon-box.white svg{stroke:var(--text-lauf)}
body.modul .takeaway-box{background:linear-gradient(135deg,rgba(255,246,228,.92) 0%,rgba(255,253,249,.88) 100%);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-left:3px solid var(--gold-symbol);border-radius:0 12px 12px 0;padding:16px 20px;margin-top:20px;box-shadow:0 8px 20px -14px rgba(0,20,58,.3)}
body.modul .takeaway-box p{color:var(--text);font-size:15.5px;font-weight:500;margin:0;line-height:1.6}  /* kein Kursiv: Futura wählt am Mac dafür eine schwere Condensed-Schnittvariante; der Merksatz trägt Goldkante und Goldhauch */
body.modul h1{font-size:clamp(40px,12vw,72px);font-weight:700;letter-spacing:-.02em;line-height:.98;margin-bottom:20px;color:var(--titel)}
body.modul h1 .gradient{display:inline-block;padding:.16em .08em .26em;margin:-.16em -.08em -.26em;color:var(--blau);background:var(--band);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.modul h2{font-size:clamp(28px,8vw,40px);font-weight:700;letter-spacing:-.015em;text-align:center;margin-bottom:24px;line-height:1.12;color:var(--titel)}
body.modul .accent{color:var(--blau)}
body.modul p{line-height:1.7}
body.modul .btn{padding:15px 28px;min-height:52px;border-radius:var(--r-knopf);font-weight:700;font-size:16px;border:2px solid transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:12px;transition:background-color var(--tempo),border-color var(--tempo),transform var(--tempo);width:100%;text-decoration:none;font-family:inherit;line-height:1.3;letter-spacing:.02em}
body.modul .btn:active{transform:translateY(1px)}
body.modul .btn-primary{background:var(--blau);border-color:var(--blau);color:#fff;box-shadow:var(--knopf-schatten)}
body.modul .btn-secondary{background:rgba(255,253,249,.9);color:var(--blau);border-color:rgba(0,0,175,.55)}
body.modul .btn svg{width:20px;height:20px}
body.modul .form-input{width:100%;min-height:52px;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-knopf);padding:14px 16px;color:var(--text);font-size:16px;margin-bottom:12px;outline:none;font-family:inherit;transition:border-color var(--tempo),box-shadow var(--tempo)}
body.modul .form-input:focus{border-color:var(--blau);box-shadow:0 0 0 3px var(--blau-ring)}
body.modul .form-input::placeholder{color:var(--text-hell)}
body.modul .honeypot{position:absolute;left:-9999px}
/* Untere Leiste: helles Glas, Zurück als Rahmen, Weiter in Blau, Punkte in Band-Blau */
body.modul .bottom-nav{position:fixed;bottom:0;left:0;right:0;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px));background:rgba(247,244,238,.88);-webkit-backdrop-filter:blur(14px) saturate(1.15);backdrop-filter:blur(14px) saturate(1.15);border-top:1px solid rgba(255,255,255,.75);box-shadow:0 -1px 0 rgba(0,20,58,.06),0 -10px 24px -18px rgba(0,20,58,.3);display:flex;justify-content:space-between;align-items:center;z-index:50}
body.modul .nav-btn{min-height:44px;padding:10px 14px;border-radius:var(--r-knopf);font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;font-family:inherit;transition:background-color var(--tempo),border-color var(--tempo)}
body.modul .nav-btn.prev{background:var(--karte);border:1px solid rgba(74,72,68,.3);color:var(--titel)}
body.modul .nav-btn.prev:disabled{color:var(--text-hell);opacity:.55;cursor:default}
body.modul .nav-btn.next{background:var(--blau);border:1px solid var(--blau);color:#fff;box-shadow:var(--knopf-schatten)}
body.modul .nav-btn.next:disabled{background:var(--flaeche);border-color:var(--flaeche);color:var(--text-hell);box-shadow:none;cursor:default}
body.modul .nav-btn svg{width:18px;height:18px}
body.modul .nav-dots{display:flex;gap:6px;align-items:center;margin:0 8px}
body.modul .nav-dot{width:8px;height:8px;border-radius:4px;background:rgba(0,32,88,.22);border:none;cursor:pointer;padding:0;transition:width .3s ease,background-color .3s ease;position:relative}
body.modul .nav-dot::after{content:"";position:absolute;inset:-14px -3px}
body.modul .nav-dot.active{width:24px;background:var(--blau)}
body.modul .desktop-nav{display:none}
@media (min-width:768px){
  body.modul .desktop-nav{display:block}
  body.modul .desktop-nav button{position:fixed;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;border:1px solid var(--glas-rand);background:rgba(255,253,249,.82);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);color:var(--titel);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color var(--tempo),background-color var(--tempo);z-index:100}
  body.modul .desktop-nav button:hover{border-color:var(--blau);background:var(--karte)}
  body.modul .desktop-nav button:hover svg{stroke:var(--blau)}
  body.modul .desktop-nav button:disabled{opacity:.45;cursor:default}
  body.modul .desktop-nav button:disabled:hover{border-color:var(--glas-rand)}
  body.modul .desktop-nav button:disabled:hover svg{stroke:var(--titel)}
  body.modul .desktop-nav button svg{width:28px;height:28px;stroke:var(--titel);fill:none;stroke-width:2}
  body.modul .desktop-nav .prev-btn{left:24px}
  body.modul .desktop-nav .next-btn{right:24px}
}
/* Wisch-Hinweis (nur Folie 1) in allen Breiten IN der Knopfleiste (Nachtrag 1, A1): ab 1024 px rechts neben den Punkten (Punkte 8 × 24 + 30 px
   breit, Mitte ± 111 px, dazu 12 px Abstand; bis vor „Weiter“ ≈ 104 px + 20 px Rand), senkrecht mittig in der Knopfzeile (12 px Polster + 22 px);
   bis 1023 px mittig zwischen „Zurück“ und „Weiter“ (unten). Schwebte er über der Leiste, lag er auf „STARTEN“ (SC1b-Vorschau).
   Text je Gerät: Touch „Wische …“, Maus „Pfeiltasten …“ (unten). */
body.modul .swipe-hint{position:fixed;z-index:51;bottom:calc(34px + env(safe-area-inset-bottom,0px));left:calc(50% + 123px);transform:translateY(50%);max-width:min(240px,calc(50% - 255px));color:var(--text-hell);font-size:12px;line-height:1.25;font-weight:500;display:flex;align-items:center;gap:6px;padding:4px 10px;border-radius:9999px;background:rgba(255,253,249,.86);white-space:normal;text-align:left}
body.modul .swipe-hint svg{width:16px;height:16px;stroke:var(--text-hell);fill:none;stroke-width:2}
body.modul .text-center{text-align:center}
body.modul .mb-1{margin-bottom:4px}body.modul .mb-2{margin-bottom:8px}body.modul .mb-3{margin-bottom:12px}body.modul .mb-4{margin-bottom:16px}body.modul .mb-6{margin-bottom:24px}body.modul .mb-8{margin-bottom:32px}body.modul .mt-4{margin-top:16px}
body.modul .gap-1{gap:4px}body.modul .gap-2{gap:8px}body.modul .gap-3{gap:12px}body.modul .gap-4{gap:16px}
body.modul .flex{display:flex}body.modul .flex-col{flex-direction:column}body.modul .items-center{align-items:center}body.modul .items-start{align-items:flex-start}body.modul .justify-center{justify-content:center}
body.modul .text-gray-300{color:var(--text-lauf)}body.modul .text-gray-400,body.modul .text-gray-500,body.modul .text-gray-600{color:var(--text-hell)}body.modul .text-white{color:var(--titel)}body.modul .text-accent{color:var(--blau)}
body.modul .text-sm{font-size:14.5px}body.modul .text-xs{font-size:12.5px}body.modul .text-11{font-size:12px}body.modul .text-13{font-size:13.5px}body.modul .text-15{font-size:15.5px}
body.modul .font-bold{font-weight:700}body.modul .font-semibold{font-weight:700}
body.modul .icon{width:20px;height:20px;display:inline-block;vertical-align:middle}
body.modul .icon-sm{width:14px;height:14px}body.modul .icon-lg{width:24px;height:24px}body.modul .icon-xl{width:28px;height:28px}
body.modul .pillar-item{display:flex;align-items:center;gap:16px;padding:12px;border-radius:12px}
body.modul .pillar-item.active{background:var(--gold-hauch);border:1px solid rgba(232,168,76,.5)}
body.modul .pillar-item:not(.active){border:1px solid transparent}
body.modul .pillar-text{text-align:left}
body.modul .pillar-text h4{font-weight:700;font-size:16px;margin-bottom:2px;color:var(--titel)}
body.modul .pillar-text p{font-size:14px;color:var(--text-hell);margin:0}
body.modul .check-item,body.modul .x-item{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
body.modul .check-item{background:rgba(250,246,236,.92);border:1px solid rgba(232,168,76,.5)}
body.modul .x-item{background:rgba(252,244,241,.92);border:1px solid rgba(180,35,24,.24)}
body.modul .check-item svg{stroke:var(--blau);flex-shrink:0}
body.modul .x-item svg{stroke:#b42318;flex-shrink:0}
body.modul svg[stroke="#f87171"]{stroke:#b42318}
body.modul [style*="#f87171"]{background:#b42318!important}
body.modul .list-item{display:flex;align-items:flex-start;gap:10px}
body.modul .list-dot{width:6px;height:6px;border-radius:50%;background:var(--gold-symbol);margin-top:8px;flex-shrink:0}
body.modul .flow-container{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;padding:16px;background:rgba(239,232,220,.8);border-radius:12px}
body.modul .flow-step{font-size:14px;font-weight:700;color:var(--text)}
body.modul .flow-step.highlight{color:var(--blau)}
body.modul .flow-arrow svg{width:14px;height:14px;stroke:var(--gold-symbol)}
body.modul .tool-card{display:flex;align-items:flex-start;gap:14px;padding:16px}
body.modul .tool-num{font-size:12px;font-weight:700;color:var(--blau);font-variant-numeric:tabular-nums;letter-spacing:.04em}
body.modul .tool-title{font-weight:700;font-size:16px;color:var(--titel)}
body.modul .tool-desc{color:var(--text-lauf);font-size:14px;line-height:1.5;margin:0}
body.modul .exercise-step{display:flex;gap:12px}
body.modul .step-number{width:32px;height:32px;border-radius:50%;background:var(--blau);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}
body.modul .step-time{font-size:12px;color:var(--blau);margin-bottom:4px;font-weight:700}
body.modul .step-text{color:var(--text-lauf);font-size:15px;line-height:1.5;margin:0}
body.modul .section-red,body.modul .section-green{padding:20px;border-radius:16px;-webkit-backdrop-filter:blur(12px) saturate(1.1);backdrop-filter:blur(12px) saturate(1.1);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten)}
body.modul .section-red{background:rgba(252,245,242,.92);border:1px solid rgba(180,35,24,.24)}
body.modul .section-green{background:rgba(250,246,236,.92);border:1px solid rgba(232,168,76,.5)}
body.modul .section-title{font-weight:700;margin-bottom:12px;font-size:13.5px;text-transform:uppercase;letter-spacing:.05em}
body.modul .section-red .section-title{color:#a3261c}
body.modul .section-green .section-title{color:var(--blau)}
body.modul .section-list{display:flex;flex-direction:column;gap:9px}
body.modul .section-list-item{display:flex;align-items:flex-start;gap:10px}
body.modul .section-list-item svg{flex-shrink:0;margin-top:2px;width:17px;height:17px;fill:none;stroke-width:2}
body.modul .section-list-item span{font-size:14.5px;line-height:1.5}
body.modul .section-red .section-list-item span,body.modul .section-green .section-list-item span{color:var(--text-lauf)}
body.modul .src-note{font-size:12px;line-height:1.5;color:var(--text-hell);margin:10px 0 0}
body.modul .safety-note{margin:12px 0 0;padding-left:12px;border-left:2px solid var(--gold-symbol);font-size:13px;line-height:1.55;color:var(--text-lauf)}
body.modul .safety-note strong{color:var(--titel)}
body.modul .safety-note + .safety-note{margin-top:10px}
body.modul .safety-lead{margin:0 0 16px;padding:14px 16px;border-radius:12px;background:rgba(250,246,236,.95);border:1px solid rgba(232,168,76,.55);font-size:14px;line-height:1.6;color:var(--text-lauf)}
body.modul .safety-lead strong{color:var(--blau)}
body.modul .card .card,body.modul .accent-card .card{-webkit-backdrop-filter:none;backdrop-filter:none}
/* Fuß der Module: Band, unter der festen Leiste (Platz für die Leiste unten) */
body.modul .legal-footer{padding:150px 20px calc(132px + env(safe-area-inset-bottom,0px))}  /* Fuß-Links über der unteren Leiste und dem Wischhinweis */
body.modul .legal-footer p{font-size:13.5px;color:#d5dcf0;margin:0}
/* Module am Handy: Lesespalte über die ganze Breite — Schleier gleichmäßig, Glas dichter */
@media (max-width:400px){body.modul .bottom-nav{padding-left:12px;padding-right:12px}body.modul .nav-btn{padding:10px 11px}body.modul .nav-dots{gap:5px;margin:0 6px}}
@media (max-width:700px){
  body.modul .bf-bild::after{background:linear-gradient(180deg,rgba(247,244,238,.62) 0%,rgba(247,244,238,.74) 100%)}
  body.modul .card{background:rgba(255,253,249,.82)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  body.modul .card,body.modul .accent-card,.start .module-card,.start .scan-banner,.scan .question-group,.scan .score-card,.scan .result-text,.scan .intro-feature{background:rgba(255,253,249,.94)}
}

/* ---------- Danke und Willkommen (body.bestaetigung) ---------- */
.bestaetigung{min-height:100vh;display:flex;flex-direction:column;align-items:center;line-height:1.35}
.bestaetigung .bf-bild::after{background:linear-gradient(180deg,rgba(247,244,238,.34) 0%,rgba(247,244,238,.56) 46%,rgba(247,244,238,.72) 100%)}
.bestaetigung .container{position:relative;z-index:10;max-width:480px;width:100%;text-align:center;padding:40px 24px 0;flex:1}
.bestaetigung .logo{margin-bottom:44px;position:relative}
.bestaetigung .logo::before{content:"";position:absolute;inset:-110% -50%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.92) 0%,rgba(255,253,249,.9) 45%,rgba(255,253,249,.78) 60%,rgba(255,253,249,.55) 72%,rgba(255,253,249,.3) 82%,rgba(255,253,249,.11) 90%,rgba(255,253,249,.03) 96%,rgba(255,253,249,0) 100%)}
.bestaetigung .status-icon{width:84px;height:84px;background:rgba(255,253,249,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:2px solid rgba(232,168,76,.7);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 30px;box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten-hoch);animation:sc-atmen 2.6s ease-in-out infinite}
@keyframes sc-atmen{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.bestaetigung .status-icon svg{width:36px;height:36px;stroke:var(--blau);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bestaetigung h1{font-size:clamp(34px,8.6vw,52px);font-weight:700;letter-spacing:-.015em;line-height:1.08;margin-bottom:14px;color:var(--titel)}
.bestaetigung .accent{color:var(--blau)}
.bestaetigung .subtitle{font-size:18px;color:var(--text-lauf);margin-bottom:36px;line-height:1.6}
.bestaetigung h1,.bestaetigung .subtitle{position:relative}  /* Scheine in der Ebene von .container (z-index 10), hinter allem Text */
.bestaetigung h1::before,.bestaetigung .subtitle::before{content:"";position:absolute;inset:-115% -14%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.95) 0%,rgba(255,253,249,.93) 40%,rgba(255,253,249,.84) 54%,rgba(255,253,249,.66) 66%,rgba(255,253,249,.44) 76%,rgba(255,253,249,.25) 84%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.05) 94.5%,rgba(255,253,249,.018) 97.5%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}
.bestaetigung .subtitle::before{inset:-170% -14%}  /* einzeilige Unterzeile (Willkommen): Kasten ≥ 140 px hoch (Kanten-Gate) */
.bestaetigung .card{background:var(--glas-lesen);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten);padding:30px;text-align:left;margin-bottom:28px}
.bestaetigung .card-title{font-size:13px;font-weight:700;color:var(--blau);text-transform:uppercase;letter-spacing:.1em;margin-bottom:18px}
.bestaetigung .step{display:flex;gap:16px;margin-bottom:20px}
.bestaetigung .step:last-child{margin-bottom:0}
.bestaetigung .step-number{width:32px;height:32px;background:var(--blau);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}
.bestaetigung .step-content h3{font-size:17px;font-weight:700;margin-bottom:3px;color:var(--titel)}
.bestaetigung .step-content p{font-size:15px;color:var(--text-lauf);line-height:1.5;margin:0}
.bestaetigung .hint{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 22px;background:rgba(255,253,249,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--r-glas-klein);border:1px solid var(--glas-rand);margin-bottom:28px}
.bestaetigung .hint svg{width:18px;height:18px;stroke:var(--gold-symbol);fill:none;stroke-width:2;flex-shrink:0}
.bestaetigung .hint p{font-size:14px;color:var(--text-hell);margin:0}
.bestaetigung .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:15px 28px;border-radius:var(--r-knopf);font-weight:700;font-size:16px;text-decoration:none;transition:background-color var(--tempo),border-color var(--tempo),color var(--tempo),transform var(--tempo);border:2px solid rgba(0,0,175,.55);background:rgba(255,253,249,.9);color:var(--blau);cursor:pointer}
.bestaetigung .btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;flex:none}
.bestaetigung .card-text{font-size:16px;color:var(--text-lauf);line-height:1.7;margin:0}
.bestaetigung .card-text strong{color:var(--titel)}
.bestaetigung .card:not(.card-info){background:linear-gradient(135deg,rgba(255,246,228,.9) 0%,rgba(255,253,249,.84) 100%);border-color:rgba(232,168,76,.55)}
.bestaetigung .card-info .card-title{color:var(--titel)}
.bestaetigung .divider{display:flex;align-items:center;gap:16px;margin:-32px 0 -12px;color:var(--text-hell);font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:46px 0;background:radial-gradient(closest-side,rgba(255,253,249,.95) 0%,rgba(255,253,249,.93) 40%,rgba(255,253,249,.84) 54%,rgba(255,253,249,.66) 66%,rgba(255,253,249,.44) 76%,rgba(255,253,249,.25) 84%,rgba(255,253,249,.12) 90%,rgba(255,253,249,.05) 94.5%,rgba(255,253,249,.018) 97.5%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}  /* Kasten um 46 px gepolstert, Außenabstände gleichen aus (Lage wie zuvor: Text 14 px unter dem Kasten davor, 34 px über dem Kasten danach) — wie der Trenner auf raav.io */
.bestaetigung .divider::before,.bestaetigung .divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.bestaetigung .divider::after{background:linear-gradient(90deg,var(--gold),transparent)}
.bestaetigung .btn-note{font-size:14px;color:var(--text-hell);line-height:1.5;margin:2px 0 0;padding:4px 10px;border-radius:8px;background:rgba(255,253,249,.82)}
.bestaetigung .buttons{display:flex;flex-direction:column;gap:12px}
.bestaetigung .btn-primary{background:var(--blau);border-color:var(--blau);color:#fff;box-shadow:var(--knopf-schatten)}
.bestaetigung .social-proof{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:36px;padding-top:28px;border-top:1px solid rgba(146,93,19,.25)}
.bestaetigung .social-proof p{font-size:14px;color:var(--text-hell);margin:0;padding:4px 10px;border-radius:8px;background:rgba(255,253,249,.82)}
@media (hover:hover) and (pointer:fine){
  .bestaetigung .btn:hover{border-color:var(--blau);background:var(--karte)}
  .bestaetigung .btn-primary:hover{background:var(--blau-hover);border-color:var(--blau-hover);transform:translateY(-2px)}
}
.bestaetigung .confetti{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden;z-index:5}
.bestaetigung .confetti-piece{position:absolute;width:9px;height:9px;border-radius:2px;background:var(--gold);opacity:0;animation:confetti-fall 3s ease-out forwards}
@keyframes confetti-fall{0%{opacity:1;transform:translateY(-100px) rotate(0deg)}100%{opacity:0;transform:translateY(100vh) rotate(720deg)}}
.willkommen-seite .status-icon{width:96px;height:96px;border-color:var(--gold-symbol);animation:success-pop .5s ease-out}
@keyframes success-pop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.2)}100%{transform:scale(1);opacity:1}}
.willkommen-seite .status-icon svg{width:46px;height:46px;stroke-width:2.5;animation:check-draw .5s ease-out .3s forwards;stroke-dasharray:100;stroke-dashoffset:100}
@keyframes check-draw{to{stroke-dashoffset:0}}
.willkommen-seite h1{font-size:clamp(36px,10vw,58px)}
.bestaetigung .band-fuss{font-size:13.5px;margin-top:36px}
@media (prefers-reduced-motion:reduce){
  .bestaetigung .confetti{display:none}
  .bestaetigung .status-icon,.bestaetigung .status-icon svg{animation:none}
  .willkommen-seite .status-icon svg{stroke-dashoffset:0}
}

/* ---------- Quellen (body.quellen): Bild im Kopf läuft innerhalb der Leseglas-Karte aus (Regel 4) ---------- */
.quellen{min-height:100vh;display:flex;flex-direction:column;line-height:1.6;--karte-l:max(16px,calc(50% - 380px));--kopf-frei:40px}
.quellen .container{position:relative;z-index:10;max-width:760px;width:calc(100% - 32px);margin:24px auto 0;padding:28px 22px 40px;background:var(--glas-lesen);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.quellen .container,.bestaetigung .card{background:rgba(255,253,249,.95)}}
.quellen .logo{margin-bottom:40px}
.quellen h1{font-size:clamp(34px,8vw,50px);font-weight:700;letter-spacing:-.015em;line-height:1.1;margin-bottom:18px;color:var(--titel)}
.quellen .accent{color:var(--gold-symbol)}
.quellen .intro{font-size:16.5px;color:var(--text);line-height:1.7;margin-bottom:12px}
.quellen .intro-note{font-size:15px;color:var(--text-lauf);line-height:1.7;margin-bottom:44px}
.quellen .modul{margin-bottom:42px}
.quellen .modul-title{font-size:13.5px;font-weight:700;color:var(--blau);text-transform:uppercase;letter-spacing:.12em;padding-bottom:10px;margin-bottom:18px;border-bottom:1px solid rgba(227,221,210,.95);position:relative}
.quellen .modul-title::after{content:"";position:absolute;left:0;bottom:-1px;width:56px;height:2px;background:var(--gold)}
.quellen .modul-lead{font-size:15px;color:var(--text-lauf);margin-bottom:18px}
.quellen .quelle{padding:18px 0;border-bottom:1px solid rgba(227,221,210,.9)}
.quellen .quelle:last-child{border-bottom:none}
.quellen .quelle-autor{font-size:16px;font-weight:700;color:var(--titel);margin-bottom:3px}
.quellen .quelle-titel{font-size:16px;color:var(--text-lauf);margin-bottom:6px}  /* kein Kursiv (s. Merksätze der Module) */
.quellen .quelle-meta{font-size:14px;color:var(--text-lauf);margin-bottom:8px}
.quellen .quelle-typ{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--blau);background:rgba(255,253,249,.9);border:1px solid rgba(232,168,76,.6);border-radius:9999px;padding:3px 10px;margin:0 8px 4px 0}
.quellen .quelle-pop{font-size:14px;color:var(--text-lauf)}
.quellen .quelle a{color:var(--blau);font-size:14px;word-break:break-word}
.quellen .quelle-luecke{font-size:14px;color:var(--text-lauf);border-left:2px solid var(--gold-symbol);padding-left:12px;margin-top:8px}
.quellen .band-fuss{margin-top:48px;font-size:13.5px}
.quellen .footer-stand{display:block;margin-top:6px;font-size:12.5px;color:#d5dcf0}
@media (min-width:768px){.quellen{--karte-l:max(32px,calc(50% - 380px));--kopf-frei:56px}.quellen .container{margin-top:48px;padding:40px 44px 48px;width:calc(100% - 64px)}}

/* ---------- Weiterleitungen Impressum/Datenschutz (body.umzug): flacher Grund, kein Bild (die Seite leitet sofort weiter) ---------- */
.umzug{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;line-height:1.7}
.umzug .box{max-width:460px;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-kachel);box-shadow:var(--schatten-karte);padding:28px 26px}
.umzug .box p{color:var(--text-lauf);margin-bottom:12px}
.umzug .box p[style]{color:var(--text-hell)!important}
.umzug .box .lead{color:var(--titel);font-size:19px;font-weight:700}

/* ---------- Bewegung reduzieren: Partikel, Parallaxe, Einblendungen, Puls still ---------- */
@media (prefers-reduced-motion:reduce){
  .fx-pt{animation:none!important;opacity:0}
  .start .hero-badge-dot{animation:none}
  .scan .slide,body.modul .slide.active{animation:none}
}

@media print{
  .fx-back,.licht,.rv-bild,.bildfenster,.bottom-nav,.desktop-nav,.swipe-hint{display:none!important}
  body{background:#fff;color:#000}
  .band-fuss,.scan .footer{background:#fff!important;color:#000!important;padding-top:24px!important;margin-top:0!important}
  .band-fuss a,.band-fuss p,.band-fuss span,.scan .footer *{color:#000!important}
  .band-zeichen{display:none!important}
}

/* ==================== Stufe SC1b ==================== */

/* ---------- Marke (Farbwelt 2.4, _Design/marke/MARKE.md): Schriftzug quer im Kopf, Kugel 40 px am Desktop, 34 px am Handy
   (die Kugel ist 0,949 × Bildhöhe: 42 px → 40, 36 px → 34). Gilt auf allen Seiten, auch im Scan; bei 360 px geprüft: kopf_360.mjs ---------- */
.logo-marke{display:block;height:42px;width:auto;max-width:none}
@media (max-width:700px){.logo-marke{height:36px}}
.bestaetigung .logo .logo-marke,.quellen .logo .logo-marke{height:42px}
/* Fuß-Band: weiße Bildmarke (ausgestanzt) statt des R-Quadrats */
.band-zeichen{height:48px}
.band-zeichen::before{content:"";width:48px;height:48px;border-radius:0;background:url("/assets/marke/raav-bildmarke_weiss.svg") center/contain no-repeat;box-shadow:none;color:transparent}

/* ---------- Bildfenster (Muster academy A2): das Foto steht (position:sticky, vom Compositor gezeichnet), der Inhalt gleitet darüber.
   Markup: .bildfenster > .bf-bahn > .bf-bild > picture > img. Die Bahn reicht eine Bildschirmhöhe über und unter den Abschnitt hinaus,
   darin klebt das Bild (eine Bildschirmhöhe hoch) am oberen Rand; das Fenster schneidet per overflow:clip und Maske zu: oben und unten
   je min(220px, 26 %) weicher Auslauf in Leinen — nie eine harte Kante. Der Kopf (.kopf) läuft nur unten aus. Bis 1024 px läuft das Bild
   mit halber Geschwindigkeit mit (assets/raav-scan.js setzt --bf-d, höchstens ±12 % der Fensterhöhe); bei „Bewegung reduzieren“ steht es still. ---------- */
.bildfenster{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden;overflow:clip;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 min(220px,26%),#000 calc(100% - min(220px,26%)),transparent 100%);mask-image:linear-gradient(180deg,transparent 0,#000 min(220px,26%),#000 calc(100% - min(220px,26%)),transparent 100%)}
.bildfenster.kopf{-webkit-mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - min(220px,26%)),transparent 100%);mask-image:linear-gradient(180deg,#000 0,#000 calc(100% - min(220px,26%)),transparent 100%)}
.bf-bahn{position:absolute;left:0;right:0;top:-100vh;bottom:-100vh;top:-100lvh;bottom:-100lvh}
.bf-bild{position:-webkit-sticky;position:sticky;top:0;height:100vh;height:100lvh;overflow:hidden}
.bf-bild picture{display:contents}
.bf-bild img{position:absolute;left:0;top:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 50%;transform:translate3d(0,var(--bf-d,0px),0)}
.bf-bild::after{content:"";position:absolute;inset:0}
@media (max-width:1024px){.bf-bild img{top:-12%;height:124%;will-change:transform}}
/* Bildausschnitte je Motiv (Desktop / Handy) */
.bf-bild img[src*="koerper-ruhe"]{object-position:50% 64%}
.bf-bild img[src*="haende-brustkorb"]{object-position:50% 50%}   /* SC1c: Hände am seitlichen Brustkorb statt Skelett; SC1d: Tiefen-Fassung -t, neuer Ausschnitt */
/* SC1d (Breath, Probe-NEIN des Masters): Hände und Rippenbogen sollen erkennbar sein — nur hier ein leichterer Schleier (.bf-leicht am Bildfenster):
   am Rand .26 statt .5, in der Lesespalte .76 statt .8; am Handy .46–.6 statt .62–.74. Kontrast der Schrift am Foto gemessen (Gate). */
body.modul .bildfenster.bf-leicht .bf-bild::after{background:linear-gradient(90deg,rgba(247,244,238,.26) 0%,rgba(247,244,238,.76) 50%,rgba(247,244,238,.26) 100%),linear-gradient(180deg,rgba(247,244,238,.16) 0%,rgba(247,244,238,.34) 100%)}
@media (max-width:700px){body.modul .bildfenster.bf-leicht .bf-bild::after{background:linear-gradient(180deg,rgba(247,244,238,.46) 0%,rgba(247,244,238,.6) 100%)}}
/* SC1d, Kontrast-Gate: Text, der auf Breath ohne Karte direkt auf dem Foto steht (Unterzeile Folie 1, Einleitung Folie 7), lag mit dem leichteren
   Schleier am Handy bei 3,6–4,1 : 1. Nach der Order wird der Grund hinter dem Text dichter, nicht das Bild blasser: ein warmweißer Schein
   (Farbwelt Regel 12 — closest-side, läuft innerhalb seines Kastens auf 0 aus; seitlich nur bis an den Rand der Folie, die abschneidet). */
body.modul>.bildfenster.bf-leicht~main .slide>p,body.modul>.bildfenster.bf-leicht~main .slide>.text-center>p{position:relative}
body.modul>.bildfenster.bf-leicht~main .slide>p::before,body.modul>.bildfenster.bf-leicht~main .slide>.text-center>p::before{content:"";position:absolute;inset:-55% -20px;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(255,253,249,.72) 0%,rgba(255,253,249,.7) 45%,rgba(255,253,249,.6) 60%,rgba(255,253,249,.42) 72%,rgba(255,253,249,.24) 82%,rgba(255,253,249,.09) 90%,rgba(255,253,249,.02) 96%,rgba(255,253,249,.005) 99%,rgba(255,253,249,0) 100%)}
/* Tablet (701–1023 px): dort reicht der Schein an den Zeilenenden der breiten Unterzeile nicht ganz (4,44 : 1) — Zweittext wie am Handy (SC1b) in --text-lauf */
@media (min-width:701px) and (max-width:1023px){body.modul>.bildfenster.bf-leicht~main .text-gray-400,body.modul>.bildfenster.bf-leicht~main .text-gray-500,body.modul>.bildfenster.bf-leicht~main .text-gray-600{color:var(--text-lauf)}}
.bf-bild img[src*="haende-becken-hoch"]{object-position:50% 42%}
.bf-bild img[src*="haende-bauch-flach"]{object-position:50% 45%}
.bf-bild img[src*="haende-halt"]{object-position:55% 50%}
.bf-bild img[src*="hand-bauch-nah"]{object-position:40% 55%}
.bf-bild img[src*="praxis-raum"]{object-position:60% 60%}
@media (max-width:700px){
  .bf-bild img[src*="koerper-ruhe"]{object-position:30% 70%}
  .bf-bild img[src*="haende-becken-hoch"],.bf-bild img[src*="haende-bauch-flach"],.bf-bild img[src*="haende-halt"],.bf-bild img[src*="hand-bauch-nah"]{object-position:50% 50%}
}

/* Scan-Titel am Handy: Schein höher (hinter dem Titel liegt das dunklere Skelett -t; Kanten-Gate ≤ 3/255) */
@media (max-width:700px){.scan .intro-title::before{inset:-135% -30%}}

/* ---------- Startseite (SC1c Teil A: ein Blick wie raav.io): Überschrift · Scan-Kasten · vier Module · Hinweis in EINEM Abschnitt über der Säule;
   die „Körper in Ruhe“-Strecke und das Bone-Band sind entfallen. Das Bildfenster hängt am body und läuft unter dem Fuß-Band aus. ---------- */
.start>.bildfenster{z-index:-1}
.start .fx-back{position:absolute;top:0;left:0;right:0;height:100vh;height:100lvh}
.start .abschnitt-kopf .container{margin:0 auto}
.start .scan-banner{margin-bottom:14px}
.start .module-grid{margin-bottom:14px;gap:12px}
/* Fuß: das Band beginnt unter dem Hinweis und liegt HINTER dem Inhalt (wie raav.io) — am Laptop ist sein Ansatz im ersten Bildschirm zu sehen */
.start .band-fuss{z-index:0;margin-top:-120px;padding-top:150px}
@media (min-width:960px){.start .module-grid{grid-template-columns:repeat(4,1fr)}}
@media (min-width:1024px) and (max-width:1199px){.start .module-grid{grid-template-columns:1fr 1fr}}
/* Laptop: vier Karten in einer Zeile, dichter gesetzt (Inhalt, Reihenfolge, Farben gleich) */
@media (min-width:960px){
  .start .module-card{padding:18px 16px;gap:10px}
  .start .module-card .icon-box{width:40px;height:40px}
  .start .module-card .icon-box svg{width:20px;height:20px}
  .start .module-content h2{font-size:18px;margin-bottom:4px}
  .start .module-content p{font-size:13.5px;line-height:1.45}
  .start .scan-banner{padding:18px 22px}
}
@media (min-width:1024px){
  .start .abschnitt-kopf .container{margin:0}   /* bündig unter dem Schriftzug im Kopf (vorher mittig in der Spalte, bis 84 px versetzt) */
  .start .band-zeichen{position:relative;left:auto;bottom:auto;width:100%;height:52px}
  .start .band-zeichen::before{left:50%;transform:translateX(-50%);width:52px;height:52px}
}

/* ---------- Module, Danke/Willkommen, Quellen: ein Bildfenster für die ganze Seite (Kopf) ---------- */
body.modul>.bildfenster,.bestaetigung>.bildfenster,.quellen>.bildfenster{z-index:-1}
.quellen .bf-bild::after{background:linear-gradient(180deg,rgba(247,244,238,.34) 0%,rgba(247,244,238,.5) 100%)}

/* ---------- Scan-Ergebnis: „Wie es weitergehen kann“ (Teil F) — Glas über dem Bild, Karten in Bone, Knopf als Rahmen ---------- */
.scan .weiter-section{position:relative;overflow:hidden;margin-top:22px;padding:24px 20px 20px;background:rgba(255,253,249,.88);-webkit-backdrop-filter:blur(var(--glas-blur)) saturate(1.15);backdrop-filter:blur(var(--glas-blur)) saturate(1.15);border:1px solid var(--glas-rand);border-radius:var(--r-glas);box-shadow:inset 0 1px 0 var(--glas-licht),var(--glas-schatten)}
.scan .weiter-section::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent)}
.scan .weiter-title{font-size:19px;font-weight:700;color:var(--titel);text-align:center;margin-bottom:14px}
.scan .weiter-karten{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:560px){.scan .weiter-karten{grid-template-columns:1fr 1fr}.scan .weiter-karte:nth-child(3){grid-column:1/-1}}
.scan .weiter-karte{display:flex;flex-direction:column;gap:8px;padding:18px;background:rgba(239,232,220,.9);border-radius:var(--r-glas-klein);box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
.scan .weiter-karte-titel{font-size:16.5px;font-weight:700;color:var(--titel);line-height:1.3}
.scan .weiter-karte-text{font-size:14.5px;color:var(--text-lauf);line-height:1.55;margin-bottom:4px}
.scan .weiter-knopf{margin-top:auto;width:100%;min-height:46px;padding:11px 18px;font-size:15px;background:rgba(255,253,249,.95)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.scan .weiter-section{background:rgba(255,253,249,.95)}}

/* ---------- Radar im Ergebnis: Glas als Kachel statt Kreis. Die Beschriftungen links und rechts (Breath, Soma, Energie, Umfeld) stehen in den
   Ecken des Diagramms; der Glas-Kreis ließ sie auf dem Foto stehen — über dem mittigen Skelett nur 3,6 : 1 (Kontrast-Gate). Auf der Kachel liegen alle sechs auf Glas. ---------- */
.scan .radar-container{border-radius:var(--r-glas)}

/* ---------- PDF-Knopf: kurze Ladeanzeige, solange jsPDF beim ersten Klick nachlädt (Teil E1) ---------- */
.scan .btn-pdf.laedt{cursor:progress;opacity:.9}
.scan .btn-pdf.laedt::after{content:"";width:16px;height:16px;flex:none;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sc-dreh .8s linear infinite}
@keyframes sc-dreh{to{transform:rotate(360deg)}}

/* ---------- 404 (Teil E5): flache Kachel auf Leinen (kein Bild → kein Glas), Fuß als Band ---------- */
.fehlerseite{min-height:100vh;display:flex;flex-direction:column;line-height:1.5}
.fehlerseite main{flex:1;display:flex;align-items:center;justify-content:center;padding:48px 20px 64px}
.fehler-box{width:100%;max-width:520px;text-align:center;background:var(--karte);border:1px solid var(--linie);border-radius:var(--r-kachel);box-shadow:var(--schatten-karte);padding:36px 28px 32px}
.fehler-box .logo{display:inline-block;margin-bottom:28px}
.fehler-code{font-size:14px;font-weight:700;letter-spacing:.14em;color:var(--gold-tinte);margin-bottom:8px}
.fehler-box h1{font-size:clamp(26px,6vw,34px);font-weight:700;color:var(--titel);margin-bottom:10px;line-height:1.15}
.fehler-box p{color:var(--text-lauf);font-size:16px;margin-bottom:24px}
.fehlerseite .band-fuss{margin-top:0}

/* ---------- LCP (Teil E3): Die Startansicht (Folie 0 der Module, Einstieg des Scans) blendet beim Laden nicht ein. Mit `sc-ein` (0,4 s ab
   Deckkraft 0) zählte Chrome den Titel erst nach der Einblendung: Handy-LCP 1 888 ms statt ≈ 1 490 ms. Folienwechsel blenden weiter ein. ---------- */
body.modul .slide.active[data-slide="0"],.scan .slide[data-slide="1"]{animation:none}   /* SC1c Teil D: Startansicht des Scans ist Frage 1 */

/* ---------- Bewegung reduziert: Bildfenster stehen still (kein Mitlaufen), Ladeanzeige ohne Drehung ---------- */
@media (prefers-reduced-motion:reduce){
  .bf-bild img{transform:none!important}
  .scan .btn-pdf.laedt::after{animation:none;border-right-color:currentColor;opacity:.5}
}

/* ---------- Barrierefreiheit (Teil E7, Lighthouse): Überschriften ohne Sprung (Tags geändert, Aussehen gleich), Folien-Punkte als 24-px-Tippflächen ---------- */
.start .scan-banner-text h2{font-size:16px;font-weight:700;color:var(--titel);margin-bottom:3px;line-height:1.3}
body.modul .pillar-text h2{font-size:16px;font-weight:700;margin:0 0 2px;color:var(--titel);text-align:left;letter-spacing:0;line-height:1.3}
.bestaetigung .step-content h2{font-size:17px;font-weight:700;margin-bottom:3px;color:var(--titel);line-height:1.3}
body.modul .nav-dots{gap:0}
body.modul .nav-dot{width:24px;height:24px;border-radius:12px;background:transparent}
body.modul .nav-dot::after{content:none}
body.modul .nav-dot::before{content:"";position:absolute;left:50%;top:50%;width:8px;height:8px;border-radius:4px;background:rgba(0,32,88,.28);transform:translate(-50%,-50%);transition:width .3s ease,background-color .3s ease}
body.modul .nav-dot.active{width:30px;background:transparent}
body.modul .nav-dot.active::before{width:24px;background:var(--blau)}
/* Module am Handy: Zweittext (text-gray-400/500/600) in --text-lauf statt --text-hell. Über den dunkleren Handy-Motiven (Breath: Brustkorb,
   Nutri: Hände am Becken) lag er sonst bei 3,97–4,30 : 1 (Kontrast-Gate, SC1b); so ≥ 5 : 1, das Foto bleibt unverändert. */
@media (max-width:700px){body.modul .text-gray-400,body.modul .text-gray-500,body.modul .text-gray-600{color:var(--text-lauf)}}
/* Bis 1023 px (Nachtrag 1: vorher bis 560 px): Punkte in eigener Zeile über den Knöpfen (8 + 24 + 6 + 44 + 12 + 1 = 95 px), der Wisch-Hinweis
   mittig in der Knopfzeile zwischen „Zurück“ und „Weiter“ — bis 560 px zweizeilig in 140 px (dort ist ≥ 146 px Platz bei 360), darüber einzeilig.
   Ab 1024 px eine Zeile [Zurück · Punkte · Weiter], Hinweis neben den Punkten (oben). */
@media (max-width:1023px){
  body.modul{--leiste-h:95px}
  body.modul .bottom-nav{flex-wrap:wrap;row-gap:6px;padding-top:8px}
  body.modul .nav-dots{order:-1;width:100%;justify-content:center;margin:0}
  body.modul .swipe-hint{left:50%;transform:translate(-50%,50%);max-width:260px;text-align:center}
  body.modul .legal-footer{padding-bottom:calc(158px + env(safe-area-inset-bottom,0px))}
}
@media (max-width:560px){body.modul .swipe-hint{max-width:140px}}
@media (max-width:700px){body.modul{--kopf-h:61px}}   /* Schriftzug 36 statt 42 px hoch (Kopf gemessen 61 statt 67 px) */

/* ---------- Nachtrag 1 (A1): Wortlaut des Wisch-Hinweises je Gerät — ohne Touch (Maus, Trackpad) gibt es kein Wischen ---------- */
body.modul .hinweis-maus{display:none}
@media (hover:hover) and (pointer:fine){body.modul .hinweis-touch{display:none}body.modul .hinweis-maus{display:inline}}

/* ---------- Nachtrag 1 (C2): Diagnose-Hinweis im Fuß der Module — klein, wie im Scan (.scan .footer-text) ---------- */
body.modul .legal-footer .fuss-hinweis{font-size:12.5px;line-height:1.5;color:#d5dcf0;margin:0 0 6px}

/* ---------- Nachtrag 1 (A3, Hauptknopf der Startansicht): Folie 1 der Module dichter am Handy und in niedrigen Fenstern, damit STARTEN ohne
   Scrollen ganz im Folienfenster steht (390×844, 1280×720). Nur Abstände, Titelgröße und Zeilenhöhe; Inhalt, Reihenfolge, Farben unverändert.
   Die Einleitung trägt font-size im style-Attribut (18 px) — deshalb !important. ---------- */
@media (max-width:700px),(max-height:800px){
  body.modul .slide[data-slide="0"] .mb-6{margin-bottom:14px}
  body.modul .slide[data-slide="0"] h1{font-size:clamp(34px,10vw,56px);margin-bottom:12px}
  body.modul .slide[data-slide="0"] h1 + p{font-size:16px!important;line-height:1.55;margin-bottom:20px}
  body.modul .slide[data-slide="0"] .card{padding:16px;margin-bottom:20px}
  body.modul .slide[data-slide="0"] .card .gap-4{gap:8px}
  body.modul .slide[data-slide="0"] .pillar-item{padding:8px 12px}
  body.modul .slide[data-slide="0"] .icon-box{width:40px;height:40px}
}
/* Kleine Handys (≤ 700 px hoch, z. B. 360×640): noch eine Stufe dichter — Folienfenster dort 61–545 px, STARTEN sonst ≈ 47 px darunter. */
@media (max-width:700px) and (max-height:700px){
  body.modul .slide.active[data-slide="0"]{padding-top:8px}
  body.modul .slide[data-slide="0"] .mb-6{margin-bottom:10px}
  body.modul .slide[data-slide="0"] h1{font-size:30px;margin-bottom:10px}
  body.modul .slide[data-slide="0"] h1 + p{font-size:15px!important;line-height:1.5;margin-bottom:14px}
  body.modul .slide[data-slide="0"] .card{padding:12px;margin-bottom:14px}
  body.modul .slide[data-slide="0"] .card .gap-4{gap:6px}
  body.modul .slide[data-slide="0"] .pillar-item{padding:6px 10px}
  body.modul .slide[data-slide="0"] .pillar-text p{line-height:1.4}
}

/* ---------- SC1c Nachtrag 1 (Teil D): Der Scan beginnt mit Frage 1 — die Zwischenseite ist entfallen (ihre Regeln .intro-* sind seitdem ungenutzt).
   Über Frage 1 eine Zeile mit der Dauer (Wortlaut aus dem Einstieg); der Diagnose-Hinweis steht wie bisher im Fuß unter dem Scan-Fenster.
   Die Überschrift „Dein System-Scan“ bleibt für Vorleser und Suche (unsichtbar). ---------- */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.scan .scan-dauer{display:flex;align-items:center;justify-content:center;gap:7px;margin:0 0 10px;font-size:13.5px;font-weight:500;color:var(--text-lauf);line-height:1.3}
.scan .scan-dauer svg{width:16px;height:16px;flex:none;stroke:var(--gold-symbol);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* Frage 1 ist die Startansicht: in niedrigen Laptop-Fenstern (≤ 800 px Höhe) stehen Antworten und „Weiter“ ohne Scrollen ganz im Scan-Fenster
   (Gate „frei“, 1280×720). Nur Abstände, in allen fünf Schritten gleich (nichts springt beim Weiterklicken); die Regler-Tippfläche (44 px) bleibt. */
@media (min-width:701px) and (max-height:800px){
  .scan .main{padding-top:14px}
  .scan .section-header{margin-bottom:12px}
  .scan .scan-dauer{margin-bottom:6px}
  .scan .question-group{padding:16px 20px}
  .scan .question-item{margin-bottom:12px}
  .scan .question-text{margin-bottom:8px}
  .scan .slider-labels{margin-bottom:2px}
  .scan .slider-value{margin-top:0}
  .scan .btn-row{margin-top:14px}
}
