/*
 * Photo&You Verkaufsseite, neue Fassung (Mandy, 24.10.2026): "Licht ins Fotobusiness".
 * Dunkles Waldgruen als Buehne, warmes Licht fuehrt. Regeln: Text nie per transform bewegen,
 * nichts kippen oder drehen. Grundzustand ist immer der fertige Zustand, Bewegung kommt nur obendrauf
 * (Scroll-Animationen nur, wo der Browser sie kann, und nie bei "Bewegung reduzieren").
 */
:root{
  --nacht:#101813; --wald:#17241C; --wald-2:#203127; --moos:#5E7564; --salbei:#A9BFAE;
  --creme:#F3ECE1; --creme-2:rgba(243,236,225,.74); --creme-3:rgba(243,236,225,.5);
  --licht:#EBCB96; --licht-2:#C99A5B;
  --papier:#F4EEE5; --tinte:#1F2A23; --tinte-2:#56625A; --tinte-3:#8A928A; --linie:#E2D9CB;
  --kopf:'Libre Caslon Display',Georgia,serif;
  --text:'Libre Franklin',-apple-system,'Segoe UI',system-ui,sans-serif;
  --weich:cubic-bezier(.22,.8,.26,1);
  --breite:1180px;
  --rand:max(24px,calc((100vw - var(--breite)) / 2));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-family:var(--text);font-size:17px;line-height:1.6;color:var(--creme);background:var(--nacht);
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3{font-family:var(--kopf);font-weight:400;line-height:1.04;margin:0;letter-spacing:-.005em}
h2{font-size:clamp(38px,5.4vw,72px)}
h2 em,h1 em{font-style:italic;color:var(--licht)}
img{max-width:100%;display:block}
a{color:inherit}
section{position:relative}
.vorzeile{font-size:12.5px;letter-spacing:.24em;text-transform:uppercase;font-weight:500;color:var(--licht);margin:0 0 18px}
.einleitung{font-size:19px;color:var(--tinte-2);max-width:36em;margin:20px 0 0}
.klein-hinweis{font-size:14px;color:var(--creme-3);margin:16px 0 0}

/* Wortmarke wie im Programm */
.wortmarke{font-family:var(--kopf);font-weight:400;text-transform:uppercase;letter-spacing:.08em;font-size:21px;display:inline-flex;align-items:center;white-space:nowrap}
.wortmarke .und{font-family:'Parisienne',cursive;text-transform:none;letter-spacing:0;color:var(--licht);font-size:1.55em;line-height:.6;margin:0 .05em;position:relative;top:.06em}

/* Kopf: immer gleich, haengt an keinem Scroll-Ereignis */
.kopf{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:12px var(--rand);background:rgba(16,24,19,.62);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);
  border-bottom:1px solid rgba(243,236,225,.08)}
.marke{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--creme)}
.zeichen{border-radius:10px;box-shadow:0 6px 16px -6px rgba(0,0,0,.6)}
.kopf nav{display:flex;align-items:center;gap:26px}
.kopf nav a{text-decoration:none;color:var(--creme-2);font-size:15px;transition:color .25s}
.kopf nav a:hover{color:var(--creme)}

/* Knoepfe */
.knopf{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 26px;border-radius:999px;font-size:16px;font-weight:500;
  text-decoration:none;color:var(--creme);transition:box-shadow .35s var(--weich),background-color .35s}
.knopf.haupt{color:#18211B;background:linear-gradient(135deg,#F4DFB8,var(--licht) 45%,var(--licht-2));
  box-shadow:0 14px 34px -12px rgba(233,190,120,.65),inset 0 1px 0 rgba(255,255,255,.5)}
