/* ═══════════════════════════════════════════════════════════════════════
   Stillkissen landing pages — shared stylesheet for /lp/stillkissen-1…10
   ═══════════════════════════════════════════════════════════════════════
   Ported from the babydecke V1 "Cinematic Story" inline CSS so the two
   product lines read as one brand, then extended with the components the
   Stillkissen pages need (fabric compare, guarantee, Messe logos, FAQ,
   specs, timeline, bento, scrolly). Ten variants share this file; each
   template adds only its own overrides in an inline <style>.

   Colour tokens match the minkymooh theme (rose/cocoa/cream). Inline
   <style> is allowed by the CSP, inline <script> is not — behaviour lives
   in /assets/js/lp/stillkissen.js.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
    --lp-cocoa: #3a2b27;
    --lp-cocoa-soft: #5c4a44;
    --lp-rose: #c47585;
    --lp-rose-deep: #9d5a66;
    --lp-blush: #fbecee;
    --lp-cream: #fdf6f0;
    --lp-sun: #faf0d8;
    --lp-sage: #e6f2e0;
    --lp-sage-deep: #3d6b34;
    --lp-sage-ink: #2f5527;
    --lp-navy: #034976;
    --lp-kapok: #f2e7d8;
    --lp-forest: #1f3a2a;
}
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--lp-cream);
    color: var(--lp-cocoa);
    font-family: 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    overflow-x: hidden;
}
.lp-caveat { font-family: 'Caveat', cursive; }
.lp-lbl-narrow { display: none; }
@media (max-width: 860px) { .lp-lbl-wide { display: none; } .lp-lbl-narrow { display: inline; } }

/* ————— Reveal on scroll (JS only; page is fully visible without) ————— */
.lp-js .rv { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1); }
.lp-js .rv.in { opacity: 1; transform: none; }
.lp-js [data-plx].rv { transform: none; transition-property: opacity; }
.rv-d1 { transition-delay: .12s; } .rv-d2 { transition-delay: .24s; } .rv-d3 { transition-delay: .36s; }
@media (prefers-reduced-motion: reduce) { .lp-js .rv { opacity: 1; transform: none; transition: none; } html { scroll-behavior: auto; } }

/* ————— Hero ————— */
.lp-hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; isolation: isolate; background: var(--lp-cocoa); }
.lp-hero video, .lp-hero .lp-hero-poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; z-index: -2; }
/* 20.10.: mehr Kontrast (Sichtpruefung). Der Film ist ein helles Schlafzimmer; der alte
   Verlauf kam nur von unten und liess Kicker, H1 und Unterzeile auf dem hellen Laken
   stehen. Jetzt traegt die linke Haelfte -- wo der Text steht -- einen eigenen Verlauf. */