.knopf.haupt:hover{box-shadow:0 18px 44px -10px rgba(233,190,120,.9),inset 0 1px 0 rgba(255,255,255,.6)}
.knopf.glas{background:rgba(243,236,225,.08);box-shadow:inset 0 0 0 1px rgba(243,236,225,.28)}
.knopf.glas:hover{background:rgba(243,236,225,.16)}
.kopf nav .knopf.klein{padding:9px 18px;font-size:14.5px;color:#18211B;background:var(--licht)}
.knopf.breit{width:100%}
.herz-knopf .herz{width:19px;height:19px;fill:rgba(24,33,27,.12);stroke:currentColor;stroke-width:1.8;transition:fill .2s}
.herz-knopf:hover .herz{fill:rgba(231,165,149,.6)}
.herz-knopf.geklickt .herz{fill:#E7A595;animation:herzpop .55s cubic-bezier(.2,1.6,.4,1)}
@keyframes herzpop{0%{transform:scale(1)}35%{transform:scale(1.7)}100%{transform:scale(1.15)}}
.funke{position:fixed;z-index:100;width:14px;height:14px;margin:-7px 0 0 -7px;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23E7A595' d='M12 21s-7.5-4.6-9.6-9.2C.9 8.4 3 4.5 6.7 4.5c2.1 0 3.6 1.2 4.3 2.4.7-1.2 2.2-2.4 4.3-2.4 3.7 0 5.8 3.9 4.3 7.3C19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E") center/contain no-repeat;
  animation:funkeflug .85s cubic-bezier(.15,.7,.3,1) forwards}
@keyframes funkeflug{0%{transform:translate(0,0) scale(.2);opacity:1}70%{opacity:1}100%{transform:translate(var(--x),var(--y)) scale(var(--s));opacity:0}}

/* Bilder als Platzhalter fuer die Runway-Clips */
.clip{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background-size:cover;background-position:center}
.bild-arbeitsplatz{background-image:url(/bilder/arbeitsplatz-1600.jpg)}
.bild-duene{background-image:url(/bilder/duene-1600.jpg)}
.bild-wald{background:linear-gradient(160deg,#C9B27E,#5E7564 55%,#22342A)}
/* langsamer Lichtstreifen ueber dem Bild */
.lichtfahrt{position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;
  background:linear-gradient(105deg,transparent 30%,rgba(255,226,170,.75) 46%,transparent 62%) 0 0/250% 100%}

/* 1 Auftakt */
.auftakt{min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;padding:120px var(--rand) 90px;isolation:isolate}
.auftakt .clip{z-index:-3}
.auftakt .lichtfahrt{z-index:-2}
.abdunkler{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,rgba(16,24,19,.78),rgba(16,24,19,.25) 70%),linear-gradient(0deg,rgba(16,24,19,.95),transparent 55%)}
.auftakt-inhalt{max-width:760px;position:relative}
.auftakt h1{font-size:clamp(50px,8vw,118px);text-wrap:balance}
.unterzeile{font-size:clamp(17px,1.6vw,20px);color:var(--creme-2);margin:26px 0 0;max-width:34em}
.versprechen{display:flex;align-items:center;gap:10px;font-weight:500;color:var(--creme);margin:18px 0 32px}
.versprechen svg{width:22px;height:22px;flex:none;fill:none;stroke:var(--licht);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.knoepfe{display:flex;flex-wrap:wrap;gap:14px}
.plaketten{position:absolute;right:var(--rand);bottom:110px;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.plakette{padding:12px 18px;border-radius:16px;font-size:14.5px;color:var(--creme);background:rgba(23,36,28,.55);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1px rgba(243,236,225,.14),0 20px 40px -20px rgba(0,0,0,.7)}
.plakette b{font-family:var(--kopf);font-weight:400;font-size:22px;color:var(--licht);margin-right:4px}
.weiter{position:absolute;left:50%;bottom:26px;width:26px;height:42px;margin-left:-13px;border-radius:14px;box-shadow:inset 0 0 0 1.5px var(--creme-3)}
.weiter span{position:absolute;left:50%;top:9px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--licht)}

/* 2 Vorher und Nachher: ruhig nebeneinander, nichts bewegt sich */
.chaos{background:var(--papier);color:var(--tinte);padding:130px var(--rand) 40px}
.vn{display:grid;grid-template-columns:1fr 64px 1fr;align-items:center;max-width:var(--breite);margin:0 auto}
.vn-titel{font-size:clamp(28px,3vw,42px);margin:0 0 26px;color:var(--tinte)}
.vn-titel em{font-style:italic;color:var(--tinte-2)}
.vn-titel.nachher em{color:var(--moos)}
.zettelfeld{position:relative;height:440px}
.roh{position:absolute;width:190px;padding:14px 16px;font-size:14px;line-height:1.35;color:var(--tinte);background:#fff;border-radius:6px;
  box-shadow:0 1px 2px rgba(31,42,35,.1),0 16px 30px -14px rgba(31,42,35,.45)}
.roh small{display:block;font-size:11.5px;color:var(--tinte-3)}
.roh b{display:block;font-family:var(--kopf);font-weight:400;font-size:28px;line-height:1.1;margin:4px 0}
.roh.beleg{left:0;top:2%;background:#FDFCF8;border-radius:2px;background-image:repeating-linear-gradient(0deg,transparent 0 17px,rgba(31,42,35,.05) 17px 18px)}
.roh.blase{left:46%;top:0;background:#DCF3D3;border-radius:16px 16px 16px 4px}
.roh.postit{left:6%;top:38%;background:#F6E59A;border-radius:2px;font-family:'Parisienne',cursive;font-size:22px;line-height:1.15;width:170px}
.roh.postit.rosa{left:56%;top:31%;background:#F4C9C0}
.roh.mail{left:30%;top:60%;border-left:4px solid var(--moos)}
.roh.kalender{left:76%;top:62%;width:110px;text-align:center;padding:0 0 10px;overflow:hidden}
.roh.kalender small:first-child{background:#C9564A;color:#fff;padding:5px 0;font-weight:600;letter-spacing:.1em;margin-bottom:4px}
.roh.datei{left:0;top:86%;width:220px;font-size:13px;padding-left:44px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='3' width='18' height='18' rx='3' fill='%231E7145'/%3E%3Cpath d='M8 8l8 8M16 8l-8 8' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") 14px center/22px no-repeat}
.vn-pfeil{justify-self:center;width:44px;height:44px;margin-top:60px;border-radius:50%;background:var(--wald) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EBCB96' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/22px no-repeat}
.vn-fenster{border-radius:18px;background:#fff;box-shadow:0 2px 6px rgba(31,42,35,.06),0 40px 90px -30px rgba(31,42,35,.4);overflow:hidden}
.fenster-leiste{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--linie);background:#FBF8F3}
.fenster-leiste span{width:11px;height:11px;border-radius:50%;background:#E3D8C8}
.fenster-leiste i{font-style:normal;font-size:13px;color:var(--tinte-3);margin-left:10px}
.vn-liste{list-style:none;margin:0;padding:12px}
.ordentlich{display:flex;align-items:center;gap:12px;height:48px;padding:0 18px;margin-bottom:8px;border-radius:12px;
  font-size:15px;font-weight:500;color:var(--tinte);background:#F7F3EC;white-space:nowrap;overflow:hidden}
.ordentlich:last-child{margin-bottom:0}
.ordentlich em{font-style:normal;font-weight:400;color:var(--tinte-2);margin-left:auto;text-overflow:ellipsis;overflow:hidden}
.punkt{width:9px;height:9px;border-radius:50%;flex:none;background:var(--licht-2)}
.punkt.gruen{background:var(--moos)}

/* Schmerz und Antwort */
.paare{background:var(--papier);color:var(--tinte);padding:40px var(--rand) 130px}
.paare h2{text-align:center;margin-bottom:56px}
.paar{display:grid;grid-template-columns:1fr 1.15fr;gap:48px;align-items:center;max-width:1000px;margin:0 auto;padding:30px 0;border-top:1px solid var(--linie)}
.schmerz{font-family:var(--kopf);font-style:italic;font-size:clamp(21px,2vw,26px);line-height:1.3;color:var(--tinte-2);margin:0;
  text-decoration:line-through;text-decoration-color:rgba(86,98,90,.45);text-decoration-thickness:1px}
.antwort{margin:0;color:var(--tinte-2)}
.antwort b{display:block;font-family:var(--kopf);font-weight:400;font-size:24px;color:var(--tinte);margin-bottom:6px}

/* 3 Strecke */
.strecke{background:var(--wald);padding:120px var(--rand) 120px}
.strecke-kopf{margin-bottom:40px}
.strecke-raster{display:grid;grid-template-columns:1fr 1.25fr;gap:56px;align-items:center}
.stationen{list-style:none;margin:0;padding:0}
.station{position:relative;padding:16px 22px 18px;border-radius:18px;opacity:.55;transition:opacity .35s,background-color .35s;overflow:hidden}
.strecke.reiter .station{cursor:pointer}
.station:hover{opacity:.85}
.station.aktiv{opacity:1;background:rgba(243,236,225,.06);box-shadow:inset 0 0 0 1px rgba(243,236,225,.1)}
.station:focus-visible{outline:2px solid var(--licht);outline-offset:2px}
.strecke.reiter .station:not(.aktiv) p{display:none}
/* Zeitleiste der aktiven Station: zeigt, wann es von selbst weitergeht */
.strecke.laeuft .station.aktiv::after{content:"";position:absolute;left:22px;right:22px;bottom:0;height:2px;background:var(--licht);
  transform-origin:left;animation:stationzeit 6s linear both}
@keyframes stationzeit{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.nr{font-family:var(--kopf);font-size:16px;letter-spacing:.2em;color:var(--licht)}
.station h3{display:inline;font-size:clamp(24px,2.3vw,30px);margin:0 0 0 12px}
.station p{color:var(--creme-2);margin:10px 0 0;font-size:16px}
.buehne{position:relative;height:560px;border-radius:28px;overflow:hidden;
  background:radial-gradient(120% 90% at 70% 10%,rgba(235,203,150,.18),transparent 60%),var(--wald-2);
  box-shadow:inset 0 0 0 1px rgba(243,236,225,.08)}
.tafel{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:40px;
  opacity:0;visibility:hidden;transition:opacity .6s var(--weich),visibility 0s .6s}
.buehne[data-aktiv="1"] .t1,.buehne[data-aktiv="2"] .t2,.buehne[data-aktiv="3"] .t3,
.buehne[data-aktiv="4"] .t4,.buehne[data-aktiv="5"] .t5,.buehne[data-aktiv="6"] .t6{opacity:1;visibility:visible;transition:opacity .6s var(--weich),visibility 0s}
.fortschritt{position:absolute;left:50%;bottom:22px;display:flex;gap:8px;margin-left:-60px;width:120px;justify-content:center}
.fortschritt span{width:8px;height:8px;border-radius:4px;background:rgba(243,236,225,.25);transition:width .4s var(--weich),background-color .4s}
.buehne[data-aktiv="1"] .fortschritt span:nth-child(1),.buehne[data-aktiv="2"] .fortschritt span:nth-child(2),.buehne[data-aktiv="3"] .fortschritt span:nth-child(3),
.buehne[data-aktiv="4"] .fortschritt span:nth-child(4),.buehne[data-aktiv="5"] .fortschritt span:nth-child(5),.buehne[data-aktiv="6"] .fortschritt span:nth-child(6){width:26px;background:var(--licht)}

/* Tafeln: kleine Nachbauten der App */
.nachricht{max-width:330px;padding:14px 18px;border-radius:18px 18px 18px 4px;background:#DCF3D3;color:var(--tinte);font-size:15.5px;line-height:1.4;align-self:center}
.nachricht small{display:block;font-size:11.5px;color:var(--tinte-3);margin-bottom:3px}
.pfeil-runter{width:2px;height:34px;background:linear-gradient(var(--licht),transparent)}
.karte-app{width:min(360px,100%);padding:22px;border-radius:18px;background:var(--creme);color:var(--tinte);box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.karte-app > b{font-family:var(--kopf);font-weight:400;font-size:24px;display:block;margin-bottom:12px}
.feld{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid var(--linie);font-size:15px}
.feld span{color:var(--tinte-3)}
.marke-chip{display:inline-block;margin-top:14px;padding:6px 12px;border-radius:999px;font-size:13px;font-weight:500;background:#E2EBE4;color:#34493C}
.dokument{position:relative;width:min(340px,100%);padding:30px 28px 26px;border-radius:6px;background:#FDFBF7;color:var(--tinte);box-shadow:0 30px 60px -30px rgba(0,0,0,.75)}
.dokument small{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinte-3)}
.dokument b{display:block;font-family:var(--kopf);font-weight:400;font-size:23px;margin:8px 0 18px}
.dokument i{display:block;height:7px;border-radius:4px;background:#ECE5D9;margin:0 0 11px}
.dokument i.kurz{width:62%}
.bestaetigt{margin-top:22px;padding:12px 14px;border-radius:12px;background:#E2EBE4;color:#34493C;font-weight:500;font-size:14.5px}
.bestaetigt small{letter-spacing:0;text-transform:none;font-weight:400;color:#56705E}
.handy{width:250px;padding:18px 14px 16px;border-radius:34px;background:var(--creme);color:var(--tinte);
  box-shadow:0 0 0 8px #0B110D,0 40px 70px -30px rgba(0,0,0,.8)}
.handy-kopf small{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--tinte-3)}
.handy-kopf b{display:block;font-family:var(--kopf);font-weight:400;font-size:24px;margin:4px 0 10px}
.handy-zeile{font-size:13px;color:var(--tinte-2);margin:0 0 10px}
.ort{border-radius:14px;overflow:hidden;background:#fff;margin-bottom:10px;box-shadow:0 0 0 1px var(--linie)}
.ort.gewaehlt{box-shadow:0 0 0 2px var(--moos)}
.ort-bild{height:82px;background-size:cover;background-position:center 60%}
.ort span{display:flex;justify-content:space-between;padding:8px 12px;font-size:13px;font-weight:500}
.ort span b{color:#C9564A}
.spotkit-zeile{margin:4px 0 0;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--tinte-3);text-align:center}
.clip-rahmen{position:relative;width:100%;max-width:520px;aspect-ratio:16/10;border-radius:20px;overflow:hidden;box-shadow:0 40px 70px -30px rgba(0,0,0,.8)}
.fakten{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:520px}
.fakten span{padding:8px 14px;border-radius:999px;font-size:14px;background:rgba(243,236,225,.1);box-shadow:inset 0 0 0 1px rgba(243,236,225,.18)}
.galerie-raster{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:min(420px,100%)}
.g{position:relative;aspect-ratio:4/5;border-radius:6px;background-size:cover;background-position:center}
.g1{background-image:url(/bilder/duene-900.jpg);background-position:20% 50%}
.g2{background:linear-gradient(170deg,#E9D4B0,#B08A5C)}
.g3{background-image:url(/bilder/arbeitsplatz-900.jpg);background-position:30% 50%}
.g4{background-image:url(/bilder/duene-900.jpg);background-position:85% 40%}
.g5{background:linear-gradient(170deg,#9DB3A2,#2F4537)}
.g6{background-image:url(/bilder/arbeitsplatz-900.jpg);background-position:85% 50%}
.g b{position:absolute;right:8px;bottom:6px;color:#F4C9C0;font-size:18px;text-shadow:0 2px 6px rgba(0,0,0,.5)}
.ampel{position:absolute;left:8px;top:8px;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.8)}
.ampel.gruen{background:#5FA36B}.ampel.gelb{background:#E3B341}.ampel.rot{background:#C9564A}
.galerie-zeile{margin:0;font-size:15px;color:var(--creme-2)}
.galerie-zeile b{color:var(--creme)}
.rechnung{position:relative;width:min(380px,100%);padding:26px;border-radius:8px;background:#FDFBF7;color:var(--tinte);box-shadow:0 30px 60px -30px rgba(0,0,0,.75)}
.r-kopf{border-bottom:2px solid var(--moos);padding-bottom:12px;margin-bottom:8px}
.r-kopf b{font-family:var(--kopf);font-weight:400;font-size:30px;display:block}
.r-kopf small{color:var(--tinte-3);font-size:13px}
.r-zeile{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:14.5px;border-bottom:1px solid var(--linie)}
.r-zeile.summe{font-weight:600;border-bottom:0;font-size:16px}
.stempel{position:absolute;right:22px;top:24px;padding:4px 12px;border:2px solid #5FA36B;border-radius:8px;color:#4C8A57;
  font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:13px}
.r-fuss{margin:10px 0 0;font-size:13px;color:#4C8A57;font-weight:500}

/* 4 Werkzeuge */
.werkzeuge{background:var(--papier);color:var(--tinte);padding:130px var(--rand)}
.werkzeuge h2 em,.rechner-bereich h2 em{color:var(--moos)}
.werkzeuge .vorzeile,.rechner-bereich .vorzeile{color:var(--moos)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:34px 0 14px}
.chip{font:inherit;font-size:15px;font-weight:500;padding:11px 20px;border-radius:999px;border:0;cursor:pointer;color:var(--tinte);
  background:#fff;box-shadow:inset 0 0 0 1px var(--linie);transition:background-color .2s,color .2s,box-shadow .2s}
.chip:hover{box-shadow:inset 0 0 0 1px var(--moos)}
.chip[aria-pressed="true"]{background:var(--tinte);color:var(--creme);box-shadow:0 10px 24px -12px rgba(31,42,35,.7)}
.chip[aria-pressed="true"]::before{content:"✓ "}
.treffer-zeile{margin:0 0 30px;color:var(--tinte-2);font-size:15px}
.treffer-zeile span{font-weight:600;color:var(--tinte)}
.kacheln{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kachel{position:relative;padding:24px 22px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--linie);overflow:hidden;
  transition:opacity .4s,filter .4s,box-shadow .4s}
.kachel::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .3s;
  background:radial-gradient(circle 180px at var(--gx,50%) var(--gy,50%),rgba(235,203,150,.38),transparent 70%)}
.kachel:hover::before{opacity:1}
.kachel > *{position:relative}
.kachel .i{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:var(--wald);margin-bottom:16px}
.kachel .i svg{width:22px;height:22px;fill:none;stroke:var(--licht);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.kachel b{display:block;font-family:var(--kopf);font-weight:400;font-size:21px;line-height:1.15;margin-bottom:8px}
.kachel p{margin:0;font-size:14.5px;line-height:1.5;color:var(--tinte-2)}
.kacheln.gefiltert .kachel{opacity:.32;filter:grayscale(1)}
.kacheln.gefiltert .kachel.treffer{opacity:1;filter:none;box-shadow:inset 0 0 0 2px var(--licht-2),0 22px 44px -22px rgba(201,154,91,.75)}
.kacheln.gefiltert .kachel.treffer::before{opacity:.7}

/* 5 Datenschutz */
.daten{display:grid;grid-template-columns:1fr 1fr;min-height:100vh;background:var(--nacht)}
.daten-bild{position:relative;overflow:hidden;min-height:420px}
.daten-bild::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 85%,var(--nacht))}
.flackern{position:absolute;inset:0;mix-blend-mode:soft-light;background:radial-gradient(circle at 22% 62%,rgba(255,214,150,.95),transparent 32%)}
.daten-text{padding:120px var(--rand) 120px 60px;align-self:center}
.daten-text h2{font-size:clamp(36px,4.2vw,60px)}
.abprall{display:block;width:100%;max-width:420px;margin:36px 0 26px;overflow:visible}
.abprall .laptop,.abprall .wolke path:first-child{fill:rgba(243,236,225,.06);stroke:var(--creme-2);stroke-width:1.6}
.abprall .laptop path{fill:none}
.abprall .weg{stroke:rgba(243,236,225,.25);stroke-width:1.5;stroke-dasharray:4 6}
.abprall .schild{stroke:var(--licht);stroke-width:3;stroke-linecap:round}
.abprall .kreuz{fill:none;stroke:#D98B7A;stroke-width:2.2;stroke-linecap:round}
.abprall text{fill:var(--creme-3);font:13px var(--text);text-anchor:middle}
.abprall .datum{fill:var(--licht)}
.daten ul{list-style:none;margin:0;padding:0}
.daten li{position:relative;padding:0 0 22px 30px;color:var(--creme-2)}
.daten li::before{content:"";position:absolute;left:0;top:9px;width:12px;height:12px;border-radius:50%;background:var(--licht);box-shadow:0 0 18px var(--licht)}
.daten li b{color:var(--creme)}

/* 6 Rechner */
.rechner-bereich{background:var(--papier);color:var(--tinte);padding:130px var(--rand)}
.rechner{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;margin-top:44px;align-items:start}
.schalter{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--linie);
  margin-bottom:10px;cursor:pointer;transition:box-shadow .25s}
.schalter:hover{box-shadow:inset 0 0 0 1px var(--moos)}
.schalter input{position:absolute;opacity:0;width:1px;height:1px}
.spur{position:relative;flex:none;width:46px;height:26px;border-radius:13px;background:#D9D1C4;transition:background-color .25s}
.spur::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:transform .3s var(--weich)}
.schalter input:checked + .spur{background:var(--moos)}
.schalter input:checked + .spur::after{transform:translateX(20px)}
.schalter input:focus-visible + .spur{outline:2px solid var(--licht-2);outline-offset:3px}
.schalter .name{flex:1;font-size:15.5px}
.schalter b{font-weight:600;white-space:nowrap}
.schalter input:not(:checked) ~ .name,.schalter input:not(:checked) ~ b{color:var(--tinte-3)}
.fussnote{font-size:13px;color:var(--tinte-3);margin:14px 4px 0}
.ergebnis{position:sticky;top:100px;padding:36px;border-radius:26px;background:var(--wald);color:var(--creme);
  box-shadow:0 40px 80px -40px rgba(23,36,28,.9)}
.e-klein{margin:0;color:var(--creme-3);font-size:14px;letter-spacing:.14em;text-transform:uppercase}
.e-gross{margin:6px 0 26px;font-family:var(--kopf);font-size:clamp(56px,6vw,84px);line-height:1;color:var(--licht);font-variant-numeric:lining-nums tabular-nums}
.e-gross small{font-family:var(--text);font-size:17px;color:var(--creme-2)}
.b-zeile{display:flex;justify-content:space-between;font-size:15px;margin:14px 0 8px}
.b-zeile b{font-variant-numeric:tabular-nums}
.b-spur{height:14px;border-radius:7px;background:rgba(243,236,225,.08);overflow:hidden}
.b-spur i{display:block;height:100%;border-radius:7px;width:var(--w,100%);transition:width .7s var(--weich)}
.b-abo{background:rgba(243,236,225,.55)}
.b-wir{background:var(--licht);--w:16%}
.fazit{margin:26px 0 0;font-size:17px;color:var(--creme-2)}
.fazit b{color:var(--creme)}

/* 7 Warum jetzt */
.warum{background:var(--wald);padding:130px var(--rand);text-align:center}
.countdown{display:flex;flex-direction:column;align-items:center;margin-bottom:30px}
.tage{font-family:var(--kopf);font-size:clamp(110px,16vw,220px);line-height:.9;color:var(--licht);font-variant-numeric:lining-nums;
  text-shadow:0 0 60px rgba(235,203,150,.35)}
.tage-text{font-size:13px;letter-spacing:.3em;text-transform:uppercase;color:var(--creme-2);margin-top:10px}
.gruende{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:56px;text-align:left}
.grund{padding:28px 24px;border-radius:20px;background:rgba(243,236,225,.05);box-shadow:inset 0 0 0 1px rgba(243,236,225,.1)}
.grund b{display:block;font-family:var(--kopf);font-weight:400;font-size:22px;line-height:1.2;margin-bottom:10px}
.grund p{margin:0;font-size:15px;color:var(--creme-2)}

/* 8 Preis */
.preis{min-height:100svh;display:grid;place-items:center;padding:120px 24px;overflow:hidden;isolation:isolate}
.preis .clip{z-index:-3}
.preis .lichtfahrt{z-index:-2}
.preis::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(16,24,19,.55),rgba(16,24,19,.25) 40%,rgba(16,24,19,.75))}
.preis-karte{width:min(460px,100%);padding:42px 38px;border-radius:30px;background:rgba(16,24,19,.55);
  backdrop-filter:blur(20px) saturate(1.3);-webkit-backdrop-filter:blur(20px) saturate(1.3);
  box-shadow:inset 0 0 0 1px rgba(243,236,225,.18),0 50px 100px -40px rgba(0,0,0,.8)}
.betrag{margin:0 0 22px}
.betrag b{font-family:var(--kopf);font-weight:400;font-size:84px;line-height:1;color:var(--licht)}
.betrag span{font-size:18px;color:var(--creme-2);margin-left:6px}
.betrag{margin-bottom:10px}
/* Abo als zweite Wahl unter dem Einmalpreis (Mandy 25.10.2026) */
.abo-zeile{margin:0 0 24px;font-size:18px;color:var(--creme-2);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.abo-zeile b{font-family:var(--kopf);font-weight:400;font-size:30px;color:var(--licht)}
.kuendbar{font-size:13px;padding:3px 10px;border-radius:99px;background:rgba(143,186,150,.2);color:#BFE0C4}
.kauf-knoepfe{display:grid;gap:10px;margin-bottom:10px}
.kauf-knoepfe[hidden]{display:none}
.fuss-klein a{color:inherit}
.alle-drin{margin:-18px 0 30px;max-width:640px;color:var(--tinte-2);font-size:15px}
.preis-karte ul{list-style:none;margin:0 0 28px;padding:0}
.preis-karte li{padding:9px 0 9px 28px;position:relative;border-top:1px solid rgba(243,236,225,.1)}
.preis-karte li::before{content:"✓";position:absolute;left:2px;top:9px;color:var(--licht);font-weight:600}

/* 9 Fragen und Fuss */
.fragen{background:var(--papier);color:var(--tinte);padding:120px var(--rand)}
.fragen h2{margin-bottom:34px}
.fragen details{max-width:820px;border-top:1px solid var(--linie)}
.fragen summary{list-style:none;cursor:pointer;padding:22px 40px 22px 0;position:relative;font-family:var(--kopf);font-size:23px}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";position:absolute;right:6px;top:18px;font-family:var(--text);font-size:26px;color:var(--moos);transition:opacity .2s}
.fragen details[open] summary::after{content:"–"}
.fragen details p{margin:0 0 24px;color:var(--tinte-2);max-width:40em}
.fuss{background:var(--nacht);text-align:center;padding:60px 24px 70px;color:var(--creme-2)}
.fuss p{margin:4px 0}
.fuss .wortmarke{font-size:28px;color:var(--creme);display:inline-flex;margin-bottom:8px}
.fuss-klein{font-size:13px;color:var(--creme-3)}

/* ---------- Bewegung: nur wenn erwuenscht ---------- */
@media (prefers-reduced-motion:no-preference){
  .preis .clip{animation:atmen 26s ease-in-out infinite alternate}
  .lichtfahrt{animation:lichtfahrt 14s ease-in-out infinite alternate}
  .w{animation:wortein 1.1s var(--weich) both}
  .w2{animation-delay:.12s}.w3{animation-delay:.24s}.w4{animation-delay:.5s}.w5{animation-delay:.62s}.w6{animation-delay:.74s}
  .auftakt .unterzeile,.auftakt .versprechen,.auftakt .knoepfe,.auftakt .klein-hinweis{animation:wortein 1.2s 1s var(--weich) both}
  .plakette{animation:wortein 1s var(--weich) both}
  .p1{animation-delay:1.5s}.p2{animation-delay:1.8s}.p3{animation-delay:2.1s}
  .weiter span{animation:weiter 2s ease-in-out infinite}
  .flackern{animation:flackern 6s ease-in-out infinite}
  .abprall .datum{animation:abprall 2.6s cubic-bezier(.5,0,.5,1) infinite}
  .abprall .d2{animation-delay:.85s}.abprall .d3{animation-delay:1.7s}
}
@keyframes atmen{from{transform:scale(1.03)}to{transform:scale(1.12)}}
@keyframes lichtfahrt{from{background-position:100% 0}to{background-position:0 0}}
@keyframes wortein{from{opacity:0}to{opacity:1}}
@keyframes weiter{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(14px)}}
@keyframes flackern{0%,100%{opacity:.8}20%{opacity:.7}35%{opacity:.88}55%{opacity:.74}75%{opacity:.85}}
@keyframes abprall{0%{transform:translateX(0);opacity:0}10%{opacity:1}48%{transform:translateX(122px);opacity:1}100%{transform:translateX(0);opacity:0}}

/* ---------- Handy und Tablet ---------- */
@media (max-width:980px){
  .kacheln{grid-template-columns:repeat(2,1fr)}
  .gruende{grid-template-columns:repeat(2,1fr)}
  .daten{grid-template-columns:1fr}
  .daten-bild::after{background:linear-gradient(180deg,transparent 85%,var(--nacht))}
  .daten-text{padding:40px var(--rand) 100px}
  .rechner{grid-template-columns:1fr}
  .ergebnis{position:static}
}
@media (max-width:760px){
  body{font-size:16px}
  .kopf{padding:10px 16px}
  .kopf .zeichen{width:28px;height:28px}
  .kopf nav a:not(.knopf){display:none}
  .wortmarke{font-size:17px}
  .auftakt{padding:110px 20px 80px}
  .plaketten{display:none}
  .paar{grid-template-columns:1fr;gap:10px}
  .strecke{padding:100px 20px 40px}
  .strecke-raster{grid-template-columns:1fr;gap:0}
  .buehne{order:-1;height:400px;border-radius:20px;margin-bottom:18px}
  .tafel{padding:20px;zoom:.82}
  .station{padding:12px 16px 14px}
  .kacheln{grid-template-columns:1fr}
  .gruende{grid-template-columns:1fr}
  .roh{width:140px;font-size:12.5px;padding:10px 12px}
  .roh.postit{width:130px;font-size:18px}
  .roh.datei{width:170px;font-size:11px}
  .roh.kalender{width:90px;left:auto;right:0}
  .zettelfeld{height:380px}
  .roh b{font-size:22px}
  .ordentlich{padding:0 12px}
  .ordentlich em{font-size:13px}
  .preis-karte{padding:32px 24px}
  .betrag b{font-size:68px}
}
.countdown[hidden]{display:none}
video.clip{transition:opacity .9s ease}
video.clip.blende{opacity:0}
.clip-rahmen{background:var(--nacht)}
.bild-buero{background-image:url(clips/buero.jpg);background-position:60% center}
.plakette b.frage{display:block;font-family:var(--text);font-size:14px;font-weight:500;color:var(--licht);margin:3px 0 0}
.schalter .name small{display:block;font-size:13px;color:var(--tinte-3);margin-top:2px}
.schalter-gruppe{margin-bottom:10px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--linie)}
.schalter-gruppe .schalter{margin:0;box-shadow:none;background:none}
.anbieter{display:flex;flex-wrap:wrap;gap:8px;padding:0 20px 16px 82px}
.anbieter label{position:relative;padding:6px 14px;border-radius:999px;font-size:14px;cursor:pointer;background:var(--papier);box-shadow:inset 0 0 0 1px var(--linie);transition:background-color .2s,color .2s}
.anbieter input{position:absolute;opacity:0;width:1px;height:1px}
.anbieter label:has(input:checked){background:var(--tinte);color:var(--creme);box-shadow:none}
.anbieter label:has(input:focus-visible){outline:2px solid var(--licht-2);outline-offset:2px}
@media (max-width:760px){.anbieter{padding-left:20px}}
.ehrlich{margin:4px 0 14px;padding:14px 18px;border-radius:14px;font-size:14.5px;line-height:1.5;color:var(--tinte-2);background:#E2EBE4}
@media (max-width:980px){
  .vn{grid-template-columns:1fr;gap:10px}
  .vn-pfeil{margin:10px auto 30px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EBCB96' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E")}
}
/* Durchstreichen erst beim Drueberfahren (Mandy). Ohne Maus (Handy) bleibt es durchgestrichen. */
@media (hover:hover){
  .schmerz,.vn-seite:first-child .vn-titel em{text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:transparent;
    transition:text-decoration-color .45s ease,color .45s ease}
  .schmerz{color:var(--tinte)}
  .paar:hover .schmerz{text-decoration-color:rgba(86,98,90,.65);color:var(--tinte-2)}
  .vn-seite:first-child:hover .vn-titel em{text-decoration-color:rgba(86,98,90,.65)}
}
/* Handy kompakter (Mandy 27.10.2026: "too much", bei "Was nervt dich" ewig scrollen).
   Werkzeuge: zwei Spalten nur mit Titel; Antippen klappt die Beschreibung auf.
   Nach der Auswahl oben bleiben nur die passenden Tools stehen, dann mit Beschreibung. */
@media (max-width:760px){
  .chaos{padding:72px 20px 24px}
  .paare{padding:28px 20px 64px}
  .paare h2{margin-bottom:24px}
  .paar{padding:18px 0}
  .schmerz{font-size:19px}
  .antwort b{font-size:20px}
  .strecke{padding:64px 20px 32px}
  .werkzeuge{padding:64px 16px}
  .einleitung{font-size:16px;margin-top:12px}
  .chips{gap:8px;margin:20px 0 10px}
  .chip{font-size:14px;padding:9px 14px}
  .treffer-zeile{margin-bottom:16px}
  .alle-drin{margin:-8px 0 18px;font-size:14px}
  .kacheln{grid-template-columns:repeat(2,1fr);gap:10px}
  .kachel{padding:14px 14px 15px;border-radius:16px;cursor:pointer}
  .kachel .i{width:34px;height:34px;border-radius:10px;margin-bottom:10px}
  .kachel .i svg{width:18px;height:18px}
  .kachel b{font-size:17px;margin-bottom:0}
  .kachel p{display:none;margin-top:8px;font-size:14px}
  .kachel.offen{grid-column:1/-1}
  .kachel.offen p{display:block}
  .kacheln.gefiltert .kachel:not(.treffer){display:none}
  .kacheln.gefiltert .kachel.treffer{grid-column:1/-1}
  .kacheln.gefiltert .kachel.treffer p{display:block}
  .daten{min-height:0}
  .daten-bild{min-height:240px}
  .daten-text{padding:28px 20px 56px}
  .abprall{margin:22px 0 18px}
  .daten li{padding-bottom:16px}
  .rechner-bereich{padding:64px 20px}
  .rechner{margin-top:24px;gap:24px}
  .schalter{padding:13px 16px}
  .warum{padding:64px 20px}
  .gruende{margin-top:28px;gap:10px}
  .grund{padding:18px 18px}
  .grund b{font-size:19px;margin-bottom:6px}
  .grund p{font-size:14.5px}
  .preis{padding:72px 16px}
  .fragen{padding:64px 20px}
}
/* Preis: Karte links, damit die Familie im Clip rechts frei bleibt (Mandy) */
@media (min-width:981px){
  .preis{place-items:center start;padding-left:var(--rand)}
  .preis .clip{object-position:65% center}
}

/* Nutzerstimmen (31.10.2026), wie im Reel: Kernsatz groß, echte Nachricht als leicht schräge Sprechblase auf warmem Sand */
.stimmen-leiste{background:radial-gradient(90% 70% at 50% 40%,#FBF6EF 0%,#F1E7DA 55%,#E6D8C6 100%);color:var(--tinte);padding:110px var(--rand) 120px;text-align:center}
.stimmen-leiste .vorzeile,.stimmen-leiste h2 em{color:var(--moos)}
.stimmen-leiste h2{margin:8px auto 64px;max-width:820px}
.stimmen-raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 48px;max-width:1000px;margin:0 auto}
.stimmen-raster figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:18px}
.stimmen-raster .kern{margin:0;font-family:var(--kopf);font-size:34px;line-height:1.1;color:var(--tinte)}
.stimmen-raster blockquote{margin:0;max-width:420px;padding:18px 22px;border-radius:22px 22px 22px 6px;background:#fff;text-align:left;font-size:15.5px;line-height:1.5;color:var(--tinte-2);box-shadow:0 0 0 1px rgba(60,40,20,.06),0 28px 60px -34px rgba(60,40,20,.55)}
.stimmen-raster figure:nth-child(1) blockquote{transform:rotate(-2deg)}.stimmen-raster figure:nth-child(2) blockquote{transform:rotate(1.6deg)}
.stimmen-raster figure:nth-child(3) blockquote{transform:rotate(1.2deg)}.stimmen-raster figure:nth-child(4) blockquote{transform:rotate(-1.8deg)}
.stimmen-raster figure:nth-child(even){margin-top:56px}
@media (max-width:700px){.stimmen-leiste{padding:60px 20px 70px}.stimmen-leiste h2{margin-bottom:32px}.stimmen-raster{grid-template-columns:1fr;gap:36px}.stimmen-raster figure:nth-child(even){margin-top:0}.stimmen-raster .kern{font-size:28px}}
/* Pillen in zwei gleich breiten Zeilen (31.10.2026) */
.chips{display:inline-flex;flex-direction:column;flex-wrap:nowrap;gap:10px}
.chips-zeile{display:flex;justify-content:space-between;gap:10px}
@media (max-width:700px){.chips{display:flex}.chips-zeile{flex-wrap:wrap;justify-content:flex-start}}
.chips-zeile:last-child .chip{flex:1;text-align:center}
@media (max-width:700px){.chips-zeile:last-child .chip{flex:0 0 auto}}
/* Kernsätze hervorheben (31.10.2026): groß, kursiv, Leuchtmarker; dieselbe Stelle in der Nachricht markiert; geschwärzt = Balken */
.stimmen-raster .kern{position:relative;font-family:var(--kopf);font-style:italic;font-size:40px;line-height:1.1;color:var(--tinte);max-width:440px;padding:0 6px;background:linear-gradient(transparent 62%,rgba(211,174,119,.45) 62%,rgba(211,174,119,.45) 92%,transparent 92%)}
.stimmen-raster .kern::before{content:"\201E";color:var(--moos);margin-right:2px}
.stimmen-raster .kern::after{content:"\201C";color:var(--moos);margin-left:2px}
.stimmen-raster mark{background:rgba(211,174,119,.38);color:inherit;padding:0 2px;border-radius:3px}
.geschwaerzt{display:inline-block;width:46px;height:1.05em;vertical-align:-.15em;background:#111;border-radius:4px}
.geschwaerzt.lang{width:150px}
.stimmen-raster figure:nth-child(5) blockquote{transform:rotate(1.4deg)}
.stimmen-raster figure:nth-child(6) blockquote{transform:rotate(-1.2deg)}
.stimmen-raster figure:nth-child(7) blockquote{transform:rotate(-1.6deg)}
.stimmen-raster figure:nth-child(8) blockquote{transform:rotate(1.8deg)}
@media (max-width:700px){.stimmen-raster .kern{font-size:30px}}
/* Nutzerstimmen als Slider (31.10.2026): 2 sichtbar, rückt alle 5 Sekunden um eine weiter */
.stimmen-fenster{max-width:1000px;margin:0 auto;overflow:hidden;padding:20px 10px 40px}
.stimmen-raster{display:flex;gap:48px;max-width:none;grid-template-columns:none;transition:transform .8s cubic-bezier(.22,.7,.2,1)}
.stimmen-raster figure{flex:0 0 calc((100% - 48px) / 2)}
.stimmen-raster figure:nth-child(even){margin-top:0}
@media (max-width:700px){.stimmen-raster{gap:20px}.stimmen-raster figure{flex:0 0 100%}}

/* Tools kompakt (31.10.2026): nur Symbol + Name; Klick oder passende Pille klappt die Kachel groß auf */
@media (min-width:701px){
  .kacheln{grid-template-columns:repeat(6,1fr);gap:10px;grid-auto-flow:dense}
  .kachel{padding:16px 14px;border-radius:16px;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;transition:opacity .4s,filter .4s,box-shadow .4s,transform .35s}
  .kachel .i{width:36px;height:36px;border-radius:11px;margin-bottom:10px}
  .kachel .i svg{width:18px;height:18px}
  .kachel b{font-size:17px;margin-bottom:0}
  .kachel p{display:none;margin-top:8px}
  .kachel.offen,.kacheln.gefiltert .kachel.treffer{grid-column:span 2;transform:scale(1.02)}
  .kachel.offen p,.kacheln.gefiltert .kachel.treffer p{display:block}
}
/* Slider: kein abgeschnittener Schatten, Pfeile zum Blättern (31.10.2026) */
.stimmen-raster{gap:72px}
.stimmen-raster figure{flex:0 0 calc((100% - 72px) / 2)}
.stimmen-raster blockquote{box-shadow:0 0 0 1px rgba(60,40,20,.10),0 10px 22px -16px rgba(60,40,20,.45)}
.stimmen-fenster{padding:24px 14px 30px}
.stimmen-steuer{display:flex;justify-content:center;gap:14px;margin-top:10px}
.stimmen-steuer button{width:48px;height:48px;border-radius:50%;border:0;background:#fff;color:var(--tinte);font-size:28px;line-height:1;cursor:pointer;box-shadow:0 0 0 1px rgba(60,40,20,.12)}
.stimmen-steuer button:hover{background:var(--moos);color:#fff}
@media (max-width:700px){.stimmen-raster{gap:28px}.stimmen-raster figure{flex:0 0 100%}}
/* Slider ohne Ruck (31.10.2026): Neigung wiederholt sich alle 8 Karten, damit die Kopien am Ende genauso stehen wie der Anfang */
.stimmen-raster figure blockquote{transform:none}
.stimmen-raster figure:nth-child(8n+1) blockquote{transform:rotate(-2deg)}
.stimmen-raster figure:nth-child(8n+2) blockquote{transform:rotate(1.6deg)}
.stimmen-raster figure:nth-child(8n+3) blockquote{transform:rotate(1.2deg)}
.stimmen-raster figure:nth-child(8n+4) blockquote{transform:rotate(-1.8deg)}
.stimmen-raster figure:nth-child(8n+5) blockquote{transform:rotate(1.4deg)}
.stimmen-raster figure:nth-child(8n+6) blockquote{transform:rotate(-1.2deg)}
.stimmen-raster figure:nth-child(8n+7) blockquote{transform:rotate(-1.6deg)}
.stimmen-raster figure:nth-child(8n) blockquote{transform:rotate(1.8deg)}
.stimmen-raster{transition:transform 1.1s cubic-bezier(.45,0,.2,1);align-items:flex-start}

/* Gründerpreis-Leiste: steht fest oben über dem Kopf (kein Scroll-Ereignis) */
.gruender-leiste{position:fixed;top:0;left:0;right:0;z-index:51;height:38px;display:flex;align-items:center;justify-content:center;gap:12px;padding:0 16px;
  background:var(--licht);color:#1E1611;font-size:14.5px;line-height:1.2;text-align:center}
.gruender-leiste[hidden]{display:none}
.gruender-leiste a{color:#1E1611;font-weight:600;white-space:nowrap}
.gruender-leiste .gl-kurz{display:none}
body.mit-gruender .kopf{top:38px}
html:has(body.mit-gruender){scroll-padding-top:110px}
@media (max-width:760px){.gruender-leiste{font-size:13.5px}.gruender-leiste .gl-lang{display:none}.gruender-leiste .gl-kurz{display:inline}}