.lp-hero::after {
    content: ''; position: absolute; inset: 0; z-index: -1;
    background:
        linear-gradient(180deg, rgba(255,253,251,0) 90%, #fffdfb 100%),
        linear-gradient(178deg, rgba(58,43,39,.18) 0%, rgba(58,43,39,0) 30%),
        linear-gradient(90deg, rgba(43,28,25,.74) 0%, rgba(43,28,25,.6) 30%, rgba(43,28,25,.3) 50%, rgba(43,28,25,.06) 66%, rgba(0,0,0,0) 78%),
        linear-gradient(6deg, rgba(43,28,25,.7) 0%, rgba(58,43,39,.3) 34%, rgba(0,0,0,0) 62%);
}
@media (max-width: 720px) {
    .lp-hero::after {
        background:
            linear-gradient(180deg, rgba(255,253,251,0) 92%, #fffdfb 100%),
            linear-gradient(178deg, rgba(58,43,39,.22) 0%, rgba(58,43,39,0) 26%),
            linear-gradient(4deg, rgba(43,28,25,.95) 0%, rgba(48,33,30,.86) 40%, rgba(58,41,42,.7) 62%, rgba(74,52,55,.38) 80%, rgba(0,0,0,0) 96%);
    }
}
.lp-hero-inner { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 48px) clamp(72px, 11vh, 128px); color: #fff; }
.lp-hero h1 { margin: .35em 0 .3em; font-size: clamp(38px, 6.2vw, 76px); line-height: 1.04; font-weight: 800; letter-spacing: -.015em; text-wrap: balance; text-shadow: 0 1px 3px rgba(43,28,25,.4), 0 2px 24px rgba(43,28,25,.55); }
.lp-hero h1 .lp-caveat { display: inline-block; font-size: 1.18em; font-weight: 600; color: #ffcdd7; transform: rotate(-2deg); }
.lp-hero-sub { max-width: 34em; font-size: clamp(16px, 2vw, 20px); line-height: 1.55; color: #f6e8e4; text-shadow: 0 1px 3px rgba(43,28,25,.45), 0 2px 16px rgba(43,28,25,.55); }
.lp-hero-sub strong { font-weight: 800; color: #fff; }
.lp-hero-kicker { display: inline-flex; align-items: center; gap: .6em; font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #ffe1e7; text-shadow: 0 1px 3px rgba(43,28,25,.75), 0 0 14px rgba(43,28,25,.5); }
.lp-hero-kicker::before { content: ''; width: 30px; height: 2px; background: #ffd6de; border-radius: 2px; }
.lp-hero-cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 18px; margin-top: 26px; }
.lp-price-pill { display: inline-flex; align-items: baseline; gap: .5em; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.35); backdrop-filter: blur(6px); border-radius: 999px; padding: .55em 1.1em; font-size: clamp(15px, 1.8vw, 18px); }
.lp-price-pill strong { font-size: 1.35em; font-weight: 800; }
.lp-price-pill s { opacity: .75; font-weight: 600; }
.lp-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; background: linear-gradient(135deg, var(--lp-rose) 0%, var(--lp-rose-deep) 100%); color: #fff; text-decoration: none; font-weight: 800; font-size: clamp(16px, 1.9vw, 19px); padding: .9em 1.9em; border: 0; border-radius: 999px; box-shadow: 0 10px 30px -8px rgba(157,90,102,.65); transition: transform .25s ease, box-shadow .25s ease; cursor: pointer; font-family: inherit; }
.lp-btn:hover { transform: translateY(-2px) scale(1.02); box-shadow: 0 16px 36px -8px rgba(157,90,102,.75); }
.lp-btn-outline { background: transparent; color: var(--lp-rose-deep); border: 2px solid var(--lp-rose-deep); box-shadow: none; }
.lp-btn-outline:hover { box-shadow: 0 10px 26px -12px rgba(157,90,102,.55); }
.lp-btn-light { background: #fff; color: var(--lp-rose-deep); box-shadow: 0 10px 30px -10px rgba(0,0,0,.35); }
.lp-btn-sage { background: linear-gradient(135deg, #5aa348 0%, var(--lp-sage-deep) 100%); box-shadow: 0 10px 30px -8px rgba(61,107,52,.6); }
@media (max-width: 860px) {
    .lp-hero h1 { font-size: 31px; margin: .3em 0 .28em; }
    .lp-hero-sub { font-size: 15px; line-height: 1.48; }
    .lp-hero-cta-row { flex-wrap: nowrap; align-items: stretch; gap: 10px; margin-top: 18px; }
    .lp-price-pill { flex: 0 0 auto; padding: .5em .85em; font-size: 13.5px; }
    .lp-price-pill strong { font-size: 1.25em; }
    .lp-hero-cta-row .lp-btn { flex: 1 1 auto; min-width: 0; font-size: 14.5px; padding: .8em 1em; text-align: center; white-space: nowrap; }
}
.lp-scroll-cue { position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); width: 26px; height: 42px; border: 2px solid rgba(255,255,255,.6); border-radius: 14px; }
.lp-scroll-cue::before { content: ''; position: absolute; left: 50%; top: 7px; width: 4px; height: 8px; margin-left: -2px; border-radius: 3px; background: #fff; animation: lp-cue 1.8s ease-in-out infinite; }
@keyframes lp-cue { 0%,100% { transform: translateY(0); opacity: 1; } 55% { transform: translateY(12px); opacity: .15; } }
@media (prefers-reduced-motion: reduce) { .lp-scroll-cue::before { animation: none; } }

/* Markenschild oben links (kein Link: Klick-Budget) */
.lp-mast { position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 1; display: flex; width: 100%; max-width: 1200px; padding: clamp(16px, 2.6vh, 28px) clamp(20px, 5vw, 48px) 0; pointer-events: none; -webkit-user-select: none; user-select: none; }
.lp-mast > span { display: inline-flex; align-items: center; padding: 9px 19px; background: linear-gradient(180deg, rgba(255,250,246,.95) 0%, rgba(253,241,238,.95) 100%); border: 1px solid rgba(196,117,133,.30); border-radius: 999px; box-shadow: 0 10px 26px -12px rgba(26,16,14,.65); }
.lp-mast img { display: block; height: 36px; width: auto; }
@media (max-width: 860px) { .lp-mast > span { padding: 7px 15px; } .lp-mast img { height: 26px; } }

/* Prüfzettel im Hero: Prüfengel + Punkte links, Oeko-Tex/GOTS rechts */
.lp-tr4 { margin-top: 26px; display: flex; flex-direction: column; width: max-content; max-width: 100%; }
.lp-tr4-notes { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin: 0 0 9px; padding: 0 12px 0 8px; }
.lp-tr4-note { font-family: 'Caveat', cursive; font-size: 24px; line-height: 1.1; font-weight: 600; color: #fbe3e7; text-shadow: 0 1px 2px rgba(43,28,25,.85), 0 2px 8px rgba(43,28,25,.75), 0 4px 26px rgba(43,28,25,.60); transform: rotate(-1.5deg); transform-origin: left bottom; white-space: nowrap; }
.lp-tr4-note-bio { color: #d3f0bb; transform-origin: right bottom; }
.lp-tr4-card { position: relative; display: grid; grid-template-columns: auto auto; align-items: center; width: max-content; max-width: 100%; column-gap: 14px; padding: 16px 22px 16px 18px; color: var(--lp-cocoa); text-shadow: none; background: linear-gradient(180deg, rgba(255,250,246,.96) 0%, rgba(253,241,238,.96) 100%); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid rgba(196,117,133,.30); border-radius: 22px; box-shadow: 0 20px 44px -20px rgba(26,16,14,.70), inset 0 1px 0 rgba(255,255,255,.85); }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .lp-tr4-card, .lp-mast > span { background: linear-gradient(180deg, #fffaf6 0%, #fdf1ee 100%); } }
.lp-tr4-card::before { content: ''; position: absolute; left: 22px; top: -1px; width: 88px; height: 4px; border-radius: 0 0 4px 4px; background: linear-gradient(90deg, var(--lp-rose) 0%, var(--lp-rose-deep) 100%); }
.lp-tr4-score { display: flex; align-items: center; gap: 15px; padding-right: 22px; border-right: 1px solid rgba(58,43,39,.15); }
.lp-tr4-pruef { display: block; flex: none; height: 100px; width: auto; }
.lp-tr4-figs { display: flex; flex-direction: column; }
.lp-tr4-kicker { margin-bottom: 5px; font-size: 11px; line-height: 1; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; color: var(--lp-navy); opacity: .62; white-space: nowrap; }
.lp-tr4-num { font-size: 32px; line-height: 1; font-weight: 800; letter-spacing: -.02em; color: var(--lp-navy); white-space: nowrap; font-variant-numeric: tabular-nums; }
.lp-tr4-num i { font-style: normal; font-size: .54em; font-weight: 800; opacity: .55; }
.lp-tr4-meta { margin-top: 5px; font-size: 11.5px; line-height: 1.35; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--lp-navy); opacity: .78; white-space: nowrap; }
.lp-tr4-marks { display: flex; align-items: center; gap: 26px; margin: 0; padding: 0 0 0 8px; list-style: none; }
.lp-tr4-marks img { display: block; width: auto; }
.lp-tr4-oeko { height: 78px; } .lp-tr4-gots { height: 72px; }
@media (max-width: 860px) {
    .lp-tr4 { margin-top: 18px; width: 100%; }
    .lp-tr4-notes { display: none; }
    .lp-tr4-card { width: 100%; grid-template-columns: auto 1fr; column-gap: 12px; padding: 11px 14px 11px 13px; border-radius: 18px; }
    .lp-tr4-card::before { left: 16px; width: 66px; }
    .lp-tr4-score { padding-right: 12px; gap: 11px; }
    .lp-tr4-pruef { height: 72px; }
    .lp-tr4-num { font-size: 24px; }
    .lp-tr4-meta { margin-top: 4px; font-size: 11px; letter-spacing: .05em; }
    .lp-tr4-marks { gap: 14px; padding: 0; justify-content: flex-end; }
    .lp-tr4-oeko { height: 76px; } .lp-tr4-gots { height: 70px; }
}
@media (max-width: 380px) {
    .lp-tr4-card { padding-left: 11px; padding-right: 11px; column-gap: 9px; }
    .lp-tr4-score { padding-right: 9px; gap: 9px; }
    .lp-tr4-pruef { height: 64px; }
    .lp-tr4-marks { gap: 11px; }
    .lp-tr4-oeko { height: 54px; } .lp-tr4-gots { height: 50px; }
}
@media (prefers-reduced-motion: reduce) { .lp-tr4-notes { transform: none; } }

/* ————— Story: continuous gradient, half-side scene images ————— */
.lp-story { background: linear-gradient(175deg, #fffdfb 0%, var(--lp-blush) 16%, #f6dde2 30%, var(--lp-cream) 46%, #fff 56%, var(--lp-sun) 70%, #fdf1ec 86%, #f5d9de 100%); }
.lp-scene { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: hidden; }
.lp-scene-media { position: absolute; top: 0; bottom: 0; right: 0; width: 62%; -webkit-mask-image: linear-gradient(270deg, #000 0%, #000 52%, transparent 99%), linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(270deg, #000 0%, #000 52%, transparent 99%), linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); mask-composite: intersect; }
.lp-scene.img-left .lp-scene-media { right: auto; left: 0; -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 52%, transparent 99%), linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); mask-image: linear-gradient(90deg, #000 0%, #000 52%, transparent 99%), linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); }
.lp-scene-media img, .lp-scene-media video { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); }
.lp-js .lp-scene .lp-scene-media img { transform: scale(1.09); }
.lp-js .lp-scene.in .lp-scene-media img { animation: lp-kb 14s cubic-bezier(.19,.5,.32,1) forwards; }
@keyframes lp-kb { from { transform: scale(1.09); } to { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .lp-js .lp-scene .lp-scene-media img { transform: none; animation: none !important; } }
.lp-scene-content { position: relative; z-index: 2; width: 100%; max-width: 1240px; margin: 0 auto; padding: clamp(72px, 11vh, 130px) clamp(20px, 5vw, 48px); }
.lp-sc-inner { max-width: 520px; display: flex; flex-direction: column; align-items: flex-start; }
.lp-scene.img-left .lp-sc-inner { margin-left: auto; }
.lp-sc-kicker, .lp-ch-kicker { display: inline-flex; align-items: center; gap: .55em; font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--lp-rose-deep); }
.lp-sc-kicker::before { content: ''; width: 30px; height: 2px; background: var(--lp-rose); border-radius: 2px; }
.lp-sc-kicker.sage { color: var(--lp-sage-deep); } .lp-sc-kicker.sage::before { background: var(--lp-sage-deep); }
.lp-scene h2, .lp-pruef h2, .lp-forest h2, .lp-h2 { margin: .35em 0 .4em; font-size: clamp(32px, 4.6vw, 58px); line-height: 1.05; font-weight: 800; letter-spacing: -.015em; color: var(--lp-cocoa); text-wrap: balance; }
.lp-sc-copy strong, .lp-pruef p strong, .lp-copy strong { font-weight: 800; color: var(--lp-cocoa); }
.lp-scene p.lp-sc-copy, .lp-copy { font-size: clamp(16px, 1.9vw, 19.5px); line-height: 1.62; color: var(--lp-cocoa-soft); max-width: 32em; }
.lp-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.lp-chips li { display: inline-flex; align-items: center; gap: .6em; font-size: 14px; font-weight: 700; color: var(--lp-cocoa); background: rgba(255,255,255,.85); border: 1px solid #f0d3d8; border-radius: 999px; padding: .5em 1.05em .5em .9em; box-shadow: 0 4px 14px -8px rgba(157,90,102,.35); }
.lp-chips li::before { content: ''; flex: 0 0 auto; width: .42em; height: .78em; margin-top: -.22em; border: solid var(--lp-rose-deep); border-width: 0 .19em .19em 0; transform: rotate(45deg); }
.lp-chips li.lp-chip-bio { color: var(--lp-sage-ink); background: var(--lp-sage); border-color: #b9d9ac; }
.lp-chips li.lp-chip-bio::before { border-color: #4c8a3f; }
.lp-seals { display: flex; align-items: center; gap: 24px; margin-top: 24px; flex-wrap: wrap; }
.lp-seals img { height: 92px; width: auto; }
.lp-seals img[src*="pruefengel"] { height: 118px; }
.lp-steps { display: grid; gap: 14px; margin: 26px 0 0; padding: 0; list-style: none; max-width: 460px; }
.lp-steps li { display: flex; align-items: center; gap: 12px; font-size: 16.5px; font-weight: 700; color: var(--lp-cocoa); }
.lp-steps svg { flex: 0 0 auto; color: var(--lp-rose-deep); }
.lp-eco { display: inline-flex; align-items: center; gap: 10px; margin: 18px 0 0; padding: .68em 1.25em; background: var(--lp-sage); border-radius: 999px; font-size: 14.5px; font-weight: 700; color: var(--lp-sage-deep); box-shadow: 0 8px 22px -14px rgba(61,107,52,.55); }
.lp-eco svg { flex: 0 0 auto; }
.lp-flag { display: inline-flex; align-items: center; gap: 10px; margin: 18px 0 0; padding: .62em 1.15em .62em .8em; background: #fff; border: 1px solid #f0d3d8; border-radius: 999px; font-size: 14.5px; font-weight: 800; color: var(--lp-cocoa); box-shadow: 0 8px 22px -14px rgba(58,43,39,.4); }
.lp-flag i { display: inline-block; width: 26px; height: 17px; border-radius: 3px; background: linear-gradient(180deg, #000 0 33%, #dd0000 33% 66%, #ffce00 66%); box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.lp-minky { display: block; margin-top: 22px; width: clamp(150px, 18vw, 260px); height: auto; filter: drop-shadow(0 8px 16px rgba(55,40,35,.18)); }
.lp-chiprow { display: contents; }
@media (min-width: 861px) {
    .lp-chiprow-side { display: flex; align-items: center; gap: 26px; }
    .lp-chiprow-side .lp-chips { flex: 1 1 0; min-width: 0; }
    .lp-chiprow-side .lp-minky { flex: 0 0 auto; width: clamp(150px, 15vw, 190px); margin-top: 24px; }
}
@media (max-width: 860px) {
    .lp-chiprow { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; width: 100%; align-self: stretch; }
    .lp-chiprow .lp-chips, .lp-chiprow .lp-steps { flex: 1 1 0; min-width: 0; }
    .lp-chiprow .lp-chips { flex-direction: column; align-items: flex-start; gap: 8px; }
    .lp-chiprow .lp-steps { gap: 10px; }
    .lp-chiprow .lp-steps li { line-height: 1.3; align-items: flex-start; }
    .lp-chiprow .lp-steps svg { margin-top: 1px; }
    .lp-chiprow .lp-minky { flex: 0 0 auto; width: clamp(112px, 34vw, 134px); margin-top: 0; margin-left: auto; }
    .lp-chiprow .lp-eco-above { order: 3; flex: 1 0 100%; margin-top: 4px; }
    .lp-scene { display: block; min-height: 0; }
    .lp-scene-media, .lp-scene.img-left .lp-scene-media { position: relative; inset: auto; width: 100%; height: 54svh; -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 68%, transparent 100%); -webkit-mask-composite: source-over; mask-image: linear-gradient(180deg, #000 0%, #000 68%, transparent 100%); mask-composite: add; }
    .lp-scene-content { padding-top: 0; margin-top: -8svh; }
    .lp-sc-inner, .lp-scene.img-left .lp-sc-inner { max-width: none; margin: 0; }
}

/* ————— Kapok / Regenwald — dunkle Vollbild-Sektion ————— */
/* 20.10.: weniger Text, mehr Film. Der Block sitzt unten links und nimmt hoechstens
   die linke Haelfte; die Abdunklung haelt sich an ihn, der Rest des Films bleibt frei. */
.lp-forest { position: relative; isolation: isolate; color: #fff; min-height: 92svh; display: flex; align-items: flex-end; overflow: hidden; background: var(--lp-forest); }
.lp-forest > img, .lp-forest > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); z-index: -2; }
.lp-forest::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(14,30,21,.9) 0%, rgba(14,30,21,.8) 30%, rgba(14,30,21,.46) 48%, rgba(14,30,21,.1) 62%, rgba(14,30,21,0) 74%), linear-gradient(0deg, rgba(14,30,21,.72) 0%, rgba(14,30,21,.2) 34%, rgba(14,30,21,0) 52%); }
.lp-forest-inner { position: relative; z-index: 1; width: 100%; max-width: 1240px; margin: 0 auto; padding: clamp(72px, 11vh, 130px) clamp(20px, 5vw, 48px) clamp(56px, 9vh, 100px); }
.lp-forest-inner > * { max-width: 660px; }
.lp-forest .lp-sc-kicker { color: #d4efc2; text-shadow: 0 1px 3px rgba(0,0,0,.55); } .lp-forest .lp-sc-kicker::before { background: #d4efc2; }
.lp-forest h2 { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.35), 0 2px 26px rgba(0,0,0,.45); }
.lp-forest p { margin: 0; color: #f1f6ef; font-size: clamp(16px, 1.8vw, 19px); line-height: 1.6; max-width: 30em; text-shadow: 0 1px 3px rgba(0,0,0,.6); }
.lp-forest p strong { color: #fff; font-weight: 800; }
.lp-forest-facts { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 24px 0 0; padding: 18px 0 0; list-style: none; border-top: 1px solid rgba(255,255,255,.3); }
.lp-forest-facts li { display: flex; align-items: baseline; gap: 8px; text-shadow: 0 1px 3px rgba(0,0,0,.55); }
.lp-forest-facts b { font-size: clamp(20px, 2.2vw, 26px); font-weight: 800; letter-spacing: -.02em; color: #fff; line-height: 1; }
.lp-forest-facts span { font-size: 13.5px; font-weight: 700; color: #e2eedc; line-height: 1.3; }
/* Handy: der Film steht frei oben, der Text darunter auf dem Waldgruen -- vorher lag
   der ganze Block auf dem Film und deckte ihn fast vollstaendig zu. */
@media (max-width: 860px) {
    .lp-forest { display: block; min-height: 0; }
    .lp-forest > img, .lp-forest > video { position: relative; inset: auto; display: block; height: 62svh; }
    .lp-forest::after { background: linear-gradient(180deg, rgba(31,58,42,0) 0, rgba(31,58,42,0) 40svh, var(--lp-forest) 62svh); }
    .lp-forest-inner { margin-top: -16svh; padding-top: 0; padding-bottom: 56px; }
    .lp-forest-facts { gap: 8px 18px; }
    .lp-forest-facts b { font-size: 19px; }
    .lp-forest-facts span { font-size: 12.5px; }
}

/* ————— Vergleich Kapok vs Polyester ————— */
.lp-compare { max-width: 1100px; margin: 0 auto; padding: clamp(56px, 8vh, 100px) clamp(20px, 5vw, 48px); }
.lp-compare-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 28px; }
.lp-compare-col { border-radius: 22px; padding: 26px 26px 22px; background: #fff; border: 1px solid #f0d3d8; box-shadow: 0 14px 34px -22px rgba(157,90,102,.5); }
.lp-compare-col.good { background: linear-gradient(180deg, #fff 0%, var(--lp-sage) 100%); border-color: #b9d9ac; }
.lp-compare-col h3 { margin: 0 0 6px; font-size: 20px; font-weight: 800; }
.lp-compare-col.good h3 { color: var(--lp-sage-ink); } .lp-compare-col.bad h3 { color: #9d4a4a; }
.lp-compare-col p.sub { margin: 0 0 16px; font-size: 14px; color: var(--lp-cocoa-soft); }
.lp-compare-col ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.lp-compare-col li { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; line-height: 1.45; color: var(--lp-cocoa); }
.lp-compare-col li::before { content: ''; flex: none; margin-top: .35em; width: .45em; height: .8em; border: solid var(--lp-sage-deep); border-width: 0 .2em .2em 0; transform: rotate(45deg); }
.lp-compare-col.bad li::before { width: .7em; height: .7em; margin-top: .3em; border: 0; transform: none; background: linear-gradient(45deg, transparent 42%, #b85c5c 42% 58%, transparent 58%), linear-gradient(-45deg, transparent 42%, #b85c5c 42% 58%, transparent 58%); }
@media (max-width: 720px) { .lp-compare-grid { grid-template-columns: 1fr; } }

/* ————— Prüfengel section ————— */
.lp-pruef { position: relative; overflow: hidden; display: flex; align-items: center; min-height: 72svh; padding: clamp(56px, 8vh, 100px) 0; }
.lp-pruef-wm { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .55; pointer-events: none; user-select: none; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%); }
.lp-pruef-inner { position: relative; z-index: 1; width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 clamp(20px, 5vw, 48px); }
.lp-pruef-score { display: flex; align-items: baseline; gap: 12px; margin: .1em 0 .15em; font-weight: 800; letter-spacing: -.02em; line-height: 1; color: var(--lp-rose-deep); font-size: clamp(84px, 13vw, 168px); }
.lp-pruef-score small { font-size: .32em; font-weight: 800; color: var(--lp-cocoa); }
.lp-pruef p { font-size: clamp(16px, 1.9vw, 19.5px); line-height: 1.62; color: var(--lp-cocoa-soft); max-width: 34em; }
.lp-pruef-cols { display: grid; align-items: center; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "copy copy" "cta badge"; column-gap: 14px; row-gap: 18px; }
.lp-pruef-copy { grid-area: copy; min-width: 0; }
.lp-pruef-link { grid-area: cta; justify-self: start; }
.lp-pruef-badge { grid-area: badge; justify-self: end; width: clamp(120px, 34vw, 170px); height: auto; filter: drop-shadow(0 18px 34px rgba(43,28,25,.18)); }
@media (min-width: 861px) { .lp-pruef-cols { grid-template-areas: "copy badge" "cta badge"; column-gap: clamp(28px, 5vw, 72px); row-gap: 26px; } .lp-pruef-badge { width: clamp(260px, 30vw, 420px); } }
@media (max-width: 860px) { .lp-pruef-link { font-size: 14px; padding: .75em .95em; } .lp-pruef-cols { column-gap: 10px; } .lp-pruef-wm { width: 72vw; right: -12%; bottom: 3%; opacity: .06; } }
.lp-pruef-facts { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 14px 0 0; padding: 0; list-style: none; font-size: 14px; color: var(--lp-cocoa-soft); }
.lp-pruef-facts b { color: var(--lp-cocoa); font-weight: 800; }

/* ————— Anwendungen (Stillen / Babynest / Seitenschläfer / Erholung) ————— */
.lp-uses { max-width: 1240px; margin: 0 auto; padding: clamp(56px, 8vh, 100px) clamp(20px, 5vw, 48px); }
.lp-uses-head { text-align: center; max-width: 720px; margin: 0 auto 32px; }
.lp-uses-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.lp-use { position: relative; border-radius: 22px; overflow: hidden; aspect-ratio: 3 / 4; background: var(--lp-blush); box-shadow: 0 16px 40px -24px rgba(58,43,39,.45); }
.lp-use img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); transition: transform .6s ease; }
.lp-use:hover img { transform: scale(1.04); }
.lp-use figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 60px 18px 18px; background: linear-gradient(180deg, rgba(43,28,25,0) 0%, rgba(43,28,25,.78) 100%); color: #fff; }
.lp-use figcaption b { display: block; font-size: 18px; font-weight: 800; }
.lp-use figcaption span { display: block; margin-top: 3px; font-size: 13.5px; color: #f6e8e4; line-height: 1.4; }
.lp-use-tag { position: absolute; top: 14px; left: 14px; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; padding: .45em .8em; border-radius: 999px; background: rgba(255,253,251,.92); color: var(--lp-rose-deep); }
@media (max-width: 980px) { .lp-uses-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
@media (max-width: 400px) { .lp-use figcaption b { font-size: 15.5px; } .lp-use figcaption span { font-size: 12.5px; } }

/* ————— Perkal vs Strick ————— */
.lp-fabric { max-width: 1240px; margin: 0 auto; padding: clamp(56px, 8vh, 100px) clamp(20px, 5vw, 48px); }
.lp-fabric-head { text-align: center; max-width: 760px; margin: 0 auto 30px; }
.lp-fabric-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.lp-fabric-card { display: grid; grid-template-rows: auto 1fr; background: #fff; border: 1px solid #f0d3d8; border-radius: 24px; overflow: hidden; box-shadow: 0 18px 44px -26px rgba(157,90,102,.55); }
.lp-fabric-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; object-position: var(--pos, center); display: block; }
.lp-fabric-body { padding: 22px 24px 24px; display: flex; flex-direction: column; gap: 10px; }
.lp-fabric-body h3 { margin: 0; font-size: 24px; font-weight: 800; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.lp-fabric-body h3 small { font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--lp-rose-deep); background: var(--lp-blush); padding: .4em .8em; border-radius: 999px; }
.lp-fabric-body p { margin: 0; font-size: 15.5px; line-height: 1.55; color: var(--lp-cocoa-soft); }
.lp-temp { display: inline-flex; align-items: baseline; gap: 8px; margin-top: 6px; font-weight: 800; color: var(--lp-cocoa); }
.lp-temp b { font-size: clamp(34px, 4vw, 44px); line-height: 1; letter-spacing: -.02em; color: var(--lp-rose-deep); }
.lp-temp span { font-size: 14px; color: var(--lp-cocoa-soft); font-weight: 700; }
.lp-fabric-body ul { margin: 6px 0 0; padding: 0; list-style: none; display: grid; gap: 7px; }
.lp-fabric-body li { display: flex; gap: 9px; font-size: 14.5px; color: var(--lp-cocoa); line-height: 1.4; }
.lp-fabric-body li::before { content: ''; flex: none; margin-top: .4em; width: .4em; height: .72em; border: solid var(--lp-rose-deep); border-width: 0 .18em .18em 0; transform: rotate(45deg); }
.lp-fabric-body .lp-btn { align-self: flex-start; margin-top: 8px; font-size: 15px; padding: .75em 1.4em; }
.lp-fabric-swatches { display: flex; gap: 8px; margin-top: 4px; }
.lp-fabric-swatches i { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(58,43,39,.18); }
@media (max-width: 720px) { .lp-fabric-grid { grid-template-columns: 1fr; } .lp-fabric-card img { aspect-ratio: 16 / 10; } }

/* ————— Garantie: 30 Tage Probestillen ————— */
.lp-guarantee { position: relative; overflow: hidden; background: linear-gradient(180deg, #fff 0%, var(--lp-blush) 100%); border-top: 1px solid #f0d3d8; border-bottom: 1px solid #f0d3d8; padding: clamp(56px, 8vh, 100px) clamp(20px, 5vw, 48px); text-align: center; }
.lp-guarantee-inner { max-width: 760px; margin: 0 auto; }
.lp-guarantee-heart { display: inline-grid; place-items: center; width: 74px; height: 74px; border-radius: 50%; background: #fff; box-shadow: 0 14px 34px -18px rgba(157,90,102,.6); color: var(--lp-rose); margin-bottom: 14px; }
.lp-guarantee h2 { margin: .2em 0 .4em; }
.lp-guarantee p { margin: 0 auto; font-size: clamp(15.5px, 1.8vw, 18.5px); line-height: 1.62; color: var(--lp-cocoa-soft); max-width: 36em; }
.lp-guarantee p + p { margin-top: 12px; }
/* 20.10.: drei Kreise auf einem gestrichelten Weg statt drei Kaesten. Die Linie laeuft
   als ::after vom rechten Rand des einen Kreises zum linken des naechsten (gap 0, damit
   die Rechnung in % aufgeht); der weisse Ring um jeden Kreis schneidet sie sauber ab. */
.lp-guarantee-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 36px auto 0; padding: 0; list-style: none; max-width: 780px; }
.lp-guarantee-steps li { position: relative; display: flex; flex-direction: column; align-items: center; padding: 0 14px; text-align: center; }
.lp-guarantee-steps li:not(:last-child)::after { content: ''; position: absolute; top: 39px; left: calc(50% + 48px); right: calc(-50% + 48px); height: 2px; background: repeating-linear-gradient(90deg, #e3aab4 0 7px, transparent 7px 13px); }
.lp-guarantee-steps b { display: grid; place-items: center; width: 78px; height: 78px; border-radius: 50%; background: linear-gradient(140deg, #d796a3 0%, var(--lp-rose-deep) 100%); color: #fff; font-size: 27px; line-height: 1; font-weight: 800; letter-spacing: -.02em; white-space: nowrap; box-shadow: 0 0 0 6px #fff, 0 16px 30px -12px rgba(157,90,102,.7); }
.lp-guarantee-steps strong { display: block; margin-top: 16px; font-size: 18px; font-weight: 800; color: var(--lp-cocoa); }
.lp-guarantee-steps span { display: block; margin-top: 4px; max-width: 15em; font-size: 14.5px; font-weight: 600; line-height: 1.4; color: var(--lp-cocoa-soft); }
/* Handy: derselbe Weg senkrecht, Kreis links, Text rechts. */
@media (max-width: 640px) {
    .lp-guarantee-steps { grid-template-columns: 1fr; max-width: 360px; }
    .lp-guarantee-steps li { display: grid; grid-template-columns: 62px 1fr; column-gap: 16px; align-items: center; padding: 0 0 22px; text-align: left; }
    .lp-guarantee-steps li:last-child { padding-bottom: 0; }
    .lp-guarantee-steps li:not(:last-child)::after { top: 70px; bottom: 6px; left: 30px; right: auto; width: 2px; height: auto; background: repeating-linear-gradient(180deg, #e3aab4 0 6px, transparent 6px 11px); }
    .lp-guarantee-steps b { grid-row: span 2; width: 62px; height: 62px; font-size: 21px; box-shadow: 0 0 0 5px #fff, 0 12px 24px -12px rgba(157,90,102,.7); }
    .lp-guarantee-steps strong { margin-top: 0; align-self: end; font-size: 16.5px; }
    .lp-guarantee-steps span { align-self: start; max-width: none; font-size: 14px; }
}

/* ————— Bekannt von Babymessen ————— */
.lp-messen { padding: clamp(40px, 6vh, 64px) clamp(20px, 5vw, 48px); background: #fff; border-top: 1px solid #f4e6e9; border-bottom: 1px solid #f4e6e9; }
.lp-messen-inner { max-width: 1100px; margin: 0 auto; text-align: center; }
.lp-messen h2 { margin: 0 0 22px; font-size: 13px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--lp-rose-deep); }
.lp-messen-grid { display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; gap: 24px 28px; }
.lp-messen-grid img { max-height: 64px; max-width: 100%; width: auto; margin: 0 auto; object-fit: contain; opacity: .82; transition: opacity .2s ease; display: block; }
.lp-messen-grid img:hover { opacity: 1; }
@media (max-width: 720px) { .lp-messen-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } .lp-messen-grid img { max-height: 50px; } }

/* ————— Bewertungen (Shop) ————— */
.lp-revs { position: relative; background: linear-gradient(180deg, #fffdfb 0%, var(--lp-blush) 46%, #fffdfb 100%); padding: clamp(64px, 9vh, 108px) clamp(20px, 5vw, 48px); }
.lp-revs-inner { max-width: 1200px; margin: 0 auto; }
.lp-revs-head { text-align: center; margin-bottom: clamp(32px, 5vh, 52px); }
.lp-revs-head .lp-sc-kicker { justify-content: center; }
.lp-revs-score { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.lp-revs-num { font-size: clamp(56px, 8vw, 96px); line-height: 1; font-weight: 800; letter-spacing: -.03em; color: var(--lp-rose-deep); }
.lp-stars { position: relative; display: inline-block; font-size: clamp(22px, 3vw, 30px); line-height: 1; letter-spacing: .12em; }
.lp-stars span { display: block; white-space: nowrap; }
.lp-stars-bg { color: #e3d3cf; }
.lp-stars-fg { position: absolute; inset: 0; overflow: hidden; color: #e8a33d; }
.lp-revs-count { display: inline-flex; align-items: center; gap: .4em; flex-wrap: wrap; justify-content: center; font-size: clamp(15px, 1.8vw, 18px); color: var(--lp-cocoa-soft); }
.lp-revs-count strong { font-weight: 800; color: var(--lp-cocoa); }
.lp-revs-grid { display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 0; list-style: none; }
.lp-rev { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid #f2dee1; border-radius: 20px; padding: 22px 24px 20px; box-shadow: 0 14px 34px -22px rgba(157,90,102,.55); }
.lp-rev .lp-stars { font-size: 17px; letter-spacing: .08em; }
.lp-rev-body { margin: 0; font-size: 15px; line-height: 1.6; color: var(--lp-cocoa-soft); }
.lp-rev-by { margin: auto 0 0; padding-top: 6px; font-size: 13px; color: var(--lp-cocoa-soft); }
.lp-rev-by b { font-weight: 800; color: var(--lp-cocoa); }
.lp-rev-verified { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-size: 12.5px; font-weight: 700; color: var(--lp-sage-deep); }
.lp-revs-foot { margin: clamp(24px, 4vh, 36px) 0 0; text-align: center; font-size: 13px; line-height: 1.5; color: var(--lp-cocoa-soft); }
.lp-revs-foot a { color: var(--lp-rose-deep); }
@media (max-width: 980px) { .lp-revs-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 860px) { .lp-revs { padding-top: clamp(44px, 7vh, 72px); padding-bottom: clamp(44px, 7vh, 72px); } .lp-revs-grid { grid-template-columns: 1fr; gap: 14px; } .lp-rev { padding: 18px 18px 16px; border-radius: 16px; } .lp-rev-body { font-size: 14.5px; } }

/* ————— Farbregal-Brücke ————— */
.lp-shelf { position: relative; overflow: hidden; }
.lp-shelf > img { display: block; width: 100%; height: auto; }
@media (min-width: 861px) { .lp-shelf { min-height: 92svh; } .lp-shelf > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; } }
.lp-shelf::before, .lp-shelf::after { content: ''; position: absolute; left: 0; right: 0; height: clamp(60px, 10vh, 120px); z-index: 1; pointer-events: none; }
.lp-shelf::before { top: 0; background: linear-gradient(180deg, #f5d9de, rgba(245,217,222,0)); }
.lp-shelf::after { bottom: 0; background: linear-gradient(0deg, #f5d9de, rgba(245,217,222,0)); }
.lp-shelf-overlay { position: absolute; left: 0; right: 0; bottom: clamp(30px, 7vh, 88px); z-index: 2; text-align: center; padding: 0 20px; }
.lp-shelf-overlay h2 { margin: 0 0 .35em; font-size: clamp(30px, 4.6vw, 54px); font-weight: 800; letter-spacing: -.015em; color: var(--lp-cocoa); text-shadow: 0 1px 0 rgba(255,253,251,.75), 0 2px 20px rgba(255,253,251,.6); }
@media (max-width: 860px) { .lp-shelf { min-height: 70svh; } .lp-shelf > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .lp-shelf-overlay { bottom: clamp(24px, 6vh, 56px); padding: 0 16px; } }

/* ————— Shop grid ————— */
.lp-shop { position: relative; background: radial-gradient(1100px 500px at 85% -80px, rgba(232,182,76,.16), transparent 65%), linear-gradient(180deg, #f5d9de 0%, var(--lp-cream) 26%, #fff 100%); padding: clamp(72px, 10vh, 120px) clamp(20px, 5vw, 48px) clamp(48px, 7vh, 96px); }
.lp-shop-head { max-width: 1200px; margin: 0 auto 8px; text-align: center; }
.lp-shop-head h2 { font-size: clamp(30px, 4.4vw, 50px); font-weight: 800; letter-spacing: -.015em; margin: 0 0 .25em; }
.lp-shop-head p { color: var(--lp-cocoa-soft); font-size: clamp(15px, 1.8vw, 18px); margin: 0 auto; max-width: 40em; }
.lp-group-label { max-width: 1200px; margin: 46px auto 18px; display: flex; align-items: center; gap: 14px; font-size: 15px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--lp-rose-deep); }
.lp-group-label small { font-size: 12.5px; letter-spacing: 0; text-transform: none; font-weight: 700; color: var(--lp-cocoa-soft); }
.lp-group-label::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, #ecc7ce, transparent); }
.lp-grid { max-width: 1200px; margin: 0 auto; display: grid; gap: 18px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.lp-grid.lp-grid-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; }
@media (max-width: 560px) { .lp-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
.lp-card { position: relative; background: #fff; border: 1px solid #f3dade; border-radius: 20px; padding: 14px 14px 16px; display: flex; flex-direction: column; gap: 10px; transition: transform .3s ease, box-shadow .3s ease; }
.lp-card:hover { transform: translateY(-5px); box-shadow: 0 24px 44px -18px rgba(157,90,102,.35); }
.lp-card-img { border-radius: 14px; overflow: hidden; aspect-ratio: 1; background: var(--lp-blush); display: block; }
.lp-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.lp-card:hover .lp-card-img img { transform: scale(1.05); }
.lp-card-name { font-weight: 800; font-size: 15.5px; line-height: 1.25; }
.lp-card-name small { display: block; font-weight: 600; color: var(--lp-cocoa-soft); font-size: 12px; margin-top: 2px; }
.lp-card-price { display: flex; align-items: baseline; gap: .5em; font-size: 15px; }
.lp-card-price strong { font-size: 1.2em; font-weight: 800; color: var(--lp-rose-deep); }
.lp-card-price s { color: #b9958c; font-size: .92em; }
.lp-card .lp-btn { font-size: 14.5px; padding: .7em 1em; width: 100%; box-shadow: 0 8px 20px -8px rgba(157,90,102,.5); }
.lp-card-out { font-size: 13.5px; font-weight: 700; color: var(--lp-cocoa-soft); background: #f7f1ee; border-radius: 999px; padding: .6em 1em; text-align: center; }
.lp-card-out a { color: var(--lp-rose-deep); }
.lp-card-best { position: absolute; top: 22px; left: 22px; z-index: 1; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: .45em .8em; border-radius: 999px; background: var(--lp-rose-deep); color: #fff; box-shadow: 0 6px 16px -8px rgba(157,90,102,.8); }
.lp-shop-note { max-width: 1200px; margin: 26px auto 0; font-size: 12.5px; color: #a08a83; }
.lp-shop-usp { max-width: 1200px; margin: 18px auto 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; padding: 0; list-style: none; font-size: 13.5px; font-weight: 700; color: var(--lp-cocoa-soft); }
.lp-shop-usp li { display: inline-flex; align-items: center; gap: 6px; }
.lp-shop-usp li::before { content: ''; width: .38em; height: .7em; margin-top: -.15em; border: solid var(--lp-sage-deep); border-width: 0 .17em .17em 0; transform: rotate(45deg); }

/* ————— Specs ————— */
.lp-specs { max-width: 1100px; margin: 0 auto; padding: clamp(48px, 7vh, 88px) clamp(20px, 5vw, 48px); display: grid; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; }
.lp-specs img { width: 100%; height: auto; border-radius: 24px; display: block; }
.lp-specs dl { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 22px 0 0; }
.lp-specs dl div { background: #fff; border: 1px solid #f0d3d8; border-radius: 16px; padding: 14px 16px; }
.lp-specs dt { font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lp-rose-deep); }
.lp-specs dd { margin: 4px 0 0; font-size: 18px; font-weight: 800; color: var(--lp-cocoa); }
.lp-specs dd small { display: block; font-size: 12.5px; font-weight: 600; color: var(--lp-cocoa-soft); margin-top: 2px; }
@media (max-width: 860px) { .lp-specs { grid-template-columns: 1fr; gap: 20px; } }

/* ————— FAQ ————— */
.lp-faq { max-width: 820px; margin: 0 auto; padding: clamp(48px, 7vh, 88px) clamp(20px, 5vw, 48px); }
.lp-faq h2 { text-align: center; }
.lp-faq details { background: #fff; border: 1px solid #f0d3d8; border-radius: 16px; margin-top: 10px; overflow: hidden; }
.lp-faq summary { cursor: pointer; list-style: none; padding: 16px 52px 16px 20px; font-weight: 800; font-size: 16.5px; position: relative; color: var(--lp-cocoa); }
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after { content: ''; position: absolute; right: 20px; top: 50%; width: 10px; height: 10px; margin-top: -8px; border: solid var(--lp-rose-deep); border-width: 0 2.4px 2.4px 0; transform: rotate(45deg); transition: transform .25s ease; }
.lp-faq details[open] summary::after { transform: rotate(225deg); margin-top: -3px; }
.lp-faq details p { margin: 0; padding: 0 20px 18px; font-size: 15.5px; line-height: 1.6; color: var(--lp-cocoa-soft); }

/* ————— Timeline (Lebensphasen) ————— */
.lp-timeline { max-width: 1240px; margin: 0 auto; padding: clamp(56px, 8vh, 100px) clamp(20px, 5vw, 48px); }
.lp-tl-list { position: relative; margin: 36px 0 0; padding: 0; list-style: none; display: grid; gap: clamp(40px, 6vh, 72px); }
.lp-tl-item { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 56px); align-items: center; }
.lp-tl-item:nth-child(even) .lp-tl-media { order: 2; }
.lp-tl-media { position: relative; border-radius: 26px; overflow: hidden; aspect-ratio: 4 / 3; box-shadow: 0 24px 60px -30px rgba(58,43,39,.5); }
.lp-tl-media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); display: block; }
.lp-tl-num { position: absolute; top: 16px; left: 16px; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,253,251,.94); color: var(--lp-rose-deep); font-weight: 800; font-size: 18px; box-shadow: 0 8px 20px -10px rgba(58,43,39,.5); }
.lp-tl-body h3 { margin: .3em 0 .35em; font-size: clamp(26px, 3.4vw, 40px); line-height: 1.08; font-weight: 800; letter-spacing: -.015em; }
.lp-tl-body p { font-size: clamp(15.5px, 1.8vw, 18.5px); line-height: 1.6; color: var(--lp-cocoa-soft); max-width: 30em; }
@media (max-width: 860px) { .lp-tl-item, .lp-tl-item:nth-child(even) { grid-template-columns: 1fr; } .lp-tl-item:nth-child(even) .lp-tl-media { order: 0; } }

/* ————— Bento ————— */
.lp-bento { max-width: 1240px; margin: 0 auto; padding: clamp(24px, 4vh, 48px) clamp(20px, 5vw, 48px) clamp(56px, 8vh, 100px); display: grid; grid-template-columns: repeat(6, 1fr); grid-auto-rows: minmax(180px, auto); gap: 16px; }
.lp-tile { position: relative; overflow: hidden; border-radius: 26px; background: #fff; border: 1px solid #f0d3d8; padding: 26px; display: flex; flex-direction: column; justify-content: flex-end; min-height: 220px; box-shadow: 0 18px 44px -28px rgba(58,43,39,.45); transition: transform .35s ease, box-shadow .35s ease; }
.lp-tile:hover { transform: translateY(-4px); box-shadow: 0 26px 54px -26px rgba(58,43,39,.5); }
.lp-tile > img, .lp-tile > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); z-index: 0; }
.lp-tile.media::after { content: ''; position: absolute; inset: 0; z-index: 0; background: linear-gradient(180deg, rgba(43,28,25,0) 35%, rgba(43,28,25,.8) 100%); }
.lp-tile > * { position: relative; z-index: 1; }
.lp-tile.media { color: #fff; }
.lp-tile.media .lp-tile-kicker { color: #ffd6de; }
.lp-tile-kicker { font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--lp-rose-deep); }
.lp-tile h3 { margin: .3em 0 .25em; font-size: clamp(22px, 2.4vw, 30px); line-height: 1.1; font-weight: 800; letter-spacing: -.015em; }
.lp-tile p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--lp-cocoa-soft); }
.lp-tile.media p { color: #f6e8e4; }
.lp-tile-big { font-size: clamp(56px, 7vw, 96px); font-weight: 800; letter-spacing: -.03em; line-height: 1; color: var(--lp-rose-deep); }
.lp-tile-big small { font-size: .3em; color: var(--lp-cocoa); font-weight: 800; }
.lp-tile.sage { background: linear-gradient(160deg, #fff 0%, var(--lp-sage) 100%); border-color: #b9d9ac; }
.lp-tile.sage .lp-tile-kicker { color: var(--lp-sage-deep); }
.lp-tile.rose { background: linear-gradient(160deg, #fff 0%, var(--lp-blush) 100%); }
.lp-tile.forest { background: var(--lp-forest); color: #fff; border-color: transparent; }
.lp-tile.forest .lp-tile-kicker { color: #c9e7b6; } .lp-tile.forest p { color: #e6efe4; }
.c2 { grid-column: span 2; } .c3 { grid-column: span 3; } .c4 { grid-column: span 4; } .c6 { grid-column: span 6; } .r2 { grid-row: span 2; }
@media (max-width: 980px) { .lp-bento { grid-template-columns: repeat(2, 1fr); } .c2, .c3, .c4, .c6 { grid-column: span 2; } .lp-bento .c1m { grid-column: span 1; } }
@media (max-width: 560px) { .lp-bento { grid-template-columns: 1fr; gap: 12px; } .c2, .c3, .c4, .c6, .lp-bento .c1m { grid-column: span 1; } .lp-tile { min-height: 200px; padding: 20px; } }

/* ————— Scrolly (fixe Bühne) ————— */
.lp-scrolly { position: relative; }
.lp-scrolly-stage { position: sticky; top: 0; height: 100svh; overflow: hidden; isolation: isolate; background: var(--lp-cocoa); }
.lp-scrolly-stage img, .lp-scrolly-stage video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); opacity: 0; transition: opacity .9s ease; }
.lp-scrolly-stage img.on, .lp-scrolly-stage video.on { opacity: 1; }
.lp-scrolly-stage::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(43,28,25,.15) 0%, rgba(43,28,25,0) 35%, rgba(43,28,25,.75) 100%); }
.lp-scrolly-steps { position: relative; z-index: 2; margin-top: -100svh; }
.lp-scrolly-step { min-height: 100svh; display: flex; align-items: flex-end; padding: 0 clamp(20px, 5vw, 48px) clamp(56px, 9vh, 110px); }
.lp-scrolly-card { max-width: 560px; background: rgba(255,253,251,.94); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(196,117,133,.3); border-radius: 24px; padding: 26px 28px; box-shadow: 0 24px 60px -24px rgba(26,16,14,.6); }
.lp-scrolly-card h2 { margin: .25em 0 .3em; font-size: clamp(26px, 3.4vw, 40px); }
.lp-scrolly-card p { margin: 0; font-size: 15.5px; line-height: 1.6; color: var(--lp-cocoa-soft); }
.lp-scrolly-dots { position: fixed; right: 14px; top: 50%; transform: translateY(-50%); z-index: 40; display: grid; gap: 10px; }
.lp-scrolly-dots i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.45); box-shadow: 0 0 0 1px rgba(0,0,0,.15); transition: transform .25s, background .25s; }
.lp-scrolly-dots i.on { background: var(--lp-rose); transform: scale(1.4); }
@media (max-width: 860px) { .lp-scrolly-dots { display: none; } .lp-scrolly-card { padding: 20px 20px; } }

/* ————— Footer ————— */
.lp-footer { position: relative; overflow: hidden; isolation: isolate; background: linear-gradient(180deg, #fff 0%, #fffdfb 14%, var(--lp-cream) 42%); color: var(--lp-cocoa-soft); padding: clamp(90px, 8vw, 180px) clamp(20px, 5vw, 48px) clamp(150px, 18vw, 420px); text-align: center; }
.lp-foot-meadow { position: absolute; left: 0; right: 0; bottom: 74px; z-index: -1; display: block; width: 100%; height: auto; transform: translateY(10%); pointer-events: none; -webkit-user-select: none; user-select: none; -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 46%); mask-image: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 46%); }
.lp-foot-meadow img { display: block; width: 100%; height: auto; }
.lp-foot-inner { position: relative; max-width: 1100px; margin: 0 auto; }
.lp-footer img.lp-foot-logo { display: block; height: 54px; width: auto; margin: 0 auto 14px; }
.lp-foot-claim { margin: 0; font-size: 15px; color: var(--lp-cocoa-soft); }
.lp-footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px 10px; margin-top: 20px; }
.lp-footer nav a { background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); border-radius: 999px; padding: 6px 14px; transition: background .2s ease, color .2s ease; }
.lp-footer a { color: var(--lp-cocoa); text-decoration: none; font-size: 14px; font-weight: 600; }
.lp-footer nav a:hover { background: #fff; color: var(--lp-rose-deep); }
.lp-foot-copy { display: inline-block; margin: 28px 0 0; background: rgba(255,255,255,.62); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); border-radius: 999px; padding: 7px 17px; font-size: 13px; color: #6b5b56; }
@media (max-width: 860px) { .lp-footer { padding-bottom: 190px; } .lp-foot-meadow { bottom: 88px; } .lp-footer img.lp-foot-logo { height: 44px; } .lp-footer nav { gap: 6px 16px; } .lp-footer a { font-size: 13.5px; } }

/* ————— Sticky CTA + toast ————— */
.lp-sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 10px clamp(14px, 4vw, 28px); padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); background: rgba(255,253,251,.92); backdrop-filter: blur(10px); border-top: 1px solid #f0d3d8; box-shadow: 0 -10px 30px -12px rgba(58,43,39,.25); transform: translateY(110%); transition: transform .4s cubic-bezier(.22,.61,.36,1); }
.lp-sticky.show { transform: none; }
.lp-sticky-info { display: flex; flex-direction: column; line-height: 1.25; }
.lp-sticky-info b { font-size: 15px; }
.lp-sticky-info span { font-size: 13.5px; color: var(--lp-cocoa-soft); }
.lp-sticky-info s { color: #b9958c; }
.lp-sticky .lp-btn { font-size: 15px; padding: .75em 1.6em; white-space: nowrap; }
.lp-sticky-shop { font-size: 14.5px; font-weight: 700; white-space: nowrap; color: var(--lp-rose-deep); text-decoration: none; border-bottom: 2px solid #f0d3d8; }
.lp-sticky-shop:hover { border-bottom-color: var(--lp-rose-deep); }
@media (min-width: 720px) { .lp-sticky-info { flex-direction: row; align-items: baseline; gap: 12px; } }
.lp-toast { position: fixed; left: 50%; bottom: 84px; transform: translate(-50%, 20px); background: #7f1d1d; color: #fff; font-size: 14px; font-weight: 600; border-radius: 12px; padding: .8em 1.3em; z-index: 60; opacity: 0; pointer-events: none; transition: opacity .3s ease, transform .3s ease; }
.lp-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ————— Mit Shop-Navigation (?nav=1) ————— */
.lp-has-nav .lp-mast { display: none; }
.lp-has-nav .lp-hero { min-height: calc(100svh - var(--lp-navh, 176px)); }
@media (max-width: 767px) { .lp-has-nav { --lp-navh: 150px; } }
.lp-has-nav header { position: sticky; top: 0; }
html.lp-has-nav { scroll-padding-top: var(--lp-navh, 176px); }
.lp-has-nav footer { padding-bottom: 110px; }
.lp-has-nav .mm-foot-meadow { bottom: 74px; }
@media (max-width: 860px) { .lp-has-nav footer { padding-bottom: 130px; } .lp-has-nav .mm-foot-meadow { bottom: 88px; } }
/* Header, Footer und Warenkorb kommen aus den Shop-Partials und tragen Schrift
   und Farbe des Shops — sonst erben sie Nunito/Kakao vom LP-body und wirken
   groesser als auf allen anderen Seiten. Font-Stack = Tailwinds html-Regel. */
.lp-has-nav > header, .lp-has-nav > footer, #cart-drawer-container { font-family: ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'; }
.lp-has-nav > header, #cart-drawer-container { color: #1f2937; }

/* ————— Generic section wrapper ————— */
.lp-section { max-width: 1240px; margin: 0 auto; padding: clamp(56px, 8vh, 100px) clamp(20px, 5vw, 48px); }
.lp-section-head { text-align: center; max-width: 760px; margin: 0 auto 30px; }
.lp-section-head .lp-sc-kicker { justify-content: center; }
.lp-center { text-align: center; }
.lp-center .lp-sc-kicker { justify-content: center; }
.lp-cta-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 22px; }

/* ————— Film-Szene (Manufaktur): das Video fuellt die Sektion, der Text liegt auf einer Karte ————— */
/* Die Frau mit dem Kissen steht im Film rechts der Mitte; bei Cover-Zuschnitt laesst sie sich nicht nach links holen -- also Karte links, Film rechts frei. */
.lp-scene--film .lp-scene-media, .lp-scene.img-left.lp-scene--film .lp-scene-media { left: 0; right: 0; width: 100%; -webkit-mask-image: none; mask-image: none; } /* kein Verlauf oben/unten (Inhaber 02.11.2026) */
.lp-scene--film .lp-sc-inner { margin-left: 0; max-width: 540px; padding: clamp(22px, 3vw, 36px); border-radius: 24px; background: rgba(253,246,240,.9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); box-shadow: 0 34px 80px -44px rgba(58,43,39,.55); }
/* Plastikfrei-Kasten */
.lp-eco-claim { margin: 22px 0 0; padding: 16px 18px 18px; border-radius: 18px; background: var(--lp-sage); color: var(--lp-sage-ink); }
.lp-eco-claim h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 17px; font-weight: 800; color: var(--lp-sage-deep); }
.lp-eco-claim h3 svg { color: #4c8a3f; }
.lp-eco-claim ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lp-eco-claim li { display: flex; align-items: flex-start; gap: 10px; font-size: 14.5px; font-weight: 700; line-height: 1.35; }
.lp-eco-claim li svg { flex: 0 0 auto; margin-top: 1px; color: #4c8a3f; }
@media (max-width: 860px) {
    .lp-scene--film .lp-scene-media, .lp-scene.img-left.lp-scene--film .lp-scene-media { height: 60svh; }
    .lp-scene--film .lp-sc-inner { margin: -12svh 0 0; }
}

/* ═══════════════════════════════════════════════════════════════════════
   22.09.2026 — Nachbesserung nach der Sichtpruefung (UEBERGABE-STILLKISSEN-LP-VIDEOS.md §10)
   Vergleich mit Bildern · Anwendungen volle Breite · Perkal/Strick neu · Farbregal mit
   Aussage · Shop-Kopf mit Symbolen · Ersatzbezuege als Sektion · Massblatt als HTML
   ═══════════════════════════════════════════════════════════════════════ */

/* ————— Vergleich: je ein Bild ueber der Spalte ————— */
.lp-compare-col { padding: 0; overflow: hidden; }
.lp-compare-body { padding: 22px 26px 24px; }
.lp-compare-fig { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--lp-blush); }
.lp-compare-fig img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, center); display: block; }
.lp-compare-fig figcaption { position: absolute; left: 16px; bottom: 14px; display: inline-flex; align-items: center; gap: 6px; padding: .45em .9em; border-radius: 999px; font-size: 12.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; background: rgba(255,253,251,.94); color: var(--lp-sage-ink); box-shadow: 0 6px 16px -8px rgba(26,16,14,.5); }
.lp-compare-col.bad .lp-compare-fig figcaption { color: #9d4a4a; }
.lp-compare-fig figcaption svg { flex: 0 0 auto; }

/* ————— Anwendungen: volle Breite statt zentriert ————— */
.lp-uses { max-width: none; padding-left: clamp(12px, 2vw, 32px); padding-right: clamp(12px, 2vw, 32px); }
.lp-uses-grid { gap: clamp(12px, 1.5vw, 22px); }
.lp-use { aspect-ratio: 4 / 5; }
@media (min-width: 1400px) { .lp-use figcaption { padding: 72px 22px 22px; } .lp-use figcaption b { font-size: 21px; } .lp-use figcaption span { font-size: 15px; } }

/* ————— Perkal oder Strick: Waschszene + Temperatur-Plakette + Stoffbild ————— */
.lp-fabric-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--lp-blush); }
.lp-fabric-media > img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; object-position: var(--pos, center); display: block; }
.lp-fabric-temp { position: absolute; left: 18px; top: 18px; display: inline-flex; flex-direction: column; align-items: flex-start; padding: 10px 16px 9px; border-radius: 16px; background: rgba(255,253,251,.95); color: var(--lp-cocoa); box-shadow: 0 12px 28px -14px rgba(26,16,14,.6); }
.lp-fabric-temp b { font-size: 30px; line-height: 1; font-weight: 800; letter-spacing: -.02em; color: var(--lp-rose-deep); }
.lp-fabric-temp span { margin-top: 3px; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lp-cocoa-soft); }
/* Der runde Ausschnitt zoomt per CSS in den Kissen-Master (transform-origin = Stoffstelle); die Datei bleibt unangetastet. */
.lp-fabric-swatch { position: absolute; right: 18px; bottom: 18px; width: clamp(88px, 11vw, 124px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; border: 4px solid #fff; box-shadow: 0 14px 30px -14px rgba(26,16,14,.7); background: var(--lp-cream); }
.lp-fabric-swatch img { width: 100%; height: 100%; aspect-ratio: auto; object-fit: cover; transform: scale(2.6); transform-origin: var(--sw-pos, center); display: block; }
.lp-fabric-swatch i { position: absolute; left: 0; right: 0; bottom: 0; padding: 4px 0 7px; text-align: center; font-style: normal; font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff; background: linear-gradient(180deg, rgba(43,28,25,0), rgba(43,28,25,.62)); }
.lp-fabric-specs { display: grid; gap: 0; margin: 4px 0 0; }
.lp-fabric-specs div { display: grid; grid-template-columns: 118px 1fr; gap: 10px; align-items: baseline; padding: 9px 0; border-top: 1px solid #f4e6e9; }
.lp-fabric-specs dt { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lp-rose-deep); }
.lp-fabric-specs dt svg { flex: 0 0 auto; }
.lp-fabric-specs dd { margin: 0; font-size: 14.5px; line-height: 1.4; color: var(--lp-cocoa); }
.lp-fabric-specs dd strong { font-weight: 800; }
.lp-fabric-specs .lp-fabric-swatches { display: inline-flex; margin: 0 0 0 10px; vertical-align: middle; }
@media (max-width: 720px) { .lp-fabric-media { aspect-ratio: 16 / 10; } .lp-fabric-specs div { grid-template-columns: 100px 1fr; } .lp-fabric-temp b { font-size: 24px; } .lp-fabric-swatch { width: 84px; } }

/* ————— Farbregal: Aussage statt nur Ueberschrift ————— */
.lp-shelf-overlay { padding: 0 clamp(20px, 5vw, 48px); }
.lp-shelf-overlay .lp-sc-kicker { justify-content: center; text-shadow: 0 1px 0 rgba(255,253,251,.8); }
.lp-shelf-copy { max-width: 34em; margin: 0 auto 14px; font-size: clamp(15px, 1.8vw, 18px); line-height: 1.55; color: var(--lp-cocoa-soft); text-shadow: 0 1px 0 rgba(255,253,251,.85), 0 2px 18px rgba(255,253,251,.75); }
.lp-shelf-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 18px; padding: 0; list-style: none; }
.lp-shelf-facts li { display: inline-flex; align-items: center; gap: 7px; padding: .5em 1em .5em .85em; border-radius: 999px; font-size: 13.5px; font-weight: 700; color: var(--lp-cocoa); background: rgba(255,253,251,.9); border: 1px solid rgba(196,117,133,.28); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); box-shadow: 0 6px 16px -10px rgba(26,16,14,.4); }
.lp-shelf-facts svg { color: var(--lp-rose-deep); flex: 0 0 auto; }
/* Textfreier Master: der Text liegt oben auf der leeren Wand, links buendig; die Kissen unten bleiben frei. */
.lp-shelf--clean .lp-shelf-overlay { top: clamp(36px, 9vh, 110px); bottom: auto; left: 0; right: 0; max-width: 1200px; margin: 0 auto; display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.lp-shelf--clean .lp-shelf-overlay .lp-sc-kicker { justify-content: flex-start; }
.lp-shelf--clean .lp-shelf-copy { margin: 0 0 14px; }
.lp-shelf--clean .lp-shelf-facts { justify-content: flex-start; }
@media (max-width: 860px) { .lp-shelf--clean .lp-shelf-overlay { top: 28px; } .lp-shelf-facts li { font-size: 12.5px; } }

/* ————— Shop-Kopf: Fakten mit Symbol ————— */
.lp-shop-facts { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 10px; margin: 10px auto 0; padding: 0; list-style: none; max-width: 1200px; }
.lp-shop-facts li { display: inline-flex; align-items: center; gap: 7px; padding: .55em 1em .55em .85em; border-radius: 999px; background: rgba(255,255,255,.88); border: 1px solid #f0d3d8; font-size: 14px; font-weight: 700; color: var(--lp-cocoa); box-shadow: 0 4px 14px -8px rgba(157,90,102,.35); }
.lp-shop-facts svg { color: var(--lp-rose-deep); flex: 0 0 auto; }
.lp-shop-facts-price { background: var(--lp-blush); }
.lp-shop-facts-price strong { font-weight: 800; color: var(--lp-rose-deep); }
.lp-shop-facts-price s { color: #b9958c; font-weight: 600; }
@media (max-width: 560px) { .lp-shop-facts li { font-size: 13px; padding: .45em .85em .45em .7em; } }

/* ————— Ersatzbezuege: eigene Sektion ————— */
.lp-covers { position: relative; background: linear-gradient(180deg, #fff 0%, var(--lp-cream) 40%, #fff 100%); border-top: 1px solid #f4e6e9; padding: clamp(64px, 9vh, 108px) clamp(20px, 5vw, 48px) clamp(48px, 7vh, 96px); }
.lp-covers-facts { max-width: 1000px; margin: 0 auto; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.lp-covers-facts li { display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; background: #fff; border: 1px solid #f0d3d8; border-radius: 18px; }
.lp-covers-facts svg { flex: 0 0 auto; margin-top: 2px; color: var(--lp-rose-deep); }
.lp-covers-facts b { display: block; font-size: 15.5px; font-weight: 800; color: var(--lp-cocoa); }
.lp-covers-facts span { display: block; margin-top: 3px; font-size: 13.5px; line-height: 1.4; color: var(--lp-cocoa-soft); }
.lp-covers .lp-group-label { margin-top: 38px; }
@media (max-width: 860px) { .lp-covers-facts { grid-template-columns: 1fr; gap: 10px; } }

/* ————— Massblatt: nacktes Kissen, Masse als HTML-Plaketten ————— */
.lp-specs-fig { position: relative; border-radius: 24px; overflow: hidden; background: #fff; border: 1px solid #f0d3d8; }
.lp-specs-fig img { border-radius: 0; }
.lp-spec-pill { position: absolute; display: inline-flex; flex-direction: column; align-items: flex-start; padding: 8px 14px 7px; border-radius: 14px; background: rgba(255,253,251,.96); border: 1px solid rgba(196,117,133,.28); box-shadow: 0 12px 26px -14px rgba(26,16,14,.55); font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--lp-cocoa-soft); white-space: nowrap; }
.lp-spec-pill b { font-size: clamp(18px, 2vw, 24px); line-height: 1; font-weight: 800; letter-spacing: -.02em; text-transform: none; color: var(--lp-rose-deep); }
.lp-spec-pill--mid { transform: translate(-50%, -50%); align-items: center; }
@media (max-width: 480px) { .lp-spec-pill { padding: 6px 10px 5px; font-size: 10px; } .lp-spec-pill b { font-size: 16px; } }
/* Bezug-Raster: so viele Spalten wie Bezuege je Stoff (3 Perkal, 6 Strick), damit keine Karte allein in die zweite Reihe faellt. */
.lp-covers .lp-grid-c1, .lp-covers .lp-grid-c2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; }
.lp-covers .lp-grid-c3 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 760px; }
.lp-covers .lp-grid-c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 980px; }
.lp-covers .lp-grid-c5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.lp-covers .lp-grid-c6 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
@media (max-width: 980px) { .lp-covers .lp-grid-c5, .lp-covers .lp-grid-c6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lp-covers .lp-grid-c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .lp-covers .lp-grid-c3, .lp-covers .lp-grid-c4, .lp-covers .lp-grid-c5, .lp-covers .lp-grid-c6 { grid-template-columns: repeat(2, 1fr); gap: 12px; } }
/* Handy: die leere Wand ist nur das obere Drittel -- Sektion seitenhoch, der Absatz faellt weg, Kicker + H2 + Chips + Knopf bleiben oben. */
@media (max-width: 860px) {
    .lp-shelf--clean { min-height: 100svh; }
    .lp-shelf--clean .lp-shelf-copy { display: none; }
    .lp-shelf--clean .lp-shelf-overlay { top: 24px; }
    .lp-shelf--clean .lp-shelf-overlay h2 { font-size: 30px; margin-bottom: .45em; }
    .lp-shelf--clean .lp-shelf-facts { gap: 6px; margin-bottom: 14px; }
    .lp-shelf--clean .lp-shelf-facts li { font-size: 12px; padding: .42em .8em .42em .65em; }
}

/* ═══════════════════════════════════════════════════════════════════════
   20.10.2026 — Sichtpruefung LP 1: Pflege statt Stoffvergleich, eine Masszahl
   ═══════════════════════════════════════════════════════════════════════ */

/* ————— Waschen & Pflegen (_fabric.php): Minky links neben dem Kopf ————— */
.lp-care-head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(18px, 3vw, 40px); align-items: center; max-width: 900px; margin: 0 auto 34px; }
.lp-care-head .lp-h2 { margin-top: .25em; }
.lp-care-head .lp-copy { margin: 0; }
.lp-care-head .lp-copy a { color: var(--lp-rose-deep); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.lp-care-minky { width: clamp(170px, 20vw, 250px); height: auto; filter: drop-shadow(0 10px 18px rgba(55,40,35,.16)); }
/* Karte: Temperatur gross links, Name + Satz rechts -- die Waschangabe ist die Hauptsache. */
.lp-care-body { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: center; padding: 20px 22px 22px; }
.lp-care-body h3 { margin: 0; font-size: 21px; font-weight: 800; color: var(--lp-cocoa); }
.lp-care-body p { margin: 4px 0 0; font-size: 15px; line-height: 1.5; color: var(--lp-cocoa-soft); }
.lp-care-temp { display: grid; place-items: center; align-content: center; width: 96px; height: 96px; border-radius: 50%; background: var(--lp-blush); border: 2px solid #f0d3d8; color: var(--lp-rose-deep); text-align: center; }
.lp-care-temp b { font-size: 34px; line-height: 1; font-weight: 800; letter-spacing: -.03em; }
.lp-care-temp b i { font-style: normal; font-size: .5em; letter-spacing: 0; vertical-align: .62em; margin-left: 1px; }
.lp-care-temp span { margin-top: 3px; font-size: 9.5px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--lp-cocoa-soft); line-height: 1.15; }
.lp-fabric-card--strick .lp-care-temp { background: #eef1f6; border-color: #d6dde8; color: #5b6c86; }
/* Kapok-Regel: eigener Streifen unter den Karten, Sonne statt Waschmaschine. */
.lp-care-kapok { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: start; max-width: 900px; margin: 26px auto 0; padding: 22px 26px; border-radius: 24px; background: linear-gradient(135deg, #fff9ec 0%, #fdf1d6 100%); border: 1px solid #f2e2bb; }
.lp-care-kapok-ico { display: grid; place-items: center; width: 58px; height: 58px; border-radius: 50%; background: #fff; color: #d49a2a; box-shadow: 0 10px 22px -14px rgba(160,110,20,.7); }
.lp-care-kapok h3 { margin: 2px 0 6px; font-size: 19px; font-weight: 800; color: var(--lp-cocoa); }
.lp-care-kapok p { margin: 0; font-size: 15px; line-height: 1.55; color: var(--lp-cocoa-soft); }
.lp-care-kapok p strong { color: var(--lp-cocoa); }
.lp-care-kapok .lp-care-inlett { display: flex; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed #ead6a8; font-size: 14px; }
.lp-care-kapok .lp-care-inlett svg { flex: 0 0 auto; color: #b07f22; }
@media (max-width: 720px) {
    .lp-care-head { grid-template-columns: 1fr; text-align: center; }
    .lp-care-head .lp-sc-kicker { justify-content: center; }
    .lp-care-minky { width: 118px; margin: 0 auto; }
    .lp-care-body { gap: 14px; padding: 16px 16px 18px; }
    .lp-care-temp { width: 78px; height: 78px; }
    .lp-care-temp b { font-size: 28px; }
    .lp-care-kapok { grid-template-columns: 1fr; gap: 10px; padding: 20px; }
    .lp-care-kapok .lp-care-inlett { align-items: flex-start; }
}

/* ————— Massblatt: nur noch die Aussenlaenge, dafuer gross ————— */
.lp-spec-pill--hero { padding: 12px 18px 11px; border-radius: 18px; font-size: 12px; }
.lp-spec-pill--hero b { font-size: clamp(30px, 3.4vw, 42px); }
@media (max-width: 480px) { .lp-spec-pill--hero { padding: 9px 13px 8px; font-size: 10.5px; } .lp-spec-pill--hero b { font-size: 26px; } }

/* ═══════════════════════════════════════════════════════════════════════
   20.10.2026 — Sichtpruefung LP 1, Teil 2: Masse + Unterschied als eigene
   Baender (vorher beide auf derselben Cremeflaeche, ohne Trennung)
   ═══════════════════════════════════════════════════════════════════════ */

/* ————— Masse: helles Band, oben eine Massband-Kante ————— */
.lp-specs-band { position: relative; background: radial-gradient(46% 62% at 27% 56%, #fff 0%, rgba(255,255,255,0) 72%), linear-gradient(180deg, var(--lp-blush) 0%, #fdf2ef 60%, var(--lp-cream) 100%); }
.lp-specs-band .lp-specs { padding-top: clamp(64px, 9vh, 104px); }
.lp-specs-fig { margin: 0; padding-bottom: 18px; box-shadow: 0 32px 60px -38px rgba(157,90,102,.6); }
.lp-specs-stage { position: relative; }
.lp-specs-arrow { position: absolute; inset: 0; width: 100%; height: 100%; color: var(--lp-rose-deep); pointer-events: none; overflow: visible; }
.lp-specs-line { fill: none; stroke: currentColor; stroke-width: 5; }
.lp-specs-tip { fill: currentColor; }
/* Der Pfeil zeichnet sich ein, sobald die Abbildung erscheint; die Spitzen kommen am Ende. */
.lp-js .lp-specs-line { stroke-dasharray: 1 2; stroke-dashoffset: 1; transition: stroke-dashoffset 1.8s cubic-bezier(.45,.05,.25,1) .35s; }
.lp-js .lp-specs-tip { opacity: 0; transition: opacity .35s ease 1.95s; }
.lp-js .lp-specs-fig.in .lp-specs-line { stroke-dashoffset: 0; }
.lp-js .lp-specs-fig.in .lp-specs-tip { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .lp-js .lp-specs-line { stroke-dashoffset: 0; transition: none; } .lp-js .lp-specs-tip { opacity: 1; transition: none; } }
/* Die Zahl sitzt unter den Baendeln, zwischen den Pfeilspitzen. */
.lp-specs-fig .lp-specs-cap { position: relative; display: flex; width: max-content; margin: -6% auto 0; align-items: center; }
.lp-specs dl div { box-shadow: 0 10px 24px -20px rgba(157,90,102,.7); }
.lp-specs dl .lp-specs-key { background: linear-gradient(135deg, var(--lp-rose) 0%, var(--lp-rose-deep) 100%); border-color: transparent; box-shadow: 0 16px 30px -16px rgba(157,90,102,.85); }
.lp-specs dl .lp-specs-key dt { color: #ffe1e7; }
.lp-specs dl .lp-specs-key dd { color: #fff; }

/* ————— Unterschied: dunkles Band, Kapok leuchtet gruen, „vs" dazwischen ————— */
/* 25.10.2026 (Inhaberin): das dunkle Band wirkte fremd zwischen den hellen
   Sektionen -- jetzt hell wie die Masse-Sektion, hinter der Kapok-Spalte ein
   zarter Salbei-Schimmer. Ueberschrift/Text in den Standardfarben. */
.lp-compare-band { position: relative; overflow: hidden;
    background:
        radial-gradient(40% 55% at 26% 70%, rgba(143,190,120,.18) 0%, rgba(143,190,120,0) 72%),
        linear-gradient(180deg, var(--lp-cream) 0%, #fdf2ef 55%, var(--lp-blush) 100%); }
.lp-compare-band .lp-compare-grid { grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 36px; }
.lp-compare-band .lp-compare-col { border: 0; box-shadow: 0 30px 60px -36px rgba(157,90,102,.55); }
.lp-compare-band .lp-compare-col.good { box-shadow: 0 0 0 2px #b9d9ac, 0 30px 64px -32px rgba(120,180,95,.5); }
.lp-compare-band .lp-compare-col.bad { background: #f4eeeb; }
.lp-compare-vs { position: relative; z-index: 3; }
.lp-compare-vs span { position: absolute; left: 50%; top: 36%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: var(--lp-cream); color: var(--lp-cocoa); font-size: 17px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; box-shadow: 0 0 0 6px #33241f, 0 14px 28px -10px rgba(0,0,0,.65); }
@media (max-width: 720px) {
    .lp-compare-band .lp-compare-grid { grid-template-columns: 1fr; }
    .lp-compare-vs span { top: 50%; width: 54px; height: 54px; font-size: 15px; }
}

/* ————— 24.10.2026 (Inhaberin, Sichtpruefung /lp/stillkissen-1) ————— */

/* Pruefengel neu: freigestelltes Siegel auf einer Farbwolke, Stempel mit der
   Punktzahl, Logo ueber dem Text -- statt des Punkte-Bildes mit weisser Box. */
.lp-pruef--seal { min-height: 0; }
.lp-pruef2 { display: grid; gap: 34px; align-items: center; }
@media (min-width: 861px) { .lp-pruef2 { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(32px, 6vw, 88px); } }
.lp-pruef2-logo { display: block; width: clamp(200px, 26vw, 300px); height: auto; margin: 0 0 18px; }
.lp-pruef2-link { margin-top: 26px; }
.lp-pruef2-seal { position: relative; display: grid; place-items: center; padding: 30px 10px 40px; }
.lp-pruef2-blob { position: absolute; inset: 4% 6%; border-radius: 58% 42% 55% 45% / 48% 56% 44% 52%; background: radial-gradient(circle at 35% 30%, #fff 0%, #fdeef0 45%, #f6d4db 100%); box-shadow: 0 40px 80px -50px rgba(157,90,102,.55); }
.lp-pruef2-badge { position: relative; width: clamp(200px, 26vw, 320px); height: auto; transform: rotate(-4deg); filter: drop-shadow(0 26px 34px rgba(3,73,118,.22)); }
.lp-pruef2-stamp { position: absolute; right: 0; bottom: 4%; display: grid; place-items: center; align-content: center; width: clamp(104px, 11vw, 132px); aspect-ratio: 1; border-radius: 50%; background: linear-gradient(140deg, #d796a3 0%, var(--lp-rose-deep) 100%); color: #fff; text-align: center; line-height: 1; transform: rotate(8deg); box-shadow: 0 0 0 6px #fff, 0 18px 30px -12px rgba(157,90,102,.75); }
.lp-pruef2-stamp b { font-size: clamp(36px, 4vw, 46px); font-weight: 800; letter-spacing: -.02em; }
.lp-pruef2-stamp small { font-size: 12px; font-weight: 800; letter-spacing: .04em; margin-top: 2px; }
.lp-pruef2-stamp em { font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; opacity: .85; margin-top: 3px; }
@media (max-width: 860px) {
    .lp-pruef--seal .lp-pruef-wm { width: 100%; right: 0; bottom: 0; opacity: .4; }
    .lp-pruef2-seal { padding: 18px 0 26px; }
    .lp-pruef2-badge { width: 180px; }
    .lp-pruef2-stamp { display: none; }
}

/* GOTS + Oeko-Tex, eigene Sektion (_certs.php) */
.lp-certs { position: relative; overflow: hidden; background: radial-gradient(900px 480px at 12% 8%, rgba(230,242,224,.75), transparent 70%), radial-gradient(800px 520px at 92% 92%, rgba(246,212,219,.6), transparent 70%), var(--lp-cream); padding: clamp(64px, 10vh, 120px) clamp(20px, 5vw, 48px); }
.lp-certs-inner { max-width: 1240px; margin: 0 auto; }
.lp-certs .lp-section-head { text-align: center; max-width: 760px; margin: 0 auto; }
.lp-certs-grid { display: grid; gap: 22px; margin-top: clamp(32px, 5vh, 56px); align-items: stretch; }
@media (min-width: 981px) { .lp-certs-grid { grid-template-columns: 1fr 1.05fr 1fr; gap: 26px; } }
.lp-cert { display: flex; flex-direction: column; align-items: center; text-align: center; background: rgba(255,255,255,.9); border: 1px solid #ecdcd2; border-radius: 34px 34px 34px 110px; padding: 34px 28px 32px; box-shadow: 0 30px 60px -46px rgba(58,43,39,.5); }
.lp-cert:last-child { border-radius: 34px 34px 110px 34px; }
.lp-cert-seal { width: auto; height: 128px; margin-bottom: 18px; }
.lp-cert h3 { margin: 0 0 10px; font-size: clamp(22px, 2.2vw, 27px); font-weight: 800; color: var(--lp-cocoa); line-height: 1.15; }
.lp-cert h3 small { display: block; margin-top: 4px; font-size: 13px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--lp-sage-deep); }
.lp-cert p { margin: 0 0 16px; font-size: 16px; line-height: 1.6; color: var(--lp-cocoa-soft); }
.lp-cert ul { list-style: none; margin: auto 0 0; padding: 0; display: grid; gap: 8px; text-align: left; }
.lp-cert li { position: relative; padding-left: 28px; font-size: 15px; font-weight: 700; color: var(--lp-cocoa); }
.lp-cert li::before { content: ''; position: absolute; left: 0; top: 2px; width: 18px; height: 18px; border-radius: 50%; background: var(--lp-sage-deep) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='white'%3E%3Cpath d='M8 13.6 4.4 10l1.2-1.2L8 11.2l6.4-6.4 1.2 1.2z'/%3E%3C/svg%3E") center/14px no-repeat; }
.lp-certs-pic { margin: 0; border-radius: 160px 160px 34px 34px; overflow: hidden; min-height: 320px; box-shadow: 0 40px 70px -46px rgba(58,43,39,.6); }
.lp-certs-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 980px) { .lp-certs-pic { order: -1; max-width: 520px; width: 100%; margin: 0 auto; aspect-ratio: 4/3.4; min-height: 0; } }

/* Auswahl in Dreierreihen: Perkal 3 nebeneinander, Strick 3 x 2 und groesser,
   Bezuege ebenso in voller Breite. Doppelte Klasse schlaegt .lp-covers .lp-grid-cN. */
.lp-shop .lp-grid.lp-grid, .lp-covers .lp-grid.lp-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 1120px; gap: 24px; }
.lp-shop .lp-card-name, .lp-covers .lp-card-name { font-size: 17px; }
.lp-shop .lp-card, .lp-covers .lp-card { padding: 16px 16px 18px; }
/* Handy: zwei Karten nebeneinander, die Gruppe laeuft nach UNTEN weiter wie auf
   der Babydecke-LP (Inhaber 04.11.2026) -- vorher eine wischbare Reihe mit genau
   zwei sichtbaren Karten, das Wischen war nicht erkennbar. */
@media (max-width: 640px) {
    .lp-shop .lp-grid.lp-grid, .lp-covers .lp-grid.lp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .lp-shop .lp-card-name, .lp-covers .lp-card-name { font-size: 15px; }
    .lp-shop .lp-card .lp-btn, .lp-covers .lp-card .lp-btn { font-size: 13px; padding: .75em .35em; white-space: nowrap; }
}

/* 24.10. spaet: normale Ecken statt Bogen (Inhaberin), Siegel groesser. */
.lp-cert, .lp-cert:last-child { border-radius: 28px; }
.lp-certs-pic { border-radius: 28px; }
.lp-cert-seal { height: 150px; }
@media (max-width: 980px) { .lp-cert-seal { height: 124px; } }

/* 25.10.2026: Amazon-Logo in der Bewertungszeile, wie auf der Babydecke-LP. */
.lp-revs-amz { height: 1.9em; width: auto; display: block; transform: translateY(.18em); }

/* 25.10.2026: Kombi-Rabatt in der Shop-Sektion, Gutschein-Optik wie auf der Babydecke-LP. */
.lp-deal { display: inline-flex; align-items: center; gap: 12px; margin: 18px auto 0; background: #fffdfb; border: 2px dashed #4c8a3f; border-radius: 16px; padding: .5em 1.3em .5em .55em; box-shadow: 0 12px 32px -14px rgba(61,107,52,.5); transform: rotate(-1deg); text-align: left; }
.lp-deal-tag { flex: none; background: linear-gradient(135deg, #5aa348 0%, #3d6b34 100%); color: #fff; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: clamp(11px, 1.2vw, 13px); border-radius: 10px; padding: .55em 1em; }
.lp-deal-text { font-weight: 800; color: #2f5527; font-size: clamp(15px, 1.8vw, 19px); line-height: 1.2; }
.lp-deal-text small { display: block; font-size: 12.5px; font-weight: 600; color: #5b7a52; margin-top: 2px; }

/* Handy-Hero wie die Kapok-Szene (Inhaber 04.11.2026): der Film steht frei oben,
   Text, Preis und Siegelkarte darunter auf dunklem Grund. Vorher lag der ganze
   Block auf dem Film und deckte ihn komplett zu; der helle Verlauf am unteren
   Rand und das Scroll-Symbol sind weg. */
@media (max-width: 860px) {
    .lp-hero, .lp-has-nav .lp-hero { display: block; min-height: 0; }
    .lp-hero .lp-hero-poster { position: relative; inset: auto; display: block; width: 100%; height: 62svh; }
    .lp-hero video { inset: 0 0 auto 0; height: 62svh; }
    .lp-hero::after { background: linear-gradient(180deg, rgba(43,28,25,.18) 0, rgba(43,28,25,0) 14svh, rgba(43,28,25,0) 40svh, var(--lp-cocoa) 62svh); }
    .lp-hero-inner { position: relative; margin-top: -16svh; padding-bottom: 40px; }
    .lp-scroll-cue { display: none; }
}

/* Pruefengel-Sektion mobil: Siegel OBEN, dann Text (Inhaber 04.11.2026). */
@media (max-width: 860px) {
    .lp-pruef2-seal { order: -1; padding: 6px 0 10px; }
    .lp-pruef2 { gap: 18px; }
}