/** Shopify CDN: Minification failed

Line 1943:0 Unexpected "}"

**/
/* z-lp-kia3-fr-202609 - campaign stylesheet: KIA official sale (2026-09-20 to 2026-09-23), language fr.
   Safe to delete after the campaign ends. Belongs to templates/page.z-lp-kia3-fr-202609.liquid.
   Fonts and media are self-contained under assets/z-lp-kia3-202609-*. */
/* latin-ext */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-caveat-600-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-caveat-600-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-caveat-700-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Caveat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-caveat-700-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-400-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-400-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-500-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-500-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-600-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-600-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-700-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-700-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-800-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-800-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-900-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-jost-900-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-500-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 500;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-500-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-600-italic-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-600-italic-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-500-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-500-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-600-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-600-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-700-normal-latin-ext.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("z-lp-kia3-202609-fonts-playfairdisplay-700-normal-latin.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


:root{
  /* GRANATAPFEL-ROSÉ Palette (Kollagen Intensiv), bewusst abgesetzt vom Energy-Orange */
  --brand:#45303a; --brand-hover:#2a1620; --muted:#8a7680; --coffee-400:#7a6870;
  --gold:#c9b389; --gold-light:#ebd8b2; --star:#c9b389;
  --cream:#fdfbf7; --cream-2:#faf7f0; --cream-3:#f9f3e9; --cream-4:#e9e0d1; --paper:#fffefd;
  --success:#21a050; --sale:#b00023;
  --orange:#b23a5d; --orange-dark:#9a2f4e; --orange-darker:#7e2540; --orange-light:#cf7d92; --orange-tint:#f7ebef;
  --accent:#b23a5d;
  --blue:#2C4B8E;
  --success-tint:#e7f5ec; --success-border:#b8e2c6; --sale-tint:#fbe7e7; --neg:#6E5C66; --neg-tint:#ece7ea;
  --font-head:"Jost",system-ui,sans-serif;
  --font-serif:"Playfair Display",Georgia,serif;
  --font-body:"Jost",system-ui,sans-serif;
  --r:6px; --r-form:10px;
  --maxw:680px; --wide:1140px; --btn-h:52px;
  --sp-2:8px; --sp-4:16px; --sp-6:24px; --sp-8:32px; --sp-12:48px; --sp-16:64px; --sp-24:96px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth; scroll-padding-top:72px}
html{overflow-x:clip}
body{
  font-family:var(--font-body); color:var(--brand); background:var(--cream);
  font-size:18px; line-height:1.62; -webkit-font-smoothing:antialiased;
  overflow-wrap:break-word; hyphens:none; -webkit-hyphens:none;
}
h1,h2,h3{font-family:var(--font-head); font-weight:600; line-height:1.18; color:var(--brand); hyphens:none; -webkit-hyphens:none}
h1{font-size:clamp(3.025rem,4.8vw,4rem); line-height:1.1}
h2{font-size:clamp(2.299rem,3.2vw,2.9rem); margin-bottom:20px}
h3{font-size:clamp(1.573rem,1.8vw,1.65rem); margin-bottom:11px}
.article h3{margin-bottom:17px; clear:both}
p{margin:0 0 1.15rem}
strong{font-weight:700; color:var(--brand)}
em{font-style:italic}
a{color:var(--orange-dark)}
.wrap{max-width:var(--wide); margin:0 auto; padding:0 28px}
.col{max-width:var(--maxw); margin:0 auto; padding:0 28px}
.article{max-width:720px; margin:0 auto; padding:0 28px}
.sevenwrap{text-align:center}
.sevenwrap .tripep-banner, .sevenwrap .sysgrid, .sevenwrap .sysgrid figcaption{text-align:left}
.sevenwrap>.kicker, .sevenwrap>.story-h, .sevenwrap>p{max-width:880px; margin-left:auto; margin-right:auto}
.sevenwrap>.story-h{max-width:1000px; font-size:clamp(2.723rem,4.7vw,3.4rem)}
.col .article, .wrap .article{padding:0; max-width:none}
section{padding:var(--sp-24) 0}
.bg-cream{background:var(--cream)} .bg-cream2{background:var(--cream-2)} .bg-cream3{background:var(--cream-3)}
.bg-blush{background:linear-gradient(180deg,#efdbd4,#e6cbcc)}
.bg-tint{background:var(--orange-tint)}
.bg-tint .solution-eyebrow span{background:var(--paper)}
.bg-dark{background:linear-gradient(160deg,#5a2438,#2e1220); color:var(--cream)}
.bg-dark .lead, .bg-dark p{color:var(--gold-light)}
.bg-dark .lead strong, .bg-dark p strong{color:#fff}
.bg-dark h2,.bg-dark h3{color:var(--paper)} .bg-dark strong{color:var(--gold-light)}
.bg-dark .kicker{background:rgba(255,255,255,.07); border-color:rgba(235,216,178,.45); color:var(--gold-light)}
/* Kontrast-Fixes für die dunkle Section */
.bg-dark .story-h em{color:#e79ab0}
.bg-dark .hl{background:var(--gold-light); color:#3a2212; padding:1px 7px; border-radius:3px}
.bg-dark .factbul li{border-color:rgba(255,255,255,.14)}
.bg-dark .factbul li strong{color:var(--gold-light)}
.bg-dark .factbul li::before{color:#e79ab0}
.kicker{display:inline-block; background:var(--orange-tint); border:1px solid var(--orange-light); color:var(--orange-dark); font-family:var(--font-body); font-weight:700; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; padding:8px 20px; border-radius:100px; margin-bottom:18px}
.lead{font-size:clamp(1.08rem,1.7vw,1.24rem); line-height:1.55; color:var(--coffee-400)}
.center{text-align:center}
/* Zentrierte Headlines in breiten (.wrap) Sektionen auf Lesebreite begrenzen (#71/#72) */
.wrap > h2, .wrap > .story-h, .wrap > p, .wrap > .lead, .wrap > .subhead, .wrap > .disc, .wrap.center > h2, .wrap.center > .story-h, .wrap.center > p, .wrap.center > .lead, .wrap.center > .subhead, .wrap.center > .disc{max-width:840px; margin-left:auto; margin-right:auto}
.muted{color:var(--muted)}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; background:var(--orange-dark); color:#fff; font-family:var(--font-body); font-weight:600; text-transform:uppercase; letter-spacing:.1em; font-size:.95rem; text-decoration:none; min-height:var(--btn-h); padding:11px 38px; line-height:1.32; border-radius:var(--r); border:none; cursor:pointer; transition:background .15s ease, transform .15s ease; box-shadow:0 6px 18px rgba(171,84,38,.32)}
.btn:hover{background:var(--orange-darker); transform:translateY(-1px)}
.btn-lg{min-height:60px; font-size:1.05rem; padding:13px 46px}
.btn-block{display:flex; width:100%}
.cta-sub{font-size:.86rem; color:var(--muted); margin-top:12px; letter-spacing:.02em}
.cta-sub.on-dark{color:var(--gold-light)}
.softcta{text-align:center; padding-top:6px}
/* Editorial header */
.topbar{position:sticky; top:0; z-index:50; background:rgba(253,251,247,.94); backdrop-filter:blur(8px); border-bottom:1px solid var(--cream-4)}
.topbar .wrap{display:flex; align-items:center; justify-content:space-between; height:56px}
.logo{font-family:var(--font-serif); font-weight:700; font-size:1.45rem; color:var(--brand); letter-spacing:-.01em}
.logo span{color:var(--orange-dark); font-style:italic}
.logo-img{height:26px; width:auto; display:block}
.masthead-label{font-family:var(--font-body); font-size:.72rem; text-transform:uppercase; letter-spacing:.16em; color:var(--muted)}
/* Launch countdown bar */
.countdown-bar{position:sticky; top:0; z-index:60; background:var(--orange-darker); color:#fff; font-family:var(--font-body)}
.cd-inner{max-width:var(--wide); margin:0 auto; padding:10px 22px; display:flex; align-items:center; justify-content:center; gap:13px; flex-wrap:wrap; font-size:.92rem; font-weight:700; color:#fff; letter-spacing:.02em}
.cd-flame{font-size:1rem; line-height:1}
.cd-text{font-weight:500; color:var(--gold-light)}
.cd-clock{font-family:var(--font-head); font-weight:700; font-size:1.05rem; color:#fff; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.2); border-radius:6px; padding:2px 11px; font-variant-numeric:tabular-nums; letter-spacing:.06em; min-width:108px; text-align:center}
.cd-cta{color:var(--brand); background:var(--gold-light); font-weight:700; text-transform:uppercase; font-size:.74rem; letter-spacing:.08em; padding:6px 15px; border-radius:100px; text-decoration:none; transition:background .15s ease}
.cd-cta:hover{background:#fff}
@media(max-width:540px){.cd-text{display:none} .cd-inner{gap:10px; padding:8px 16px}}
/* Hero, editorial / typographic */
.hero{padding:38px 0 var(--sp-16); background:radial-gradient(125% 85% at 50% -10%, var(--orange-tint), var(--cream) 62%); border-bottom:1px solid var(--cream-4)}
.hero-kicker{display:inline-block; position:relative; overflow:hidden; font-family:var(--font-body); font-weight:700; text-transform:uppercase; letter-spacing:.16em; font-size:.74rem; color:var(--orange-dark); padding:7px 15px; border:1px solid var(--orange-light); border-radius:100px; margin-bottom:36px; animation:kickerGlow 2.8s ease-in-out infinite}
.hero-kicker::after{content:""; position:absolute; top:0; bottom:0; left:-60%; width:45%; background:linear-gradient(100deg, transparent, rgba(255,255,255,.6), transparent); transform:skewX(-18deg); animation:kickerShine 3.6s ease-in-out infinite; pointer-events:none}
@keyframes kickerGlow{0%,100%{box-shadow:0 0 0 0 rgba(190,99,48,0); background:transparent} 50%{box-shadow:0 0 18px 1px rgba(190,99,48,.28); background:var(--orange-tint)}}
@keyframes kickerShine{0%{left:-60%} 50%{left:130%} 100%{left:130%}}
@media(prefers-reduced-motion:reduce){.hero-kicker{animation:none} .hero-kicker::after{display:none}}
.hero h1{font-family:var(--font-body); font-weight:700; font-size:clamp(2.239rem,3.3vw,2.6rem); line-height:1.12; letter-spacing:-.01em; margin:0 0 22px; text-wrap:balance; hyphens:none}
.hero h1 em{font-family:var(--font-body); font-style:normal; font-weight:800; color:var(--accent)}
/* Part 2, Ursache-Reframe: bewusst NICHT serif (klare Sub-Headline) */
.hero .dek{font-family:var(--font-body); font-style:normal; font-weight:500; font-size:clamp(1.12rem,1.7vw,1.32rem); line-height:1.5; color:var(--brand); margin-bottom:18px; text-wrap:balance; hyphens:manual}
.hero .dek strong{color:var(--orange-dark); font-weight:700}
.hero .dek-worse{font-family:var(--font-body); font-style:normal; font-size:clamp(1.04rem,1.6vw,1.2rem); line-height:1.5; color:var(--coffee-400); margin-bottom:24px; hyphens:manual}
.hero .dek-worse strong{color:var(--orange-dark); font-weight:700}
/* Part 4, Carmen-Zitat: in eine eigene Box */
.hero .dek-promise{font-family:var(--font-head); font-style:normal; font-weight:600; font-size:clamp(1.26rem,2.05vw,1.6rem); line-height:1.42; color:var(--brand); background:var(--cream-3); border:1px solid var(--gold-light); border-left:5px solid var(--orange); border-radius:16px; padding:24px 28px; margin:6px 0 26px; text-wrap:balance; hyphens:manual}
.hero .dek-promise strong{color:var(--orange-dark); font-weight:700}
.hero .dek-promise em{color:var(--orange-dark); font-style:italic; font-weight:600}
.hero .dek-promise .hl{color:var(--orange-dark)}
.hero-break{font-family:var(--font-body); font-size:clamp(1.04rem,1.7vw,1.22rem); line-height:1.52; color:var(--brand); font-weight:500; background:var(--orange-tint); border-radius:14px; padding:17px 22px; margin:30px 0}
.hero-break .hb-tag{display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:#fff; background:var(--orange-dark); border-radius:100px; padding:4px 11px; margin-right:9px; vertical-align:baseline}
.hero-break em{font-style:italic; color:var(--orange-dark); font-weight:700}
.hero-break strong{color:var(--orange-dark)}
.hero .dek-vision{font-family:var(--font-body); font-style:italic; font-size:clamp(1.1rem,1.85vw,1.36rem); line-height:1.5; color:var(--brand); margin:24px 0 4px; max-width:600px; text-wrap:balance; hyphens:manual}
.hero .dek-vision em{font-style:italic; color:var(--orange-dark); font-weight:600}
.bigq p, .bigq .bigq-q, .pivot-q, .subhead, .lead, .dek, .dek-vision, .vn-head, .mg-note, .hero-break, .story-h, .rc-head{hyphens:none; -webkit-hyphens:none; -moz-hyphens:none}
.byline{display:inline-flex; align-items:center; gap:10px; font-family:var(--font-body); font-size:.8rem; text-transform:uppercase; letter-spacing:.12em; color:var(--muted); padding-bottom:22px; margin-bottom:26px; border-bottom:1px solid var(--cream-4)}
.byline b{color:var(--orange-dark); font-weight:600}
/* story headline for narrative sections */
.story-h{font-size:clamp(2.057rem,3vw,2.5rem); line-height:1.16; margin-bottom:28px}
.sec-airhead .kicker{margin-bottom:34px}
.sec-airhead .story-h{margin-bottom:38px}
.story-h em{font-style:italic; color:var(--orange-dark)}
/* Wichtige Wörter in ALLEN Headlines farblich (Rafael 7.7.) */
h1 em, h2 em, h3 em, h1 strong, h2 strong, h3 strong{color:var(--orange-dark)}
.bg-dark h1 em, .bg-dark h2 em, .bg-dark h3 em, .bg-dark h1 strong, .bg-dark h2 strong, .bg-dark h3 strong{color:#e79ab0}
.story-h .sh-pre{display:block; margin-bottom:6px}
.story-h .sh-quote{display:inline; -webkit-box-decoration-break:clone; box-decoration-break:clone; font-style:italic; font-weight:600; color:var(--coffee-400); background:linear-gradient(transparent 62%, var(--gold-light) 62%); padding:0 5px}
.story-h .sh-punch{display:block; margin-top:10px; font-style:italic; font-weight:700; color:var(--orange-dark); font-size:1.14em; line-height:1.12}
.factbul{list-style:none; margin:16px 0; padding:0}
.factbox{background:var(--paper); border:1px solid var(--cream-4); border-radius:16px; padding:6px 28px; margin:30px 0; box-shadow:0 8px 22px rgba(75,51,52,.06)}
.factbox .factbul{margin:0}
.factbul li{position:relative; padding:11px 0 11px 34px; line-height:1.5; border-bottom:1px solid var(--cream-4)}
.factbul li:last-child{border-bottom:none}
.factbul li::before{content:"→"; position:absolute; left:0; top:10px; color:var(--orange-dark); font-weight:700; font-size:1.05rem}
.factbul li strong{color:var(--brand)}
.hl{background:linear-gradient(transparent 58%, var(--gold-light) 58%); color:var(--brand); font-style:normal; font-weight:700; padding:0 3px; border-radius:2px}
.denkfehler-box{font-family:var(--font-body); font-weight:600; font-size:1.06rem; line-height:1.45; color:var(--brand); background:var(--orange-tint); border:1px solid var(--gold-light); border-left:4px solid var(--orange); border-radius:12px; padding:15px 20px; margin:30px 0}
.denkfehler-box em{font-style:italic; color:var(--orange-dark); font-weight:700}
.mistakes{display:grid; gap:14px; margin:24px 0 14px}
.mistake{display:flex; gap:16px; align-items:flex-start; background:var(--paper); border:1px solid var(--cream-4); border-left:5px solid var(--sale); border-radius:13px; padding:20px 24px; box-shadow:0 8px 22px rgba(75,51,52,.07)}
.mistake .m-num{flex:none; width:40px; height:40px; border-radius:50%; background:var(--sale-tint); color:var(--sale); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:1.55rem; line-height:1}
.mistake>div{color:var(--coffee-400); line-height:1.5}
.mistake b{display:block; color:var(--brand); margin-bottom:4px; font-size:1.12rem}
.bigq{background:linear-gradient(180deg,var(--orange-tint),var(--cream-3)); border:1.5px solid var(--gold-light); border-radius:18px; padding:30px 34px; margin:30px 0; text-align:center; box-shadow:0 14px 36px rgba(190,99,48,.13)}
.bigq p{font-size:1.12rem; color:var(--coffee-400); line-height:1.5; margin:0 0 10px; max-width:680px; margin-left:auto; margin-right:auto}
.bigq p strong{color:var(--brand)}
.bigq .bigq-q{font-family:var(--font-head); font-weight:600; font-size:clamp(1.6rem,3.2vw,2.3rem); color:var(--brand); line-height:1.18}
.bigq .bigq-q em{font-style:italic; color:var(--orange-dark)}
.proofq{background:linear-gradient(180deg,#f7e9ee,#f2dfe6); color:var(--brand); border:1px solid var(--cream-4); border-top:none; border-radius:0 0 16px 16px; padding:36px 30px 26px; margin:0 0 30px; box-shadow:0 8px 24px rgba(75,51,52,.06)}
.proofq .pq-kick{display:block; line-height:1; font-family:var(--font-body); font-size:.68rem; font-weight:700; letter-spacing:.15em; text-transform:uppercase; color:var(--orange-dark); margin-bottom:6px}
.proofq h3{font-family:var(--font-head); font-weight:600; font-size:clamp(1.5rem,2.3vw,1.62rem); line-height:1.2; color:var(--brand); margin:0 0 13px; text-wrap:balance}
.proofq h3 em{font-style:italic; color:var(--orange-dark)}
.proofq>p{font-size:clamp(.92rem,1.35vw,1.02rem); line-height:1.55; color:var(--coffee-400); margin:0 0 18px; max-width:640px}
.proofq .pq-list{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.proofq .pq-list li{position:relative; padding:11px 16px 11px 44px; background:var(--paper); border:1px solid var(--cream-4); border-radius:11px; font-size:clamp(.88rem,1.25vw,.98rem); line-height:1.4; color:var(--brand)}
.proofq .pq-list li b{color:var(--brand); font-weight:800}
.proofq .pq-list li::before{content:"?"; position:absolute; left:13px; top:50%; transform:translateY(-50%); width:22px; height:22px; border-radius:50%; background:linear-gradient(180deg,var(--orange-light),var(--orange-dark)); color:#fff; font-family:var(--font-head); font-weight:700; font-size:.85rem; display:flex; align-items:center; justify-content:center; box-shadow:0 2px 7px rgba(0,0,0,.18)}
@media(max-width:520px){.proofq{padding:22px 18px}.proofq .pq-list li{padding:10px 13px 10px 40px}}
.subhead{font-family:var(--font-body); font-weight:600; font-size:clamp(1.391rem,2vw,1.42rem); line-height:1.45; max-width:640px; margin:30px auto; hyphens:none; -webkit-hyphens:none}
.subhead em{font-style:normal; font-weight:700; color:var(--orange-dark)}
.bg-dark .subhead{background:var(--cream); color:var(--brand); border:1px solid var(--gold-light); border-radius:14px; padding:20px 28px; box-shadow:0 14px 34px rgba(0,0,0,.2)}
.bg-dark .subhead strong{color:var(--orange-dark)}
.bg-dark .subhead em{color:var(--orange-dark); font-style:normal; font-weight:700}
.zell-line{color:var(--gold-light); font-style:italic}
.zell-word{font-style:normal; color:#fff; background:linear-gradient(transparent 56%, rgba(235,216,178,.34) 56%); padding:0 5px; border-radius:2px}
.bg-dark .zell-word{color:#f2a9bf; background:none; text-decoration:underline; text-decoration-color:rgba(235,216,178,.55); text-underline-offset:6px; text-decoration-thickness:2px}
.pivot-q{max-width:860px; margin:30px auto; padding:clamp(18px,2.6vw,28px) clamp(24px,4vw,52px) clamp(24px,3.4vw,38px); background:linear-gradient(180deg,var(--orange-tint),var(--cream-3)); border:1.5px solid var(--gold-light); border-radius:16px; font-family:var(--font-body); font-style:normal; font-weight:600; font-size:clamp(1.4rem,2.9vw,2.15rem); line-height:1.32; color:var(--brand); text-align:center; hyphens:manual; -webkit-hyphens:manual; box-shadow:0 16px 40px rgba(190,99,48,.12)}
.pivot-q em{color:var(--orange-dark); font-style:normal; font-weight:700}
.pivot-q.is-quote::before{content:"„"; display:block; font-family:var(--font-body); font-size:2.4rem; line-height:1; color:var(--orange); opacity:.42; margin:-6px 0 16px}
.sjp{float:right; width:300px; max-width:45%; margin:4px 0 18px 30px}
.sjp-img{width:100%; height:auto; border-radius:14px; display:block; box-shadow:0 14px 36px rgba(75,51,52,.16)}
.sjp-cap{text-align:left; font-size:.82rem; color:var(--coffee-400); margin-top:10px; line-height:1.4}
@media(max-width:680px){.sjp{float:none; width:auto; max-width:420px; margin:22px auto 10px} .sjp-cap{text-align:center}}
.sjp-split{display:grid; grid-template-columns:1fr 290px; gap:34px; align-items:start; margin:4px 0}
.sjp-split .sjp{float:none; width:auto; max-width:none; margin:0}
.sjp-split .sjp-text>p:first-child{margin-top:0}
@media(max-width:680px){.sjp-split{grid-template-columns:1fr; gap:16px}}
/* SJP Foto + Zitat-Sprechblase als eine Karte */
.sjp-quote{margin:26px 0 0}
.sq-card{display:grid; grid-template-columns:1fr 1fr; border-radius:18px; overflow:hidden; box-shadow:0 16px 44px rgba(75,51,52,.16); background:var(--cream)}
.sq-photo img{width:100%; height:100%; object-fit:cover; object-position:center; display:block}
.sq-bubble{position:relative; align-self:center; margin:0; background:var(--cream); padding:14px 32px 30px; font-family:var(--font-body); font-weight:600; font-size:clamp(1.02rem,1.5vw,1.3rem); line-height:1.36; color:var(--brand)}
.sq-bubble::before{content:"„"; display:block; font-family:var(--font-body); font-size:2.2rem; line-height:.4; color:var(--orange); opacity:.5; margin-bottom:12px}
.sq-bubble em{color:var(--orange-dark); font-weight:700; font-style:normal}
.sq-bubble::after{content:""; position:absolute; left:-11px; top:50%; transform:translateY(-50%); width:0; height:0; border:11px solid transparent; border-right-color:var(--cream)}
@media(max-width:680px){.sq-card{grid-template-columns:1fr} .sq-bubble::after{left:50%; top:-11px; transform:translateX(-50%); border:11px solid transparent; border-bottom-color:var(--cream)}}
.sjp-cap b{color:var(--brand)}
.sjp-cap span{display:block; font-size:.74rem; color:var(--muted); margin-top:2px}
.quote-by{display:inline-flex; align-items:center; gap:14px; margin:2px auto 1.3rem; text-align:left}
.quote-av{width:60px; height:60px; border-radius:50%; object-fit:cover; object-position:center 28%; flex:none; box-shadow:0 4px 14px rgba(75,51,52,.18)}
.quote-by b{display:block; font-size:.95rem; color:var(--brand)}
.quote-by span{font-size:.78rem; color:var(--muted)}
.hero .opener{font-size:1.18rem; line-height:1.6}
.hero .opener .first::first-letter{font-family:var(--font-serif); font-size:3.4rem; font-weight:600; float:left; line-height:.82; padding:6px 12px 0 0; color:var(--orange-dark)}
.scrollcue{display:block; text-align:center; color:var(--orange-dark); font-size:1.7rem; margin-top:24px; animation:scrollbounce 1.8s ease-in-out infinite}
@keyframes scrollbounce{0%,100%{transform:translateY(0); opacity:.5} 50%{transform:translateY(8px); opacity:1}}
@media(prefers-reduced-motion:reduce){.scrollcue{animation:none}}
/* Hero refinements */
.hero .article{position:relative}
.hero-meta{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:24px}
.hero-meta .hero-kicker{margin-bottom:10px}
.hero-meta-sep{font-family:var(--font-body); font-weight:600; font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; color:var(--muted)}
/* #94, Artikel-Sub-Header, sticky unter dem Countdown */
.subbar{position:sticky; top:0; z-index:55; background:rgba(253,251,247,.93); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border-bottom:1px solid var(--cream-4); transition:opacity .45s ease, transform .45s ease}
.subbar-inner{max-width:var(--wide); margin:0 auto; padding:9px 22px; display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap}
.subbar .hero-kicker{margin-bottom:0; background:rgba(201,60,42,.09); border-color:rgba(201,60,42,.42); color:#b0432f}
.subbar.is-hidden{opacity:0; transform:translateY(-8px); pointer-events:none}
/* #106, Gamification: Energie-Balken */
/* #110, Batterie verwandelt sich am Ende in 😍 + Pop */
.bm-emoji{opacity:0; transform-box:fill-box; transform-origin:center; pointer-events:none}
.batt-marker.is-full .bm-emoji{opacity:1; animation:emojiPop .6s ease}
.batt-marker.is-full .bm-body,.batt-marker.is-full .bm-cap,.batt-marker.is-full .bm-fill{opacity:0}
@keyframes emojiPop{0%{transform:scale(.5)} 45%{transform:scale(1.4)} 100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.batt-marker.is-full .bm-emoji{animation:none}}
.hero-rule{display:block; width:74px; height:4px; border-radius:4px; background:linear-gradient(90deg,var(--orange),var(--gold)); margin:0 0 24px}
.byline{align-items:center; gap:13px; text-transform:none; letter-spacing:0}
.byline-av{flex:none; width:46px; height:46px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark); font-family:var(--font-head); font-weight:700; font-size:1.02rem; display:flex; align-items:center; justify-content:center; letter-spacing:.01em; object-fit:cover; overflow:hidden}
.byline .byline-txt{display:flex; flex-direction:column; line-height:1.32; text-align:left; font-size:.82rem; color:var(--coffee-400)}
.byline .byline-txt b{color:var(--brand); font-weight:700; font-size:.92rem}
.byline .byline-txt span{font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em}
/* Yes-Ladder */
.check-intro{font-size:1.18rem; color:var(--coffee-400); margin-bottom:6px}
.check{list-style:none; margin:18px 0 26px; padding:0}
.check li{position:relative; padding:15px 0 15px 46px; border-bottom:1px solid var(--cream-4); font-size:1.12rem; line-height:1.5}
.check li:last-child{border-bottom:none}
.check li::before{content:"✓"; position:absolute; left:0; top:13px; width:28px; height:28px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark); font-weight:700; display:flex; align-items:center; justify-content:center; font-size:.92rem}
.check li b{color:var(--orange-dark); font-weight:700}
.check-sad li::before{content:"😔"; background:var(--cream-3); font-size:1.05rem}
/* Development story list (§09) */
.dev-list{list-style:none; margin:6px 0 22px; padding:0}
.dev-list li{position:relative; padding:11px 0 11px 36px; font-size:1.06rem; line-height:1.55; border-bottom:1px solid var(--cream-4)}
.dev-list li:last-child{border-bottom:none}
.dev-list li::before{content:"✓"; position:absolute; left:0; top:12px; width:24px; height:24px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark); font-weight:700; font-size:.8rem; display:flex; align-items:center; justify-content:center}
.dev-list li b{color:var(--brand); font-weight:700}
/* Battery */
.batt-row{display:flex; gap:30px; justify-content:center; flex-wrap:wrap; margin:42px 0 10px}
.batt-unit{text-align:center; width:140px}
.batt{position:relative; width:100%; height:74px; border:4px solid var(--brand); border-radius:10px; background:var(--paper); padding:6px; display:flex; align-items:center}
.batt::after{content:""; position:absolute; right:-12px; top:50%; transform:translateY(-50%); width:8px; height:26px; background:var(--brand); border-radius:0 4px 4px 0}
.batt-fill{height:100%; border-radius:4px; background:linear-gradient(180deg,var(--orange-light),var(--orange))}
.batt-low .batt-fill{background:linear-gradient(180deg,#d98a6a,var(--sale))}
.batt-label{margin-top:12px; font-weight:600; font-size:.95rem}
.batt-cap{font-size:.82rem; color:var(--muted)}
.batt-big{max-width:420px; margin:32px auto; height:120px; border-width:5px}
.batt-big::after{width:12px; height:44px}
.cell-graphic{margin:36px 0 6px}
.cell-graphic img{width:100%; height:auto; border-radius:var(--r); display:block; box-shadow:0 10px 30px rgba(75,51,52,.08)}
.cell-graphic figcaption{display:flex; justify-content:space-between; gap:12px; margin-top:14px; font-size:.84rem; color:var(--muted); text-align:center}
.cell-graphic figcaption span{flex:1}
.cell-graphic figcaption b{color:var(--brand)}
.cell-hero{margin:30px auto; max-width:560px}
.cell-hero img{width:100%; height:auto; border-radius:var(--r); display:block}
.cell-hero.dark img{box-shadow:0 12px 40px rgba(0,0,0,.3)}
/* Energy charts (SVG, §04/§06/§08) */
.echart{margin:34px auto 8px; max-width:720px}
.echart svg{width:100%; height:auto; display:block; overflow:visible}
.echart figcaption{text-align:center; font-size:.86rem; color:var(--muted); margin-top:14px}
.echart .ax{stroke:var(--cream-4); stroke-width:1.5}
.echart .grid{stroke:var(--cream-4); stroke-width:1; opacity:.7}
.echart .vmark{stroke:var(--coffee-400); stroke-width:1.2; stroke-dasharray:4 4; opacity:.45}
.echart .lbl{font-family:var(--font-body); font-size:22px; font-weight:600; fill:var(--coffee-400)}
.echart .lbl-b{font-family:var(--font-body); font-size:21px; font-weight:700; fill:var(--brand)}
.echart .axt{font-family:var(--font-body); font-size:18px; font-weight:700; letter-spacing:.08em; fill:var(--coffee-400)}
/* #90, Diagramme zeichnen sich, WÄHREND man darüber scrollt (--p wird per JS gesetzt, 0→1) */
.echart{--p:1}
.echart .eline{fill:none; stroke-width:5; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--p)); transition:stroke-dashoffset .12s linear}
.echart .ohne{fill:none; stroke-width:3.5; stroke-dasharray:7 7; opacity:calc(var(--p) * .65)}
.echart .earea{opacity:var(--p)}
.echart .reveal{opacity:var(--p)}
/* Scroll-gekoppelte Batterie: Position & Füllung per JS aus --p berechnet */
.batt-marker{pointer-events:none; transition:transform .12s linear}
.batt-marker .bm-fill{transition:width .12s linear, fill .25s linear}
.batt-marker .bm-body{fill:rgba(28,16,12,.55); stroke:#ebd8b2; stroke-width:2}
.batt-marker .bm-cap{fill:#ebd8b2}
.echart:not(.dark) .batt-marker .bm-body{fill:rgba(255,255,255,.9); stroke:var(--brand)}
.echart:not(.dark) .batt-marker .bm-cap{fill:var(--brand)}
.echart3 .e-seq1{stroke-dashoffset:calc(1 - clamp(0, var(--p) * 2, 1))}
.echart3 .e-seq2{stroke-dashoffset:calc(1 - clamp(0, (var(--p) - .45) * 1.85, 1))}
.echart.dark .grid,.echart.dark .ax{stroke:rgba(255,255,255,.18)}
.echart.dark .lbl{fill:rgba(255,255,255,.8)}
.echart.dark .lbl-b{fill:var(--gold-light)}
.echart.dark .axt{fill:rgba(235,216,178,.7)}
.echart.dark figcaption{color:var(--gold-light)}
@media(prefers-reduced-motion:reduce){.echart{--p:1} .link-anim{display:none} .stockbar.in-view i{animation:none}}
.lifestyle-band{margin:0; line-height:0; position:relative}
.lifestyle-band img{width:100%; height:auto; max-height:560px; object-fit:cover; object-position:center 28%; display:block}
.lifestyle-band figcaption{position:absolute; inset:0; display:flex; align-items:center; justify-content:center; padding:24px 32px; background:radial-gradient(130% 100% at 50% 50%, rgba(40,22,22,.56), rgba(40,22,22,.26)); color:#fff; font-family:var(--font-head); font-style:italic; font-size:clamp(1.95rem,4vw,3.3rem); line-height:1.2; text-align:center; text-shadow:0 2px 20px rgba(30,16,16,.45)}
.lifestyle-band figcaption span{max-width:780px}
.lifestyle-band figcaption em{color:var(--gold-light)}
.lifestyle-split{display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; max-width:var(--wide); margin:0 auto}
.lifestyle-split.ls-reverse{grid-template-columns:1.06fr .94fr}
.ls-img{position:relative}
.ls-img img{width:100%; height:auto; border-radius:14px; display:block; box-shadow:0 16px 44px rgba(75,51,52,.16)}
.ls-float{position:absolute; left:-26px; bottom:30px; max-width:236px; background:var(--paper); border:1px solid var(--cream-4); border-radius:16px; padding:13px 18px; font-size:.96rem; line-height:1.34; color:var(--brand); box-shadow:0 18px 44px rgba(75,51,52,.2)}
.ls-float .lf-time{display:block; font-family:var(--font-head); font-weight:700; font-size:1.12rem; color:var(--orange-dark); margin-bottom:1px}
.ls-copy h2{margin-bottom:14px}
.ls-copy h2 em{color:var(--orange-dark); font-style:italic}
@media(max-width:780px){.lifestyle-split{grid-template-columns:1fr; gap:26px} .lifestyle-split.ls-reverse{grid-template-columns:1fr} .ls-copy{order:-1} .ls-float{display:block; position:static; max-width:none!important; margin:12px 0 0; box-shadow:0 10px 26px rgba(75,51,52,.13)}}
.tcard-img{width:100%; height:240px; object-fit:cover; object-position:center 18%; border-radius:8px; margin-bottom:16px}
.rc-head{font-family:var(--font-head); font-weight:700; font-size:1.42rem; color:var(--brand); margin-bottom:9px; line-height:1.2}
.benefits-split{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:stretch; margin-top:10px}
.benefits-split .bs-img{margin:0; display:flex; flex-direction:column}
.benefits-split .bs-img img{width:100%; flex:1 1 auto; min-height:240px; object-fit:cover; object-position:center; border-radius:14px; display:block; box-shadow:0 14px 38px rgba(75,51,52,.14)}
@media(max-width:780px){.benefits-split .bs-img img{flex:none; aspect-ratio:4/5; min-height:0}}
.benefits-split .bs-img figcaption{text-align:center; font-size:.84rem; color:var(--muted); margin-top:12px}
.bs-benefits .benefit{padding:12px 0}
@media(max-width:780px){.benefits-split{grid-template-columns:1fr; gap:24px}}
.benefits-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:18px; max-width:var(--wide); margin:30px auto 0}
.benefits-grid .bcard{display:flex; flex-direction:row; align-items:stretch; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); overflow:hidden; box-shadow:0 8px 24px rgba(75,51,52,.06)}
.benefits-grid .bc-img{width:34%; max-width:150px; flex:none; object-fit:cover; object-position:center; display:block; align-self:stretch; min-height:0; height:auto}
.benefits-grid .bcard{min-height:148px}
.benefits-grid .bc-body{flex:1; display:grid; grid-template-columns:26px 1fr; column-gap:10px; row-gap:6px; align-content:center; padding:14px 16px}
.benefits-grid .bcard .ck{grid-row:1 / span 2; align-self:center}
.benefits-grid .bcard b, .benefits-grid .bcard .bc-d{grid-column:2}
.benefits-grid .bcard .ck{flex:none; width:26px; height:26px; border-radius:50%; background:var(--success-tint); color:var(--success); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.86rem}
.benefits-grid .bcard b{display:block; color:var(--brand); font-size:1.1rem; line-height:1.28; letter-spacing:-.012em}
.benefits-grid .bcard .bc-d{font-size:.88rem; color:var(--coffee-400); line-height:1.45}
@media(max-width:560px){.benefits-grid{grid-template-columns:1fr} .benefits-grid .bc-img{width:38%}}
.tl .tl-day{display:block; font-family:var(--font-body); font-weight:700; font-size:.76rem; text-transform:uppercase; letter-spacing:.1em; color:var(--orange-dark); margin-bottom:4px}
.tl .tl-benefit{display:block; font-family:var(--font-head); font-weight:600; font-size:clamp(1.15rem,1.9vw,1.5rem); color:var(--brand); line-height:1.2; margin-bottom:6px}
.tl .tl-desc{color:var(--coffee-400)}
.tl-emoji{flex:none; width:88px; height:88px; border-radius:14px; background:var(--orange-tint); display:flex; align-items:center; justify-content:center; font-size:2.4rem; box-shadow:0 8px 22px rgba(75,51,52,.12); line-height:1}
@media(max-width:520px){.tl-emoji{width:68px; height:68px; font-size:2rem}}
.ing-split{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; margin:18px 0 26px}
.ing-split .ing-img{margin:0}
.ing-split .ing-img img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:14px; display:block; box-shadow:0 14px 38px rgba(75,51,52,.14)}
.ing-split .ing-benefits .benefit{padding:11px 0}
@media(max-width:780px){.ing-split{grid-template-columns:1fr; gap:22px} .ing-split .ing-img{order:-1}}
.sfacts summary{cursor:pointer; list-style:none; outline:none}
.sfacts summary::-webkit-details-marker{display:none}
.sf-chev{display:inline-block; transition:transform .2s; color:var(--coffee-400); font-size:.8em; margin-left:6px}
.sfacts[open] .sf-chev{transform:rotate(180deg)}
.section-figure{margin:30px auto 4px; max-width:680px}
.section-figure img{width:100%; height:auto; border-radius:var(--r); display:block; box-shadow:0 10px 30px rgba(75,51,52,.08)}
.section-figure figcaption{text-align:center; font-size:.84rem; color:var(--muted); margin-top:12px}
.bg-dark .batt::after,.bg-dark .batt-big::after{background:var(--cream)}
/* Cards / lists */
.cards{display:grid; gap:22px}
.cards-3{grid-template-columns:repeat(3,1fr)}
.cards-2{grid-template-columns:repeat(2,1fr)}
.card{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:30px 28px}
.card .ic{font-size:1.7rem; margin-bottom:10px; display:block}
.fail{display:flex; gap:16px; align-items:flex-start; padding:18px 0; border-bottom:1px solid var(--cream-4)}
.fail:last-child{border-bottom:none}
.fail .x{flex:none; width:30px; height:30px; border-radius:50%; background:var(--neg-tint); color:var(--neg); display:flex; align-items:center; justify-content:center; font-weight:700}
.fail b{display:block}
.fail .q{color:var(--coffee-400); font-style:italic}
.benefit{display:flex; gap:15px; align-items:flex-start; padding:16px 0}
.benefit .ck{flex:none; width:28px; height:28px; border-radius:50%; background:var(--success-tint); color:var(--success); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem}
.benefit b{display:block; margin-bottom:2px}
/* Formula (principle, no product) */
.formula .card{text-align:left; border-top:4px solid var(--orange)}
.formula-stack{max-width:840px; margin:0 auto}
.fcore{background:var(--paper); border:2px solid var(--orange); border-radius:14px; padding:30px 34px; text-align:center; box-shadow:0 16px 40px rgba(190,99,48,.14)}
.fcore h3{font-size:clamp(1.815rem,2.6vw,2rem); margin-bottom:8px}
.fcore p{max-width:580px; margin:0 auto; color:var(--coffee-400)}
.f-badge{display:inline-block; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:#fff; background:var(--orange); padding:5px 14px; border-radius:100px; margin-bottom:12px}
.f-plus{text-align:center; font-family:var(--font-body); font-weight:600; font-size:.95rem; color:var(--orange-dark); margin:14px 0; letter-spacing:.02em}
.fadds{display:grid; grid-template-columns:1fr 1fr; gap:18px}
.fadd{background:var(--cream-3); border:1px solid var(--cream-4); border-radius:12px; padding:22px 24px; text-align:center}
.fadd .f-num{display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark); font-family:var(--font-head); font-weight:700; font-size:1.05rem; margin-bottom:10px}
.fadd h3{font-size:1.2rem; margin-bottom:6px}
.fadd p{font-size:.95rem; color:var(--brand); margin:0}
.fadd .claim-fn{display:block; margin-top:8px; font-size:.76rem; line-height:1.35; color:var(--muted); font-weight:400; font-style:italic}
.fadd .fadd-img{width:100%; aspect-ratio:16/10; object-fit:cover; border-radius:10px; margin:-2px 0 14px; display:block; box-shadow:0 6px 18px rgba(75,51,52,.1)}
.card .card-img{width:100%; aspect-ratio:3/2; object-fit:cover; border-radius:12px; margin:-4px 0 14px; display:block; box-shadow:0 6px 18px rgba(75,51,52,.1)}
/* Beschriftbare Mechanismus-Figuren (Bild/Video + Label-Overlay) */
.mech-fig{position:relative; margin:30px 0; border-radius:var(--r); overflow:hidden; box-shadow:0 12px 32px rgba(75,51,52,.12); line-height:0}
.mech-fig:has(+ .mech-cap){margin-bottom:0}
.mech-fig img, .mech-fig video{width:100%; height:auto; display:block}
.tsr{position:relative; max-width:900px; margin:24px auto 0; border-radius:18px; overflow:hidden; box-shadow:0 16px 42px rgba(75,51,52,.18); aspect-ratio:1672/941; background:#efe7db; line-height:0}
.tsr-anim{position:relative; max-width:820px; margin:24px auto 0; border-radius:18px; overflow:hidden; box-shadow:0 16px 42px rgba(75,51,52,.18); background:#f6dfc8; line-height:0}
.tsr-anim video{width:100%; height:auto; display:block}
.tsr-fx{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:2; mix-blend-mode:screen}
@media(prefers-reduced-motion:reduce){.tsr-fx{display:none}}
.kombi-anim{position:relative; max-width:840px; margin:24px auto 0; border-radius:18px; overflow:hidden; box-shadow:0 16px 42px rgba(75,51,52,.14); line-height:0; background:#f6e6d4}
.kombi-anim img{width:100%; height:auto; display:block}
.kombi-fx{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; z-index:2; mix-blend-mode:screen}
@media(prefers-reduced-motion:reduce){.kombi-fx{display:none}}
.test-toggle{max-width:640px;margin:0 auto}
.test-toggle summary{list-style:none;cursor:pointer;display:block;text-align:center;font-size:.74rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:var(--accent-dark);background:var(--paper);border:1px solid var(--accent-light);border-radius:100px;padding:13px 24px;transition:background .15s}
.test-toggle summary:hover{background:var(--orange-tint)}
.test-toggle summary::-webkit-details-marker{display:none}
.test-toggle summary::after{content:" ▾";font-weight:700}
.test-toggle[open] summary::after{content:" ▴"}
.test-toggle summary .tt-hint{display:block;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted);font-size:.8rem;margin-top:3px}
.tt-body{margin-top:28px}
.tsr video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block}
.tsr .tsr-ov{position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none}
.tsr-ov #tsrK{animation:tcovK 6s ease-in-out infinite}
.tsr-ov #tsrE{animation:tcovE 6s ease-in-out infinite}
.tsr-ov #tsrH{animation:tcovH 6s ease-in-out infinite}
@keyframes tcovK{0%,6%{opacity:1}16%,88%{opacity:0}100%{opacity:1}}
@keyframes tcovE{0%,20%{opacity:1}30%,88%{opacity:0}100%{opacity:1}}
@keyframes tcovH{0%,34%{opacity:1}44%,88%{opacity:0}100%{opacity:1}}
@media(prefers-reduced-motion:reduce){.tsr-ov .tcov{opacity:0; animation:none}}
/* Brücke V4: Kollagen-Motor arbeitet + Alters-Abfall */
.flowfig{max-width:640px; margin:22px auto 0}
.flowfig svg{width:100%; height:auto; display:block}
.flowfig text{font-family:var(--font-body)}
.flowA{position:relative; max-width:680px; margin:24px auto 30px; border-radius:14px; overflow:hidden; line-height:0}
.flowA>img:first-child{width:100%; height:auto; display:block}
.flowball{position:absolute; top:49.9%; width:3.05%; transform:translate(-50%,-50%); pointer-events:none; will-change:transform}
.fb1{left:28.3%; animation:flball 2.3s ease-in-out infinite}
.fb2{left:31.8%; animation:flball 2.3s ease-in-out .55s infinite}
.fb3{left:35.3%; animation:flball 2.3s ease-in-out 1.1s infinite}
@keyframes flball{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(calc(-50% + 3px),-50%) scale(1.13)}}
.flowA .flowov{position:absolute; top:0; left:0; width:100%; height:auto; aspect-ratio:1672/941; pointer-events:none}
@media(prefers-reduced-motion:reduce){.flowball{animation:none}.flowA .flowov{display:none}}
.agepanel{background:#fff; border:1px solid var(--cream-4); border-radius:20px; box-shadow:0 12px 32px rgba(120,60,40,.12); padding:24px 18px 20px; margin:24px auto 0; max-width:660px}
.agerow{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:0; align-items:start}
.agecol{display:flex; flex-direction:column; align-items:center; text-align:center}
.agecirc{width:100%; max-width:140px; aspect-ratio:1; border-radius:50%; overflow:hidden; border:4px solid #fff; box-shadow:0 6px 18px rgba(120,60,40,.16); background:#fff}
.agecirc img{width:100%; height:100%; object-fit:cover; display:block}
.age-n{font-family:var(--font-head); font-weight:700; font-size:clamp(1.15rem,2.3vw,1.55rem); color:var(--brand); margin-top:12px; line-height:1.05}
.age-fibwrap{height:96px; display:flex; align-items:center; justify-content:center; margin-top:8px}
.age-fib{width:84px; height:84px; display:block; transform-origin:center; animation:fibbeat 1.1s ease-in-out infinite}
.age-45 .age-fib{opacity:.82; filter:saturate(.6); animation-duration:2.3s}
.age-65 .age-fib{opacity:.5; filter:saturate(.3) brightness(1.06); animation-duration:4.8s}
@keyframes fibbeat{0%,100%{transform:scale(.9)}50%{transform:scale(1.05)}}
.age-tag{font-family:var(--font-body); font-weight:700; font-size:.82rem; line-height:1.25; margin-top:6px; min-height:2.5em; color:var(--coffee-400)}
.age-25 .age-tag{color:#4fa268}
.age-65 .age-tag{color:#b23a5d}
.agepanel-cap{text-align:center; font-size:.88rem; color:var(--coffee-400); margin-top:14px; padding-top:14px; border-top:1px solid var(--cream-4)}
.agepanel-cap b{color:var(--brand)}
@media(prefers-reduced-motion:reduce){.age-fib{animation:none}}
.agepanel2{position:relative; max-width:700px; margin:24px auto 34px; line-height:0}
.agepanel2>img:first-child{width:100%; height:auto; display:block}
.agefib{position:absolute; transform:translate(-50%,-50%); pointer-events:none; will-change:transform}
.af1{left:19.0%; top:60.5%; width:15.8%; animation:afbeat1 1.5s ease-in-out infinite}
.af2{left:47.9%; top:62.7%; width:12.1%; animation:afbeat2 2.7s ease-in-out infinite}
.af3{left:75.1%; top:63.5%; width:8.7%; animation:afbeat3 4.6s ease-in-out infinite}
@keyframes afbeat1{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.10)}}
@keyframes afbeat2{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.05)}}
@keyframes afbeat3{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.025)}}
@media(prefers-reduced-motion:reduce){.agefib{animation:none}}
.minitest{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:16px auto 30px; max-width:700px}
.mt{background:var(--paper); border:1px solid var(--cream-4); border-left:4px solid var(--gold); border-radius:14px; padding:16px 18px; box-shadow:0 6px 18px rgba(75,51,52,.06)}
.mt-stars{color:#f0a028; font-size:.9rem; letter-spacing:1px}
.mt-h{font-family:var(--font-body); font-weight:800; color:var(--brand); font-size:.98rem; margin:6px 0 5px; line-height:1.2}
.mt p{font-size:.9rem; color:var(--coffee-400); line-height:1.45; margin:0 0 8px}
.mt-who{font-size:.78rem; color:var(--muted); font-weight:600}
.mt-who .tag{color:var(--muted); font-weight:400; margin-left:4px}
@media(max-width:640px){.minitest{grid-template-columns:1fr}.agepanel{padding:18px 12px 16px}.agerow{gap:8px}.age-fibwrap{height:74px}.age-fib{width:62px; height:62px}.agecirc{max-width:104px}.agefib{display:none}}
.mech-lab{position:absolute; transform:translateX(-50%); background:rgba(253,251,247,.93); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); border:1px solid var(--cream-4); border-radius:100px; padding:5px 13px; font-size:.82rem; font-weight:700; color:var(--brand); white-space:nowrap; box-shadow:0 4px 12px rgba(0,0,0,.12); line-height:1.2; text-align:center}
.mech-lab.trip{color:#fff; background:var(--orange-dark); border-color:var(--orange-dark); font-size:.9rem; letter-spacing:.01em}
.mech-lab.wall{background:rgba(45,28,28,.82); color:#fff; border:none; font-size:.74rem; font-weight:600}
.mech-lab.gold{background:var(--gold-light); border-color:#d7bd87; color:var(--brand)}
.mech-cap{display:flex; justify-content:space-between; gap:12px; margin:12px 2px 30px; font-size:.84rem; color:var(--muted); text-align:center}
.mech-cap span{flex:1}
.mech-cap b{color:var(--brand)}
.cellfig{isolation:isolate}
.cellglow{position:absolute; left:67%; top:52%; width:34%; height:52%; transform:translate(-50%,-50%); border-radius:50%; background:radial-gradient(ellipse at center, rgba(196,44,84,1), rgba(196,44,84,.55) 42%, rgba(196,44,84,0) 72%); mix-blend-mode:multiply; opacity:0; pointer-events:none; will-change:opacity}
.celllab small{display:block; font-weight:600; font-size:.82em; opacity:.72}
@media(prefers-reduced-motion:reduce){.cellglow{opacity:.32}}
.step-h{font-family:var(--font-head); font-weight:600; font-size:clamp(1.876rem,2.9vw,2.15rem); line-height:1.24; letter-spacing:-.01em; margin:36px 0; color:var(--brand); text-wrap:balance}
.article .step-h, .col .step-h{margin-top:36px; margin-bottom:36px}
.step-h em{font-style:italic; color:var(--orange-dark)}
@media(max-width:560px){.mech-lab{font-size:.64rem; padding:4px 9px; white-space:normal; max-width:31%; text-align:center; line-height:1.25; border-radius:14px} .mech-lab.trip{font-size:.7rem} .mech-lab.wall{font-size:.58rem}}
/* Fibroblast-Aufbau: echtes Video + JS-synchrone Overlays (gekoppelt an video.currentTime) */
.fib-fig{position:relative; border-radius:16px; overflow:hidden; box-shadow:0 14px 38px rgba(75,51,52,.18); line-height:0; margin:30px 0}
.fib-fig video{width:100%; display:block}
.fib-ov{position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none}
.fib-ov .glow2,.fib-ov .ln2,.fib-ov .ln3,.fib-ov .ln4,.fib-ov .ln5,.fib-ov .hyal{opacity:0}
.fib-trip2{position:absolute; width:19%; left:9%; top:53%; transform:translate(-50%,-50%); z-index:4; opacity:0}
.fib-trip2 svg{width:100%; height:auto; display:block}
.fib-lab{position:absolute; transform:translate(-50%,-50%); background:rgba(45,28,28,.86); color:#fff; font-family:var(--font-body); font-weight:700; font-size:clamp(.62rem,1.55vw,.9rem); padding:5px 12px; border-radius:100px; white-space:nowrap; box-shadow:0 4px 14px rgba(0,0,0,.34); display:flex; align-items:center; gap:7px; line-height:1.15; z-index:3; opacity:0}
.fib-lab .n{display:inline-flex; align-items:center; justify-content:center; width:1.4em; height:1.4em; border-radius:50%; color:#fff; font-size:.74em; font-weight:800; flex:none}
.fib-lab .n1,.fib-lab .n2{background:#b23a5d}.fib-lab .n3{background:#c39a3f}.fib-lab .n4{background:#8f86c9}.fib-lab .n5{background:#4fa268}
@media(max-width:560px){.fib-lab{font-size:.55rem; padding:4px 8px; gap:5px}}
/* Zusicherungs-Leiste ueber den Offer-Karten: 3 Spalten statt 3 Bloecke (Rafael 17.7.) */
.assure{max-width:1000px; margin:30px auto 30px; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r);
  display:grid; grid-template-columns:repeat(3,1fr); box-shadow:0 8px 24px rgba(75,51,52,.06); overflow:hidden}
.as-i{display:flex; gap:11px; align-items:flex-start; padding:15px 18px; border-left:1px solid var(--cream-4); text-align:left}
.as-i:first-child{border-left:0; background:linear-gradient(180deg,var(--success-tint),rgba(231,245,236,.35))}
.as-ic{font-size:1.15rem; line-height:1.3; flex:none}
.as-i b{display:block; font-size:.92rem; line-height:1.3; color:var(--brand)}
.as-i span{display:block; font-size:.78rem; line-height:1.4; color:var(--coffee-400); margin-top:2px}
.as-i:first-child b{color:#14572f}
.boffer[data-mode="einmal"] + .assure .as-svc{display:none}
.boffer[data-mode="einmal"] + .assure{grid-template-columns:repeat(2,1fr)}
@media(max-width:760px){
  .assure{grid-template-columns:1fr}
  .as-i{border-left:0; border-top:1px solid var(--cream-4); padding:13px 16px}
  .as-i:first-child{border-top:0}
}

/* Echte Bewertungen: Initialen statt Fotos (Rafael 17.7.) */
.rev3{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; max-width:1000px; margin:34px auto 0}
.rev{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:22px 20px; box-shadow:0 8px 24px rgba(75,51,52,.06)}
.rev-top{display:flex; gap:12px; align-items:center; margin-bottom:12px}
.rev-av{width:44px; height:44px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark);
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:1rem; flex:none; overflow:hidden}
.rev-av img{width:100%; height:100%; border-radius:50%; object-fit:cover; display:block}
.rev-st{color:var(--gold); font-size:.9rem; letter-spacing:.05em; line-height:1.2}
.rev-who{font-size:.82rem; color:var(--coffee-400)}
.rev-h{font-size:1.08rem; font-weight:700; color:var(--orange-dark); margin-bottom:8px; line-height:1.25}
.rev p{font-size:.92rem; line-height:1.5; color:var(--coffee-400); margin:0 0 10px}
.rev-badge{display:inline-block; background:var(--success-tint); color:#1d8a45; font-size:.7rem; font-weight:700; padding:3px 9px; border-radius:100px}
@media(max-width:820px){.rev3{grid-template-columns:1fr}}

/* Verknappung: alles mittig, Balken laeuft runter, Kauf-Symbole steigen auf (Rafael 17.7.) */
.sc2{max-width:660px; margin:0 auto; text-align:center}
.sc2 p{margin-left:auto; margin-right:auto}
.sc2-bar{position:relative; max-width:520px; margin:26px auto 36px; padding-top:58px}
.sc2-flow{position:absolute; inset:0 0 auto 0; height:58px; overflow:hidden; pointer-events:none}
.sc2-pop{position:absolute; bottom:-6px; font-size:1.45rem; line-height:1; opacity:0; will-change:transform,opacity; filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
@keyframes scRise{
  0%{opacity:0; transform:translateY(8px) scale(.6)}
  16%{opacity:1; transform:translateY(-4px) scale(1.05)}
  30%{transform:translateY(-14px) scale(1)}
  100%{opacity:0; transform:translateY(-54px) scale(.9)}
}
.sc2-track{height:14px; border-radius:100px; background:rgba(255,255,255,.16); overflow:hidden}
.sc2-fill{display:block; height:100%; width:88%; border-radius:100px;
  background:linear-gradient(90deg,var(--orange-light),var(--gold-light))}
/* 10s runter, danach pulsieren (Rafael 17.7.) */
.sc2-bar.run .sc2-fill{animation:deplete 20s linear forwards, stockBlink 1.1s ease-in-out 20s infinite}
.sc2-legend{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:10px; font-size:.8rem; color:var(--gold-light)}
.sc2-legend b{color:#fff; font-size:.95rem}
.sc2-live{display:inline-flex; align-items:center; gap:7px; line-height:1}
.sc2-dot{flex:none; width:7px; height:7px; border-radius:50%; background:#5ed080; animation:scPulse 1.6s ease-in-out infinite}
@keyframes scPulse{0%,100%{opacity:1; transform:scale(1)}50%{opacity:.45; transform:scale(.75)}}
.sc2-u{text-decoration:none; background:linear-gradient(transparent 62%, rgba(235,216,178,.45) 62%); padding:0 4px; color:var(--gold-light); font-style:normal}
.sc2-hook{font-size:clamp(1.02rem,1.7vw,1.16rem); line-height:1.5; color:#f0dcd6; max-width:560px; margin:0 auto}
.sc2-hook strong{color:#fff}
@media(max-width:520px){.sc2-legend{flex-direction:column; align-items:center; gap:4px}}
@media(prefers-reduced-motion:reduce){
  .sc2-fill{width:10%!important; animation:none!important}
  .sc2-dot{animation:none} .sc2-flow{display:none}
}

/* Preis-Anker: Tagespreis als Balken, Jahressumme als Schock (Rafael 17.7.) */
.pb{max-width:680px; margin:24px auto 0; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:24px 22px; box-shadow:0 10px 30px rgba(75,51,52,.07)}
.pb-row{display:grid; grid-template-columns:182px 1fr 92px; gap:14px; align-items:center; margin-bottom:14px}
.pb-lab{font-size:.9rem; line-height:1.25; color:var(--brand)}
.pb-lab small{display:block; font-size:.74rem; color:var(--coffee-400)}
.pb-track{height:20px; border-radius:100px; background:var(--cream-3); overflow:hidden}
.pb-fill{display:block; height:100%; width:0; border-radius:100px; transition:width 1.3s cubic-bezier(.2,.85,.25,1)}
/* Farbskala: teuerster Posten rot, dann orange, Ampulle gruen (Rafael 17.7.) */
.pb-fill--red{background:linear-gradient(90deg,#d8604e,#b00023)}
.pb-fill--orangered{background:linear-gradient(90deg,#e2907f,#d2603f)}
.pb-fill--orange{background:linear-gradient(90deg,#f0b96a,#e0891e)}
.pb-fill--win{background:linear-gradient(90deg,#7bc98f,#2f9e57)}
/* Breiten anteilig zum Tagespreis (3,90 = 100%), per CSS statt JS */
.pb.in .pb-fill--red{width:100%}
.pb.in .pb-fill--orangered{width:42%}
.pb.in .pb-fill--orange{width:41%}
.pb.in .pb-fill--win{width:38%}
.pb-val{text-align:right; line-height:1.15}
.pb-val b{display:block; font-size:1.12rem; font-weight:800; color:var(--brand)}
.pb-val small{display:block; font-size:.72rem; color:var(--coffee-400)}
.pb-row--win .pb-lab{font-weight:700} .pb-row--win .pb-val b{color:#1d8a45}
.pb-note{margin-top:16px; padding-top:14px; border-top:1px dashed var(--cream-4); text-align:center; font-size:1.02rem; font-weight:600}
@media(max-width:560px){.pb-row{grid-template-columns:1fr 84px; gap:8px} .pb-track{grid-column:1/-1; order:3}}
@media(prefers-reduced-motion:reduce){.pb-fill{transition:none}}

/* Strecken-Kurve: Wirkungsverlauf + Paket-Reichweite auf einer Achse (Rafael 17.7.) */
.skv{max-width:760px; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:24px 22px 18px; box-shadow:0 10px 30px rgba(75,51,52,.07)}
.skv svg{width:100%; height:auto; display:block}
.skv-cap{margin:12px 0 0; font-size:.92rem; color:var(--coffee-400); text-align:center}
.skv-cap strong{color:var(--brand)}
/* Grafik genau so breit wie der Text, Bildunterschrift darueber (Rafael 17.7.) */
.skv--wide{max-width:none; width:100%; margin:26px 0 0}
.skv-cap--top{margin:0 0 16px; font-size:.98rem}
.skv .bar{transition:width 1.5s cubic-bezier(.2,.85,.25,1)}
.skv .cut{opacity:0; transition:opacity .5s ease 1.2s}
.skv.in .b1{width:97px} .skv.in .b3{width:290px} .skv.in .b6{width:580px} .skv.in .bAbo{width:600px}
.skv.in .cut{opacity:1}
.skv .cv-line{stroke-dasharray:900; stroke-dashoffset:900; transition:stroke-dashoffset 1.8s ease}
.skv.in .cv-line{stroke-dashoffset:0}
@media(prefers-reduced-motion:reduce){.skv .bar,.skv .cv-line,.skv .cut{transition:none} .skv .cv-line{stroke-dashoffset:0} .skv .cut{opacity:1}}

/* Doppel-Glow: Grafik auf weisser Karte, Glow-Tipp in der Box (Rafael 17.7.) */
.cellbuild{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:22px 20px 16px; box-shadow:0 10px 30px rgba(75,51,52,.08)}
.glow-tipp{margin-top:16px; padding-top:14px; border-top:1px dashed var(--gold); font-size:.95rem; line-height:1.5; color:var(--coffee-400)}
.glow-tipp .gt-tag{display:inline-block; font-weight:700; color:var(--orange-dark); margin-right:6px}
.glow-tipp strong{color:var(--brand)}
/* Glow-Tipp zuerst und prominent, Anwendung darunter (Rafael 17.7.) */
.glow-tipp--lead{margin-top:0; padding-top:0; border-top:0}
.glow-tipp--lead .gt-tag{display:block; font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; margin:0 0 8px}
.gt-head{margin:0; font-size:clamp(1.28rem,1.9vw,1.28rem); font-weight:600; line-height:1.35; color:var(--brand)}
.gt-how{margin-top:16px; padding-top:14px; border-top:1px dashed var(--gold)}
.gt-how-l{display:block; font-size:1.16rem; font-weight:700; letter-spacing:0; text-transform:none; color:var(--brand); margin-bottom:7px; line-height:1.3}
.gt-how p{margin:0; font-size:.95rem; line-height:1.5; color:var(--coffee-400)}
.gt-how strong{color:var(--brand)}

/* Mechanik-Grafik: fotorealistischer Fibroblast-Hub (V1) + Doppel-Glow (V2) */
.hub{position:relative;max-width:560px;margin:16px auto 0;border-radius:18px;overflow:hidden;box-shadow:0 14px 38px rgba(75,51,52,.16);aspect-ratio:1/1}
.hub video{width:100%;height:100%;object-fit:cover;display:block}
.hubov{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none}
.hub .circ{position:absolute;border-radius:50%;overflow:hidden;box-shadow:0 6px 20px rgba(120,60,40,.28);border:3px solid rgba(255,250,244,.85);z-index:4}
.hub .circ img{width:100%;height:100%;object-fit:cover;display:block}
.hub .hlab{position:absolute;transform:translate(-50%,-50%);background:rgba(45,28,28,.86);color:#fff;font-family:var(--font-body);font-weight:700;font-size:clamp(.58rem,1.5vw,.82rem);padding:5px 11px;border-radius:100px;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,.32);z-index:5}
.hub .hlab.beere{background:#9a2f4e}.hub .hlab.gold{background:#b98a2e}
.hub .hbadge{position:absolute;left:50%;top:2%;transform:translateX(-50%);background:linear-gradient(90deg,#9a2f4e,#c9a24a);color:#fff;font-family:var(--font-body);font-weight:800;font-size:clamp(.6rem,1.5vw,.8rem);padding:6px 15px;border-radius:100px;box-shadow:0 5px 16px rgba(0,0,0,.25);white-space:nowrap;z-index:6}
.hub .hmol{offset-rotate:0deg;opacity:0}
.hub .h1{offset-path:path("M405 360 L162 162");animation:hFlow 2.4s linear infinite}
.hub .h2{offset-path:path("M405 360 L162 162");animation:hFlow 2.4s linear infinite;animation-delay:-1.2s}
.hub .h3{offset-path:path("M405 360 L738 162");animation:hFlow 2.4s linear infinite;animation-delay:-.5s}
.hub .h4{offset-path:path("M405 360 L738 162");animation:hFlow 2.4s linear infinite;animation-delay:-1.7s}
.hub .h5{offset-path:path("M405 360 L450 756");animation:hFlow 2.4s linear infinite;animation-delay:-.9s}
.hub .h6{offset-path:path("M405 360 L450 756");animation:hFlow 2.4s linear infinite;animation-delay:-2s}
@keyframes hFlow{0%{offset-distance:6%;opacity:0}20%{opacity:1}85%{opacity:1}100%{offset-distance:92%;opacity:0}}
@media(prefers-reduced-motion:reduce){.hub .hmol{opacity:0;animation:none}}
/* Rollen-Grafik: Baustein (Kollagen) + Startsignal (Tripeptid) = Aufbau in der Zelle */
.cellbuild{margin:24px auto 8px; max-width:640px}
.cellbuild svg{width:100%; height:auto; display:block; overflow:visible}
.cellbuild text{font-family:var(--font-head),sans-serif}
.cb-card{opacity:0; transform:translateY(-10px); transition:opacity .6s ease, transform .6s ease; transform-box:fill-box; transform-origin:center}
.cellbuild.in .cb-card{opacity:1; transform:none}
.cellbuild.in .cb-card.cb-c1{transition-delay:.05s}
.cellbuild.in .cb-card.cb-c2{transition-delay:.26s}
.cb-stream{opacity:0; transition:opacity .5s ease .5s}
.cellbuild.in .cb-stream{opacity:1; stroke-dasharray:6 10; animation:cbFlow 1.1s linear .7s infinite}
@keyframes cbFlow{to{stroke-dashoffset:-16}}
.cb-brickdot{opacity:0; transition:opacity .4s ease .7s}
.cellbuild.in .cb-brickdot{opacity:1}
.cb-spark{opacity:0; transform-box:fill-box; transform-origin:center}
.cellbuild.in .cb-spark{opacity:1; animation:cbSpark 1.6s ease-in-out .95s infinite}
@keyframes cbSpark{0%,100%{transform:scale(1); opacity:.92}50%{transform:scale(1.2); opacity:1}}
.cb-glow{opacity:0}
.cellbuild.in .cb-glow{animation:cbGlow 2.6s ease-in-out 1s infinite}
@keyframes cbGlow{0%,100%{opacity:.22}50%{opacity:.55}}
.cb-cellbody{opacity:0; transform:scale(.9); transform-box:fill-box; transform-origin:center; transition:opacity .6s ease .55s, transform .7s cubic-bezier(.2,.8,.3,1) .55s}
.cellbuild.in .cb-cellbody{opacity:1; transform:none}
.cb-fiber{stroke-dasharray:100; stroke-dashoffset:100; transition:stroke-dashoffset 1.25s ease 1.15s}
.cellbuild.in .cb-fiber{stroke-dashoffset:0}
.cellbuild .cb-lab{opacity:0; transition:opacity .5s ease}
.cellbuild.in .cb-lab{opacity:1}
.cellbuild.in .cb-lab.l-cell{transition-delay:.7s}
.cellbuild.in .cb-lab.l-fiber{transition-delay:1.55s}
.cb-sum{text-align:center; font-family:var(--font-head); font-weight:600; color:var(--brand); font-size:clamp(1.02rem,2.3vw,1.3rem); margin:14px 2px 30px; line-height:1.35}
.cb-sum b{color:var(--orange-dark)}
.cb-sum .cb-plus{color:var(--gold); font-weight:800; padding:0 2px}
@media(prefers-reduced-motion:reduce){
  .cellbuild .cb-card,.cellbuild .cb-stream,.cellbuild .cb-brickdot,.cellbuild .cb-spark,.cellbuild .cb-cellbody,.cellbuild .cb-lab{opacity:1; transform:none; animation:none; transition:none}
  .cellbuild .cb-stream{stroke-dasharray:none}
  .cellbuild .cb-fiber{stroke-dashoffset:0; transition:none}
  .cellbuild .cb-glow{opacity:.4; animation:none}
}
@media(max-width:600px){.fadds{grid-template-columns:1fr}}
.formula-puzzle{max-width:880px; margin:14px auto 0}
.formula-puzzle svg{width:100%; height:auto; display:block; overflow:visible}
.formula-puzzle .pz-tag{font-family:var(--font-body); font-weight:700; font-size:14px; letter-spacing:.12em; text-transform:uppercase}
.formula-puzzle .pz-name{font-family:var(--font-head); font-weight:700; font-size:30px; fill:var(--brand)}
.formula-puzzle .pz-role{font-family:var(--font-body); font-weight:600; font-size:16px; fill:var(--coffee-400)}
@media(max-width:680px){.formula-puzzle .pz-name{font-size:34px} .formula-puzzle .pz-tag{font-size:17px} .formula-puzzle .pz-role{font-size:19px}}
.venn-legend{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:840px; margin:22px auto 0; font-size:.92rem; line-height:1.5; color:var(--coffee-400)}
.venn-legend b{color:var(--brand)}
.venn-legend em{color:var(--orange-dark); font-style:italic}
@media(max-width:680px){.venn-legend{grid-template-columns:1fr; gap:12px} .formula-venn .v-name{font-size:26px}}
.formula-name{text-align:center; max-width:780px; margin:42px auto 0}
.formula-name span{display:block; font-size:1.05rem; color:var(--coffee-400); margin-bottom:12px}
.formula-name strong{font-family:var(--font-head); font-style:italic; font-weight:600; font-size:clamp(2.299rem,3.6vw,2.7rem); color:var(--orange-dark); display:block; line-height:1.15}
.card .num{display:inline-flex; align-items:center; justify-content:center; width:46px; height:46px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark); font-family:var(--font-head); font-weight:700; font-size:1.25rem; margin-bottom:14px}
.trust-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:16px 10px; margin-top:34px; border-top:1px solid var(--cream-4); padding-top:34px; justify-items:center}
.trust-stats div{text-align:center}
.trust-stats .ts-circle{width:138px; height:138px; border-radius:50%; background:var(--orange-tint); border:1.5px solid var(--gold-light); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; margin:0 auto; padding:12px; box-shadow:0 6px 18px rgba(190,99,48,.1)}
.trust-stats b{font-family:var(--font-body); font-weight:700; font-size:1.25rem; color:var(--orange-dark); line-height:1; white-space:nowrap}
.trust-stats .ts-label{font-family:var(--font-body); font-weight:700; font-size:.68rem; color:var(--orange-dark); line-height:1.22; text-align:center}
@media(max-width:620px){.trust-stats{grid-template-columns:repeat(2,1fr)}}
/* Authority-Split: Bild links, Stats als 2x2 rechts */
.authority-split{display:grid; grid-template-columns:1.05fr .95fr; gap:44px; align-items:center; margin-top:34px; border-top:1px solid var(--cream-4); padding-top:40px}
.as-media{position:relative; border-radius:18px; overflow:hidden; aspect-ratio:4/5; background:var(--orange-tint); border:1.5px solid var(--gold-light); box-shadow:0 12px 32px rgba(190,99,48,.14)}
.as-media img{width:100%; height:100%; object-fit:cover; object-position:center top; display:block}
.as-media .as-ph{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; text-align:center; padding:24px; color:var(--orange-dark); font-family:var(--font-body); font-weight:600; font-size:.92rem; line-height:1.45}
.trust-stats--2x2{grid-template-columns:repeat(2,1fr) !important; margin-top:0; border-top:none; padding-top:0; gap:24px 14px}
/* Trust-Split: SJP-Foto links | Kreise rechts */
.trust-split{display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1fr); gap:34px; align-items:center; margin-top:34px}
.trust-photo{margin:0; position:relative}
.trust-photo img{width:100%; aspect-ratio:4/5; object-fit:cover; object-position:58% 32%; border-radius:var(--r); display:block; box-shadow:0 16px 42px rgba(75,51,52,.16)}
.trust-photo figcaption{position:absolute; left:14px; bottom:14px; background:rgba(253,251,247,.93); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px); border:1px solid var(--cream-4); color:var(--brand); font-size:.76rem; font-weight:600; padding:6px 13px; border-radius:100px; box-shadow:0 5px 14px rgba(0,0,0,.09)}
.trust-photo figcaption b{color:var(--orange-dark)}
@media(max-width:720px){.trust-split{grid-template-columns:1fr; gap:22px} .trust-photo img{aspect-ratio:16/11; object-position:58% 30%}}
/* Lifestyle-Split (Wunsch-Peak, Energy-Stil) + Snapshot-Platzhalter */
.ls2{display:grid; grid-template-columns:1.05fr .95fr; gap:44px; align-items:center}
.ls2 h2{text-align:left}
.snap{margin:0; aspect-ratio:4/3; background:linear-gradient(160deg,var(--cream-3),var(--orange-tint)); border:1px dashed var(--accent-light); border-radius:var(--r); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; color:var(--coffee-400); font-weight:600; font-size:.92rem; padding:14px; gap:4px}
.snap span{font-weight:400; font-size:.78rem; color:var(--muted)}
@media(max-width:760px){.ls2{grid-template-columns:1fr; gap:26px} .ls2 h2{text-align:center}}
/* 6-Monats-Grafiken (animiert, 3 Varianten) */
.g-wrap{max-width:760px; margin:30px auto; display:grid; gap:18px}
.g-card{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:22px 24px 20px; box-shadow:0 8px 24px rgba(120,60,80,.06)}
.g-title{font-family:var(--font-body); font-weight:700; font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:var(--coffee-400); margin-bottom:18px}
.g-title b{color:var(--orange-dark)}
/* V1 Balken */
.g-bars{display:flex; align-items:flex-end; gap:20px; height:190px; padding:0 6px}
.g-bcol{flex:1; display:flex; flex-direction:column; align-items:center; height:100%; justify-content:flex-end}
.g-bar{width:100%; max-width:90px; border-radius:10px 10px 0 0; position:relative; transform:scaleY(0); transform-origin:bottom; transition:transform 1.1s cubic-bezier(.2,.85,.25,1); height:var(--h)}
.g-anim.in .g-bar{transform:scaleY(1)}
.g-bar.b1{background:linear-gradient(180deg,var(--accent-light),var(--orange-dark))}
.g-bar.b2{background:linear-gradient(180deg,#e7cf9a,var(--gold))}
.g-bar.b3{background:linear-gradient(180deg,#e3d9c8,#c9bda6)}
.g-bar span{position:absolute; top:-26px; left:50%; transform:translateX(-50%); font-family:var(--font-head); font-weight:700; font-size:1.15rem; color:var(--brand); white-space:nowrap}
.g-blabel{margin-top:10px; font-size:.8rem; font-weight:600; color:var(--coffee-400); text-align:center; line-height:1.2}
/* V2 Kurve */
.g-line-svg{width:100%; height:auto; display:block}
.g-line-svg path.gl{fill:none; stroke-width:3.5; stroke-linecap:round; stroke-dasharray:600; stroke-dashoffset:600; transition:stroke-dashoffset 1.6s ease}
.g-anim.in .g-line-svg path.gl{stroke-dashoffset:0}
.g-leg{display:flex; gap:16px; flex-wrap:wrap; justify-content:center; margin-top:12px; font-size:.8rem; color:var(--coffee-400); font-weight:600}
.g-leg span{display:inline-flex; align-items:center; gap:6px}
.g-leg i{width:14px; height:4px; border-radius:2px; display:inline-block}
/* V3 Effekt-Meter */
.g-meter{display:grid; gap:14px}
.g-mrow{display:grid; grid-template-columns:120px 1fr auto; align-items:center; gap:12px}
.g-mrow .g-mlab{font-size:.85rem; font-weight:600; color:var(--brand)}
.g-track{height:16px; background:var(--cream-3); border-radius:100px; overflow:hidden}
.g-fill{height:100%; border-radius:100px; width:0; transition:width 1.3s cubic-bezier(.2,.85,.25,1)}
.g-anim.in .g-fill{width:var(--w)}
.g-mval{font-family:var(--font-head); font-weight:700; font-size:.95rem; color:var(--brand); min-width:62px; text-align:right}
@media(max-width:560px){.g-mrow{grid-template-columns:90px 1fr auto} .g-bars{gap:12px}}
/* Kollagen-Abnahme-Grafik (4 Gesichter + fallende Linie) */
.decline-faces{display:grid; grid-template-columns:repeat(4,1fr); gap:10px}
.decline-col{text-align:center; opacity:0; transform:translateY(12px) scale(.96); transition:opacity .55s ease, transform .55s ease}
.g-anim.in .decline-col{opacity:1; transform:none}
.g-anim.in .decline-col:nth-child(1){transition-delay:.2s}
.g-anim.in .decline-col:nth-child(2){transition-delay:.5s}
.g-anim.in .decline-col:nth-child(3){transition-delay:.85s}
.g-anim.in .decline-col:nth-child(4){transition-delay:1.2s}
.decline-col img{width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; display:block; box-shadow:0 6px 16px rgba(75,51,52,.12)}
.decline-col .d-age{font-family:var(--font-head); font-weight:700; font-size:1.02rem; color:var(--brand); margin-top:9px; line-height:1}
.decline-col .d-pct{font-size:.8rem; font-weight:700; margin-top:3px}
.decline-svg{width:100%; height:auto; display:block; margin-top:10px; overflow:visible}
.decline-svg path.dl{fill:none; stroke:var(--orange-dark); stroke-width:4; stroke-linecap:round; stroke-linejoin:round; opacity:0; transition:opacity .7s ease .3s}
.g-anim.in .decline-svg path.dl{opacity:1}
.decline-svg .dl-base{stroke:var(--cream-4); stroke-width:2}
.decline-svg .dl-area{opacity:0; transition:opacity 1.2s ease .5s}
.g-anim.in .decline-svg .dl-area{opacity:1}
.decline-svg .dl-dot{opacity:0; transform:scale(.3); transform-box:fill-box; transform-origin:center; stroke:#fff; stroke-width:2; transition:opacity .35s ease, transform .35s cubic-bezier(.34,1.56,.64,1)}
.g-anim.in .decline-svg .dl-dot{opacity:1; transform:scale(1)}
.g-anim.in .decline-svg .dl-dot:nth-of-type(1){transition-delay:.2s}
.g-anim.in .decline-svg .dl-dot:nth-of-type(2){transition-delay:.5s}
.g-anim.in .decline-svg .dl-dot:nth-of-type(3){transition-delay:.85s}
.g-anim.in .decline-svg .dl-dot:nth-of-type(4){transition-delay:1.2s}
.decline-svg .dlbl{font-size:11px; fill:var(--muted); font-weight:600}
/* §06 Motor-Doppelkurve (dunkel), greift §03-Kurve auf, enthüllt den Motor darunter */
.mgraph{max-width:640px; margin:30px auto}
.tricmp{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:stretch;gap:0;margin:30px 0;background:var(--paper);border:1px solid var(--cream-4);border-radius:16px;padding:26px 12px;box-shadow:0 8px 24px rgba(75,51,52,.06)}
.tc-col{text-align:center;padding:0 10px}
.tc-col + .tc-col{border-left:1px solid var(--cream-4)}
.tc-viz{height:96px;display:grid;place-items:center}
.tc-mol{border-radius:50%}
.tc-big{width:80px;height:80px;background:radial-gradient(circle at 34% 30%,#c76b86,#8f2b49);box-shadow:inset 0 -5px 12px rgba(0,0,0,.18)}
.tc-mid{width:34px;height:34px;background:radial-gradient(circle at 34% 30%,#f0c86a,#d99a1e);box-shadow:0 5px 12px rgba(217,154,30,.4)}
.tc-empty{width:72px;height:72px;border:2.5px dashed var(--cream-4);border-radius:50%;display:grid;place-items:center;color:var(--muted);font-size:1.7rem;font-weight:800}
.tc-name{font-weight:800;color:var(--brand);font-size:.92rem;margin-top:9px;line-height:1.2}
.tc-note{font-size:.78rem;margin-top:5px;font-weight:700}
.tc-bad{color:#c0392b}.tc-good{color:#1d8a45}.tc-mys{color:var(--muted)}
.bioready-fig .mm-cover{position:absolute;top:0;right:0;width:33.4%;height:100%;background:linear-gradient(90deg,rgba(244,238,228,.4),rgba(244,238,228,.93) 46%);backdrop-filter:blur(9px) saturate(.5);-webkit-backdrop-filter:blur(9px) saturate(.5);border-left:2px dashed rgba(178,58,93,.5);display:grid;place-items:center;z-index:1;border-radius:0 var(--r) var(--r) 0}
.bioready-fig .mm-q{color:var(--accent);font-size:clamp(2.4rem,8vw,4.4rem);font-weight:800;line-height:1;text-shadow:0 2px 10px rgba(0,0,0,.1)}
.bioready-fig .mech-lab{z-index:2}
@media(max-width:560px){.tricmp{padding:20px 6px}.tc-col{padding:0 5px}.tc-big{width:58px;height:58px}.tc-empty{width:52px;height:52px;font-size:1.3rem}.tc-name{font-size:.8rem}.tc-note{font-size:.7rem}}
.sizecmp{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px;margin:30px 0;background:var(--paper);border:1px solid var(--cream-4);border-radius:16px;padding:28px 22px;box-shadow:0 8px 24px rgba(75,51,52,.06)}
.sc-col{text-align:center}
.sc-viz{height:110px;display:grid;place-items:center}
.sc-mol{border-radius:50%}
.sc-big{width:94px;height:94px;background:radial-gradient(circle at 34% 30%,#c76b86,#8f2b49);box-shadow:0 8px 20px rgba(143,43,73,.35),inset 0 -6px 14px rgba(0,0,0,.18)}
.sc-small{width:20px;height:20px;background:radial-gradient(circle at 34% 30%,#f0c86a,#d99a1e);box-shadow:0 6px 14px rgba(217,154,30,.45)}
.sc-name{font-weight:800;color:var(--brand);font-size:1rem;margin-top:8px}
.sc-note{font-size:.85rem;margin-top:5px;font-weight:700}
.sc-bad{color:#c0392b}
.sc-good{color:#1d8a45}
.sc-wall{align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:0 4px}
.sc-line{width:0;height:118px;border-left:3px dashed var(--cream-4)}
.sc-wlab{font-size:.7rem;font-weight:700;letter-spacing:.05em;color:var(--muted);writing-mode:vertical-rl;transform:rotate(180deg)}
@media(max-width:560px){.sizecmp{grid-template-columns:1fr;gap:14px}.sc-wall{flex-direction:row;gap:10px}.sc-line{width:100%;height:0;border-left:0;border-top:3px dashed var(--cream-4)}.sc-wlab{writing-mode:horizontal-tb;transform:none}}
.mg-card{background:rgba(255,255,255,.045); border:1px solid rgba(235,216,178,.22); border-radius:16px; padding:24px 26px 20px; box-shadow:0 14px 36px rgba(0,0,0,.30); position:relative}
.mg-face{position:absolute; width:clamp(52px,9vw,80px); height:clamp(52px,9vw,80px); border-radius:50%; object-fit:cover; object-position:center 22%; box-shadow:0 6px 18px rgba(0,0,0,.5); z-index:2}
.mg-face-young{left:8px; top:48%; transform:translateY(-50%); border:2px solid rgba(235,216,178,.6)}
.mg-face-old{right:10px; top:12px; border:2px solid rgba(242,169,191,.65)}
@media(max-width:520px){.mg-face{width:44px; height:44px}}
.mg-title{font-family:var(--font-body); font-weight:700; font-size:.76rem; text-transform:uppercase; letter-spacing:.08em; color:var(--gold-light); margin-bottom:16px}
.mg-title b{color:#f2a9bf}
.mg-svg{width:100%; height:auto; display:block; overflow:visible}
.mg-svg .mg-base{stroke:rgba(255,255,255,.18); stroke-width:1.5}
.mg-svg path.mg-line{fill:none; stroke-width:3.4; stroke-linecap:round; stroke-linejoin:round; opacity:0; transition:opacity .8s ease .3s}
.mg-svg .mg-koll{stroke:#c9b389; opacity:.85}
.mg-svg .mg-motor{stroke:#f2a9bf}
.mg-svg .mg-llab{font-family:var(--font-body); font-weight:700}
.mg-svg .mg-llab-k{fill:#e6cf9a; font-size:12px}
.mg-svg .mg-llab-m{fill:#f9c9d8; font-size:11.5px}
.g-anim.in .mg-svg path.mg-line{opacity:1}

.mg-svg .mg-area{opacity:0; transition:opacity 1.2s ease .35s}
.g-anim.in .mg-svg .mg-area{opacity:1}
.mg-svg .mg-dot{opacity:0; transform:scale(.3); transform-box:fill-box; transform-origin:center; stroke:#2e1220; stroke-width:1.5; transition:opacity .3s ease, transform .3s cubic-bezier(.34,1.56,.64,1)}
.g-anim.in .mg-svg .mg-dot{opacity:1; transform:scale(1)}
.g-anim.in .mg-svg .mg-dot.md-s{transition-delay:.5s}
.g-anim.in .mg-svg .mg-dot.md-m{transition-delay:2.7s}
.g-anim.in .mg-svg .mg-dot.md-k{transition-delay:3.1s}
.mg-svg .mg-delta{stroke:#f2a9bf; stroke-width:1.4; stroke-dasharray:3 3; opacity:0; transition:opacity .5s ease 3s}
.g-anim.in .mg-svg .mg-delta{opacity:.75}
.mg-svg .mg-xlab{fill:rgba(255,255,255,.55); font-size:11px; font-weight:600}
.mg-legend{display:flex; flex-wrap:wrap; gap:8px 22px; justify-content:center; margin-top:16px; font-size:.84rem; color:rgba(255,255,255,.85)}
.mg-legend span{display:inline-flex; align-items:center; gap:8px}
.mg-legend i{width:12px; height:12px; border-radius:50%; flex:none}
.mg-note{text-align:center; font-family:var(--font-head); font-style:italic; font-size:clamp(1.08rem,2.2vw,1.4rem); color:#f2a9bf; margin:18px auto 0; max-width:540px; line-height:1.3}
.wenn-list{list-style:none; margin:18px 0 0; padding:0; display:flex; flex-direction:column; gap:14px}
.wenn-list li{display:flex; gap:13px; align-items:flex-start; line-height:1.5; color:var(--coffee-400); font-size:1.05rem}
.wenn-list li strong{color:var(--brand)}
.wenn-list .wl-emo{flex:none; font-size:1.35rem; line-height:1.25}
/* Vorher/Nachher Split-Screen */
.vn-wrap{max-width:820px; margin:30px auto}
.vn-head{text-align:center; font-family:var(--font-head); font-size:clamp(1.573rem,2.6vw,1.95rem); color:var(--brand); margin-bottom:6px; line-height:1.22}
.vn-head em{font-style:italic; color:var(--orange-dark)}
.vn-sub{text-align:center; color:var(--coffee-400); max-width:560px; margin:0 auto 20px}
.vn-fig{position:relative; border-radius:var(--r); overflow:hidden; box-shadow:0 14px 38px rgba(75,51,52,.16); line-height:0}
.vn-fig video, .vn-fig img{width:100%; height:auto; display:block}
.vn-videos{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:14px}
.vn-videos .vn-fig video{aspect-ratio:4/3; object-fit:cover}
.vn-videos.vn-videos--single{grid-template-columns:1fr}
@media(max-width:520px){.vn-videos{grid-template-columns:1fr}}
.vn-lab{position:absolute; top:14px; font-family:var(--font-body); font-weight:700; font-size:.82rem; letter-spacing:.03em; padding:6px 14px; border-radius:100px; box-shadow:0 4px 12px rgba(0,0,0,.2); line-height:1.3; max-width:calc(100% - 28px); white-space:normal; text-align:center}
.vn-before{left:14px; background:rgba(45,28,28,.85); color:#fff}
.vn-after{right:14px; background:var(--orange-dark); color:#fff}
.vn-compare{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px}
.vn-col{padding:16px 18px; text-align:center; border-radius:14px; border:1px solid var(--cream-4)}
.vn-col-b{background:var(--cream-3)}
.vn-col-a{background:linear-gradient(180deg,#f7d3de,#efbccd); border-color:var(--orange-light); box-shadow:0 8px 22px rgba(178,58,93,.18)}
.vn-ct{font-family:var(--font-body); font-weight:700; text-transform:uppercase; letter-spacing:.05em; font-size:.72rem; margin-bottom:6px}
.vn-col-b .vn-ct{color:var(--muted)}
.vn-col-a .vn-ct{color:var(--orange-dark)}
.vn-steps{font-size:.86rem; color:var(--coffee-400); line-height:1.45}
.vn-time{margin-top:9px; font-family:var(--font-head); font-weight:700; font-size:1.2rem}
.vn-col-b .vn-time{color:var(--muted)}
.vn-col-a .vn-time{color:var(--orange-dark)}
@media(max-width:520px){.vn-compare{grid-template-columns:1fr}}
@media(max-width:560px){.decline-col .d-age{font-size:.86rem} .decline-col .d-pct{font-size:.68rem}}
@media(max-width:760px){.authority-split{grid-template-columns:1fr; gap:30px} .as-media{aspect-ratio:3/4}}
.usp-box{background:var(--cream-3); color:var(--brand); border:1.5px solid var(--gold-light); border-left:5px solid var(--orange); border-radius:var(--r); padding:30px 32px; margin:30px 0}
.usp-box h3{color:var(--brand); margin-bottom:12px}
.usp-box>p{color:var(--coffee-400)}
.usp-bads{margin:18px 0 6px}
.ub{display:flex; gap:13px; align-items:flex-start; padding:12px 0; border-bottom:1px solid var(--cream-4); font-size:.99rem; line-height:1.5}
.ub:last-child{border-bottom:none}
.ub-x{flex:none; width:26px; height:26px; border-radius:50%; background:var(--sale-tint); color:var(--sale); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.82rem; margin-top:1px}
.ub b{color:var(--brand)}
.usp-vs{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:16px 20px; margin:14px 0 18px; color:var(--brand); font-size:1.02rem}
.usp-box .usp-row{display:flex; flex-wrap:wrap; gap:10px; margin-top:6px}
.usp-box .chip{background:var(--paper); border:1px solid var(--cream-4); color:var(--orange-dark); border-radius:100px; padding:7px 15px; font-size:.86rem; font-weight:600}
.cost-list{list-style:none; margin:20px 0 26px; padding:0}
.cost-list li{position:relative; padding:13px 0 13px 40px; border-bottom:1px solid var(--cream-4); font-size:1.08rem}
.cost-list li:last-child{border-bottom:none}
.cost-list li::before{content:"✕"; position:absolute; left:0; top:13px; width:26px; height:26px; border-radius:50%; background:var(--sale-tint); color:var(--sale); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem}
/* Proof */
.claim{display:flex; gap:14px; align-items:flex-start; background:var(--success-tint); border-radius:var(--r); padding:18px 22px; margin-bottom:14px}
.claim .ck{color:var(--success); font-weight:700; font-size:1.2rem; flex:none}
.studybox{background:var(--paper); border:1px solid var(--cream-4); border-left:4px solid var(--orange); border-radius:var(--r); padding:18px 24px; margin-bottom:12px}
.studybox summary{cursor:pointer; list-style:none; display:flex; flex-direction:column; gap:5px; position:relative; padding-right:30px; padding-left:36px}
.studybox summary .sb-book{position:absolute; left:0; top:1px; font-size:1.2rem; line-height:1}
.studybox summary::-webkit-details-marker{display:none}
.studybox summary::after{content:"+"; position:absolute; right:2px; top:0; font-size:1.5rem; line-height:1; color:var(--orange-dark)}
.studybox[open] summary::after{content:"−"}
.studybox summary .src{font-size:.82rem; color:var(--muted)}
.studybox .sb-text{margin:13px 0 0; line-height:1.55; color:var(--coffee-400)}
.studybox.featured{background:var(--orange-tint); border-left-width:5px}
.gapbox{background:linear-gradient(180deg,var(--orange-tint),var(--cream-3)); border:1.5px solid var(--gold-light); border-left:5px solid var(--orange); border-radius:18px; padding:26px 32px; margin:30px 0; box-shadow:0 12px 30px rgba(190,99,48,.10)}
.gapbox h3{font-family:var(--font-head); font-weight:700; font-size:clamp(1.694rem,2.5vw,1.95rem); line-height:1.22; color:var(--brand); margin:0}
.gapbox p{font-size:1.06rem; line-height:1.55; color:var(--coffee-400); margin:14px 0 0}
.gapbox p strong{color:var(--brand)}
.studybox.featured summary strong{font-size:1.1rem}
.proof-foundation{background:var(--cream-3); border:1px solid var(--cream-4); border-radius:var(--r); padding:22px 26px; margin-top:22px}
.proof-foundation .sub{font-weight:700; font-size:.82rem; text-transform:uppercase; letter-spacing:.08em; color:var(--coffee-400); margin-bottom:12px}
.allclaims{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:22px 26px 20px; margin:24px auto 0; max-width:900px}
.allclaims .ac-head{display:flex; align-items:center; gap:13px; margin-bottom:16px}
.allclaims .ac-head .ac-t{font-family:var(--font-body); font-size:.8rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--coffee-400); line-height:1.3}
.allclaims .ac-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px 24px}
.allclaims .acg h4{font-family:var(--font-head); font-size:1rem; color:var(--brand); margin:0 0 5px}
.allclaims .acg ul{list-style:none; margin:0; padding:0}
.allclaims .acg li{position:relative; padding:2.5px 0 2.5px 17px; font-size:.78rem; line-height:1.38; color:var(--coffee-400)}
.allclaims .acg li::before{content:"✓"; position:absolute; left:0; top:2.5px; color:var(--success); font-size:.7rem; font-weight:700}
.allclaims .ac-note{font-size:.72rem; color:var(--muted); font-style:italic; margin:16px 0 0}
@media(max-width:780px){.allclaims .ac-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.allclaims .ac-grid{grid-template-columns:1fr}}
.stat-row{display:flex; gap:26px; justify-content:center; flex-wrap:wrap; margin:30px 0}
.stat{text-align:center}
.stat b{font-family:var(--font-head); font-size:2.8rem; color:var(--orange-dark); display:block; line-height:1}
.stat span{font-size:.9rem; color:var(--coffee-400)}
.disc{font-size:.8rem; color:var(--muted); font-style:italic; text-align:center; margin-top:10px}
.solution-eyebrow{display:flex; justify-content:flex-start; margin-bottom:18px}
.solution-eyebrow span{display:inline-block; background:var(--orange-tint); border:1px solid var(--orange-light); color:var(--orange-dark); font-family:var(--font-body); font-weight:700; font-size:.94rem; letter-spacing:.02em; padding:9px 22px; border-radius:100px}
.eu-emblem{flex:none; width:62px; height:42px; border-radius:5px; box-shadow:0 3px 10px rgba(0,0,0,.16)}
.survey-bubbles{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin:28px 0 12px}
.sbub{position:relative; background:var(--paper); border:1px solid var(--cream-4); border-radius:18px; padding:20px 18px 22px; text-align:center; box-shadow:0 8px 22px rgba(75,51,52,.07)}
.sbub::after{content:""; position:absolute; left:32px; bottom:-9px; width:18px; height:18px; background:var(--paper); border-right:1px solid var(--cream-4); border-bottom:1px solid var(--cream-4); transform:rotate(45deg)}
.sbub .sb-pct{display:block; font-family:var(--font-head); font-weight:700; font-size:2rem; color:var(--orange-dark); line-height:1}
.sbub .sb-txt{display:block; margin-top:8px; font-size:.98rem; color:var(--brand); font-style:italic}
@media(max-width:680px){.survey-bubbles{grid-template-columns:1fr; gap:14px}}
/* Hero-Zutaten (prominent) */
.hero-ingredients{display:grid; gap:14px; margin:22px 0 18px}
.hero-ing{background:var(--paper); border:1px solid var(--cream-4); border-left:5px solid var(--orange); border-radius:14px; padding:20px 24px; box-shadow:0 8px 22px rgba(75,51,52,.08)}
.hero-ing .hi-tag{display:block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--orange-dark); margin-bottom:6px}
.hero-ing b{display:block; font-family:var(--font-head); font-size:1.5rem; color:var(--brand); margin-bottom:6px}
.hero-ing .hi-d{font-size:.95rem; color:var(--coffee-400); line-height:1.5}
.cred-strip{display:flex; flex-wrap:wrap; justify-content:center; gap:18px 40px; margin:46px auto; padding:24px 0; border-top:1px solid var(--cream-4); border-bottom:1px solid var(--cream-4); max-width:660px}
.cred-strip div{text-align:center}
.cred-strip b{display:block; font-family:var(--font-head); font-size:1.7rem; color:var(--orange-dark); line-height:1; margin-bottom:3px}
.cred-strip span{font-size:.82rem; color:var(--coffee-400)}
.kbenefits{margin:30px 0 8px}
.kbenefits .kb-head{text-align:center; font-family:var(--font-head); font-weight:600; font-size:clamp(1.573rem,2.2vw,1.7rem); color:var(--brand); margin-bottom:20px}
.kb-grid{display:grid; grid-template-columns:1fr 1fr; gap:6px 28px}
.kb{display:flex; gap:13px; align-items:flex-start; padding:13px 0; border-bottom:1px solid var(--cream-4); font-size:.97rem; line-height:1.5}
.kb .ck{flex:none; width:28px; height:28px; border-radius:50%; background:var(--success-tint); color:var(--success); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.9rem; margin-top:1px}
.kb b{color:var(--brand); display:block; margin-bottom:2px}
@media(max-width:680px){.kb-grid{grid-template-columns:1fr; gap:0}}
/* Testimonials */
.example-flag{display:inline-block; background:var(--brand); color:#fff; font-size:.72rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:4px 11px; border-radius:100px; margin-bottom:18px}
.tcard{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:26px; position:relative}
.tcard .stars{color:var(--gold); letter-spacing:2px; margin-bottom:12px}
.tcard .who{margin-top:14px; font-weight:600}
.tcard .tag{display:block; font-size:.76rem; color:var(--muted); font-weight:600; margin-top:3px}
.tcard p{font-size:.9rem; line-height:1.5}
.quote-lg{font-family:var(--font-head); font-style:italic; font-size:clamp(1.5rem,2.6vw,2.1rem); line-height:1.4; color:var(--brand)}
.quote-lg::before{content:"„"; color:var(--orange-dark)}
/* Reveal */
.reveal-grid{display:grid; grid-template-columns:.95fr 1.05fr; gap:56px; align-items:stretch}
.reveal-img{position:relative; overflow:hidden; border-radius:var(--r); display:flex}
.reveal-img img{position:static; width:100%; height:100%; object-fit:cover; object-position:center; display:block}
.reveal-badge{position:absolute; top:5%; bottom:auto; left:50%; transform:translateX(-50%); margin:0; z-index:2; white-space:nowrap; font-size:1.05rem; letter-spacing:.12em; box-shadow:0 6px 18px rgba(75,51,52,.16); animation:revealBadgePulse 2.2s ease-in-out infinite}
@keyframes revealBadgePulse{0%,100%{transform:translateX(-50%) scale(1); box-shadow:0 6px 18px rgba(75,51,52,.16)}50%{transform:translateX(-50%) scale(1.05); box-shadow:0 10px 26px rgba(178,58,93,.34)}}
@media(prefers-reduced-motion:reduce){.reveal-badge{animation:none}}
.reveal-title{margin-bottom:18px}
.reveal-title .rt-name{display:block; font-size:clamp(3.025rem,4.8vw,3.6rem); line-height:1.03; color:var(--brand); letter-spacing:-.01em}
.reveal-title .rt-name .rt-e{color:var(--orange-dark); font-family:var(--font-serif); font-weight:600}
.amp{font-family:var(--font-serif); font-weight:600}
.reveal-title .rt-name sup{font-size:.34em; vertical-align:super; font-weight:600; color:var(--muted)}
.reveal-title .rt-sub{display:block; font-family:var(--font-body); font-style:normal; font-weight:600; font-size:clamp(1.355rem,1.8vw,1.4rem); line-height:1.32; color:var(--coffee-400); margin-top:14px}
.reveal-title .rt-sub strong{color:var(--orange-dark)}
.reveal-bul{list-style:none; margin:16px 0 16px; padding:0}
.reveal-bul li{position:relative; padding:8px 0 8px 33px; font-size:1.02rem; line-height:1.45}
.reveal-bul li::before{content:"✓"; position:absolute; left:0; top:8px; width:23px; height:23px; border-radius:50%; background:var(--success-tint); color:var(--success); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.78rem}
.reveal-bul b{color:var(--brand)}
.pill{display:inline-flex; align-items:center; gap:7px; background:var(--paper); border:1px solid var(--cream-4); border-radius:100px; padding:8px 15px; font-size:.82rem; font-weight:500; color:var(--brand)}
.pill b{color:var(--orange-dark); font-weight:700}
.hero-badges{display:flex; flex-wrap:wrap; gap:10px; margin:20px 0 24px}
.hero-badges.hb-under{justify-content:center; gap:7px; margin:18px 0 0}
.hero-badges.hb-under .pill{font-size:.74rem; padding:6px 11px; gap:5px; white-space:nowrap}
@media(max-width:560px){
  .hero-badges.hb-under{flex-wrap:wrap; gap:5px} /* wrap statt nowrap: in DE/EN/NL passen die drei Chips in eine Zeile, in FR und IT sind sie laenger und schoben die Section sonst aus dem Bild. */
  .hero-badges.hb-under .pill{font-size:.66rem; padding:6px 8px; gap:4px}
}
/* Compare */
.compare{width:100%; border-collapse:collapse; background:var(--paper); border-radius:var(--r); overflow:hidden; border:1px solid var(--cream-4)}
.compare th,.compare td{padding:15px 18px; text-align:left; border-bottom:1px solid var(--cream-4); font-size:.98rem}
.compare thead th{font-family:var(--font-body); font-weight:700; font-size:.85rem; text-transform:uppercase; letter-spacing:.05em}
.compare .us{background:var(--orange-tint); color:var(--brand); font-weight:600}
.compare thead .us{background:var(--orange-dark); color:#fff}
.compare .us2{background:rgba(201,179,137,.16); color:var(--brand); font-weight:600}
.compare thead .us2{background:var(--gold); color:var(--brand); font-weight:700}
.compare tr td:first-child{font-weight:600}
.compare .yes{color:var(--success); font-weight:700}
.compare .no{color:var(--neg); font-weight:700}
.compare thead th{vertical-align:bottom; text-align:center}
.compare thead th:first-child{border:none; background:transparent}
.cmp-img{display:block; width:108px; height:108px; object-fit:contain; background:#fff; border-radius:10px; padding:2px; margin:0 auto 10px; box-shadow:0 4px 12px rgba(75,51,52,.1)}
.compare thead .us .cmp-img{box-shadow:0 4px 14px rgba(0,0,0,.18)}
.compare--fit{table-layout:fixed}
.compare--fit th:first-child,.compare--fit td:first-child{width:22%}
.compare--fit th,.compare--fit td{overflow-wrap:break-word; hyphens:auto}
.nolist{display:flex; flex-wrap:wrap; gap:9px 10px; justify-content:center; margin:18px auto 0; max-width:800px}
.nolist span{display:inline-flex; align-items:center; gap:5px; background:var(--paper); border:1px solid var(--cream-4); border-radius:100px; padding:6px 12px; font-size:.8rem; color:var(--muted); white-space:nowrap}
.nolist span::before{content:"✕"; color:var(--neg); font-weight:700; font-size:.82rem}.nolist span.yes::before{content:"✓"; color:#1d8a45}
@media(max-width:760px){.nolist{flex-wrap:wrap}}
/* Timeline */
.timeline{max-width:720px; margin:0 auto; position:relative}
.timeline::before{content:""; position:absolute; left:15px; top:6px; bottom:6px; width:3px; background:var(--cream-4)}
.tl{position:relative; padding:0 0 34px 56px; display:flex; gap:20px; align-items:flex-start}
.tl::before{content:""; position:absolute; left:8px; top:6px; width:17px; height:17px; border-radius:50%; background:var(--orange); border:3px solid var(--cream); z-index:1}
.tl-img{flex:none; width:88px; height:88px; border-radius:12px; object-fit:cover; box-shadow:0 8px 22px rgba(75,51,52,.18)}
.tl-c{flex:1; padding-top:2px}
.tl b{display:block; color:var(--orange-dark); font-weight:700; margin-bottom:3px}
@media(max-width:520px){.tl{gap:14px; padding-left:42px} .tl-img{width:68px; height:68px}}
/* Price / bundles */
.rating-ph{display:flex; align-items:center; gap:9px; color:var(--star); font-size:1.15rem; letter-spacing:2px; margin:20px 0 8px}
.rating-ph span{color:var(--muted); font-size:.76rem; letter-spacing:0}
.checkout-trust{display:flex; flex-wrap:wrap; justify-content:center; gap:14px 28px; margin-top:32px; color:var(--muted); font-size:.86rem}
.checkout-trust span{display:flex; align-items:center; gap:7px}
.checkout-trust b{color:var(--brand)}
.checkout-trust .pay-badges{display:inline-flex; flex-wrap:wrap; align-items:center; gap:6px}
.checkout-trust .pay-badges i{font-style:normal; font-weight:800; font-size:.72rem; letter-spacing:.02em; color:var(--brand); background:#fff; border:1px solid var(--cream-4); border-radius:5px; padding:5px 9px; line-height:1; box-shadow:0 1px 2px rgba(75,51,52,.06)}
.checkout-trust .pay-badges i.b-visa{color:#1a1f71} .checkout-trust .pay-badges i.b-mc{color:#bf4a32} .checkout-trust .pay-badges i.b-pp{color:#1f3d78} .checkout-trust .pay-badges i.b-kl{color:#000; background:#ffb3c7; border-color:#ffb3c7}
.bundles{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch}
.bundle{background:var(--paper); border:2px solid var(--cream-4); border-radius:var(--r); padding:30px 26px; text-align:center; position:relative; display:flex; flex-direction:column}
.bundle.feat{border-color:var(--orange); box-shadow:0 14px 40px rgba(190,99,48,.18); transform:scale(1.03)}
.bundle .tagtop{position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--orange); color:#fff; font-size:.74rem; font-weight:700; text-transform:uppercase; letter-spacing:.08em; padding:5px 16px; border-radius:100px; white-space:nowrap}
.bundle h3{margin-bottom:6px}
.bundle .save{display:inline-block; background:var(--orange-tint); color:var(--orange-dark); font-weight:700; font-size:.85rem; padding:4px 12px; border-radius:100px; margin-bottom:14px}
.bundle .anchor{color:var(--muted); text-decoration:line-through; font-size:1rem}
.bundle .price{font-family:var(--font-head); font-size:2.6rem; color:var(--brand); line-height:1}
.bundle .perm{color:var(--coffee-400); font-size:.95rem; margin:6px 0 18px}
.bundle .btn{margin-top:auto}
.bundle ul{list-style:none; text-align:left; margin:16px 0; font-size:.92rem}
.bundle li{padding:5px 0 5px 24px; position:relative}
.bundle li::before{content:"✓"; position:absolute; left:0; color:var(--success); font-weight:700}
/* Offer-Section (Design-Skill aus dem Vault, gescopt unter .offer16) */
.offer16{max-width:1120px; margin:0 auto}
.wrap .o-head{text-align:center; margin-bottom:44px}
.offer16 .o-head .kicker{font-size:.95rem; letter-spacing:.14em}
.wrap .o-head h2{font-size:clamp(2.541rem,3.8vw,3.2rem); margin:30px 0 0}
.offer16 .o-boni{list-style:none; margin:3px 0 0; padding:0; font-size:13.5px}
.offer16 .o-boni li{position:relative; padding:3px 0 3px 16px; color:var(--brand); font-weight:600; line-height:1.35}
.offer16 .o-boni li::before{content:"+"; position:absolute; left:0; color:var(--orange-dark); font-weight:700}
.offer16 .o-boni s{color:var(--muted); font-weight:400; margin:0 3px}
.offer16 .o-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start}
.offer16 .o-card{position:relative; background:var(--paper); border:1.5px solid var(--cream-4); border-radius:14px; padding:26px; display:flex; flex-direction:column; transition:.2s}
.offer16 .o-card--feat{background:radial-gradient(120% 80% at 50% 0%, rgba(245,209,178,.55), var(--cream-3) 70%); border:2px solid var(--orange); transform:translateY(-12px); padding-bottom:34px; animation:featGlow 2.8s ease-in-out infinite}
@keyframes featGlow{0%,100%{box-shadow:0 18px 44px rgba(190,99,48,.16)}50%{box-shadow:0 20px 60px rgba(190,99,48,.38)}}
@media(prefers-reduced-motion:reduce){.offer16 .o-card--feat{animation:none; box-shadow:0 18px 44px rgba(190,99,48,.2)}}
.offer16 .o-card__head{display:flex; align-items:center; gap:16px; padding-bottom:16px}
.offer16 .o-card__img{width:80px; height:80px; object-fit:cover; flex-shrink:0; border-radius:8px}
.offer16 .o-card__title{font-family:var(--font-head); font-weight:600; font-size:22px; color:var(--brand)}
.offer16 .o-card__sub{font-size:14px; color:var(--muted); margin-top:2px}
.offer16 .o-pill{display:inline-block; font-size:12px; font-weight:700; padding:4px 11px; border-radius:999px; margin-top:8px}
.offer16 .o-pill--pop{background:var(--orange); color:#fff}
.offer16 .o-pill--best{background:var(--brand); color:var(--paper)}
.offer16 .o-pill--pop, .offer16 .o-pill--best{position:absolute; top:0; left:50%; transform:translate(-50%,-50%); margin:0; z-index:3; white-space:nowrap; box-shadow:0 5px 14px rgba(75,51,52,.2)}
.offer16 .o-gift{display:inline-flex; align-items:center; align-self:flex-start; gap:6px; font-size:12px; font-weight:700; letter-spacing:.03rem; text-transform:uppercase; background:var(--orange-dark); color:#fff; padding:6px 12px; border-radius:999px; margin-bottom:14px}
.offer16 .o-specs{border-top:1px solid var(--cream-4)}
.offer16 .o-spec{padding:12px 0; border-bottom:1px solid var(--cream-4)}
.offer16 .o-card--feat .o-spec{border-color:rgba(190,99,48,.18)}
.offer16 .o-spec__l{font-size:12.5px; color:var(--muted); margin-bottom:3px}
.offer16 .o-spec__v{font-size:15.5px; font-weight:600; color:var(--brand)}
.offer16 .o-price-row{display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; margin-top:2px}
.offer16 .o-price{font-family:var(--font-head); font-size:30px; font-weight:700; color:var(--brand)}
.offer16 .o-save{font-size:15.5px; font-weight:700; background:var(--sale-tint); color:var(--sale); padding:5px 13px; border-radius:var(--r); white-space:nowrap}
.offer16 .o-perday{display:inline-block; background:var(--success-tint); color:#1d8a45; font-weight:700; font-size:13.5px; padding:5px 13px; border-radius:100px; margin:2px 0 10px}
.offer16 .o-total{font-size:13.5px; color:var(--coffee-400); margin-top:6px}
.offer16 .o-total s{color:var(--muted)}
.offer16 .o-btn{display:block; width:100%; text-align:center; cursor:pointer; font-family:var(--font-body); font-weight:600; text-transform:uppercase; letter-spacing:.08rem; font-size:14.5px; padding:16px; border-radius:var(--r); margin-top:auto; border:2px solid var(--brand); transition:.2s; text-decoration:none}
.offer16 .o-card .o-specs{margin-bottom:24px}
.offer16 .o-btn--p{background:var(--orange-dark); color:#fff; border-color:var(--orange-dark)}
.offer16 .o-btn--p:hover{background:var(--orange-darker); border-color:var(--orange-darker)}
.offer16 .o-btn--s{background:transparent; color:var(--brand)}
.offer16 .o-btn--s:hover{background:var(--brand); color:#fff}
.offer16 .o-stock{text-align:center; font-size:12.5px; color:var(--coffee-400); margin-top:12px}
.offer16 .o-stock::before{content:"●"; color:var(--success); font-size:9px; vertical-align:middle; margin-right:6px}
@media(max-width:860px){.offer16 .o-cards{grid-template-columns:1fr; gap:18px} .offer16 .o-card--feat{transform:none}
  /* Mobil: 6er zuerst, dann 3er, dann 1er (Rafael 17.7.). DOM ist 1er, 6er, 3er. */
  .offer16 .mode-abo .o-cards>.o-card:nth-child(1){order:3}
  .offer16 .mode-abo .o-cards>.o-card:nth-child(2){order:1}
  .offer16 .mode-abo .o-cards>.o-card:nth-child(3){order:2}
  .offer16 .mode-once .o-card--feat{order:-1}}
/* Vaya-Style Toggle: Einmalkauf / Spar-Abo */
.bt-wrap{display:flex; justify-content:center; margin-bottom:54px}
/* Mobil: Kaufart-Umschalter schwebt durch die Angebots-Section und blendet am Ende aus */
@media(max-width:820px){
  .wrap .o-head{margin-bottom:34px}
  .bt-wrap{position:sticky; top:var(--bt-top,46px); z-index:400; margin-bottom:44px; padding:10px 0;
           transition:box-shadow .2s ease, background .2s ease; will-change:opacity}
  .bg-cream3 .bt-wrap{background:linear-gradient(180deg,var(--cream-3) 0%,var(--cream-3) 72%,rgba(249,243,233,0) 100%)}
  .bg-cream2 .bt-wrap{background:linear-gradient(180deg,var(--cream-2) 0%,var(--cream-2) 72%,rgba(250,247,240,0) 100%)}
  .bt-wrap.is-stuck .bt-toggle{box-shadow:0 8px 22px rgba(75,51,52,.16)}
}
.bt-toggle{display:inline-flex; background:var(--cream-3); border:1px solid var(--cream-4); border-radius:999px; padding:5px; gap:4px}
.bt-opt{appearance:none; border:none; background:transparent; cursor:pointer; font-family:var(--font-body); font-weight:600; font-size:15px; color:var(--coffee-400); padding:11px 24px; border-radius:999px; display:inline-flex; align-items:center; gap:8px; transition:.18s; white-space:nowrap}
.bt-opt:hover{color:var(--brand)}
.bt-opt.is-active{background:var(--paper); color:var(--brand); box-shadow:0 2px 9px rgba(75,51,52,.13)}
.bt-badge{font-size:12px; font-weight:700; background:var(--orange-dark); color:#fff; padding:2px 9px; border-radius:999px}
.bt-note{font-size:12.5px; font-weight:600; color:var(--coffee-400); white-space:nowrap}
/* Gratis-Produkte gehoeren zum Spar-Abo. Im Einmalkauf bleiben sie sichtbar,
   aber ausgegraut und durchgestrichen, damit der Unterschied sofort lesbar ist. */
.gift-prod{transition:opacity .2s ease}
.mode-once .gift-prod{opacity:.6}
.mode-once .gift-prod img{filter:grayscale(1)}
.mode-once .gift-prod .n,
.mode-once .gift-prod .n small{color:var(--coffee-400); text-decoration:line-through; text-decoration-thickness:1px}
.mode-once .gift-prod .gift{background:var(--cream-4); color:var(--coffee-400); text-decoration:line-through}
.mode-once .gift-prod .p s{color:var(--coffee-400); text-decoration:line-through}
/* Bundle-Umschalter bricht bei langen Labels (EN/FR/IT/NL) sauber um */
.bt-toggle{max-width:100%; flex-wrap:wrap; justify-content:center}
.bt-opt{flex:1 1 auto; justify-content:center; min-width:0}
@media(max-width:620px){
  .bt-toggle{display:flex; width:100%; border-radius:20px; padding:6px; gap:6px; border-width:1.5px; box-shadow:0 6px 18px rgba(75,51,52,.10)}
  .bt-opt{flex:1 1 50%; padding:14px 10px; font-size:15px; font-weight:700; gap:5px; white-space:normal; text-align:center; line-height:1.22; border-radius:15px}
  /* Mobil: die gewaehlte Kaufart klar hervorheben, warmer gelber Grund.
     Beide Optionen tragen dieselbe Kantenbreite, sonst springt die Zeilenhoehe. */
  .bt-opt{border:1.5px solid transparent; min-height:50px; box-sizing:border-box}
  .bt-opt:not(.is-active){background:rgba(255,255,255,.5); color:var(--brand)}
  .bt-opt.is-active{background:#fdf3d4; color:var(--brand); border-color:#ecd79a; box-shadow:0 4px 14px rgba(180,140,30,.18)}
  .bt-badge{font-size:11.5px; padding:3px 8px}
  .bt-note{font-size:11.5px}
}
@media(max-width:420px){
  .bt-opt{padding:13px 7px; font-size:14px}
  .bt-badge{font-size:11px; padding:3px 7px}
}
.boffer .mode-once{display:none}
.boffer[data-mode="einmal"] .mode-once{display:block}
.boffer[data-mode="einmal"] .mode-abo{display:none}
.o-giftxtra{font-size:13px; color:#1d8a45; background:var(--success-tint); border:1px solid var(--success-border); border-radius:8px; padding:11px 13px; margin-top:10px; line-height:1.3}
.o-giftxtra .gx-head{font-weight:700; margin-bottom:9px}
.o-giftxtra .gx-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px}
.o-giftxtra .gx-list li{display:flex; align-items:center; gap:9px}
.o-giftxtra .gift-thumb{width:40px; height:40px; border-radius:6px; object-fit:contain; padding:2px; flex:none; background:#fff; border:1px solid var(--success-border)}
.o-giftxtra .gx-name{flex:1 1 auto; font-weight:700; color:var(--brand)}
.o-giftxtra .gx-val{color:var(--muted); text-decoration:line-through; font-weight:600; white-space:nowrap}
.o-giftxtra .gx-total{margin-top:10px; padding-top:9px; border-top:1px dashed var(--success-border); font-weight:700; color:#1d8a45; display:flex; justify-content:space-between; gap:8px}
.o-giftxtra .gx-total strong{color:var(--success); white-space:nowrap}
@keyframes btnWobble{0%,90%,100%{transform:none} 93%{transform:rotate(-1.4deg) scale(1.025)} 96%{transform:rotate(1.4deg) scale(1.025)} 98.5%{transform:rotate(-.5deg)}}
.offer16 .o-card--feat .o-btn--p{animation:btnWobble 3s ease-in-out infinite; transform-origin:center}
@media(prefers-reduced-motion:reduce){.offer16 .o-card--feat .o-btn--p{animation:none}}
.auMorph{position:relative; display:inline-block; text-align:center}
.auMorph .m-a{display:inline-block; animation:auFadeA 5s ease-in-out infinite}
.auMorph .m-u{position:absolute; left:0; top:0; width:100%; text-align:center; animation:auFadeU 5s ease-in-out infinite}
@keyframes auFadeA{0%,10%{opacity:1} 50%,60%{opacity:0} 100%{opacity:1}}
@keyframes auFadeU{0%,10%{opacity:0} 50%,60%{opacity:1} 100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.auMorph .m-a{animation:none} .auMorph .m-u{display:none}}
/* Bonus */
.bonus{display:flex; gap:18px; align-items:flex-start; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:22px 24px; margin-bottom:16px}
.bonus b{display:block; margin-bottom:6px; color:var(--brand)}
.bonus .muted{display:block; line-height:1.55}
.bonus .gift{font-size:1.6rem; flex:none}
.bonus-img{width:74px; height:74px; border-radius:10px; object-fit:cover; flex:none; box-shadow:0 4px 14px rgba(75,51,52,.12)}
.bonus .val{flex:none; background:var(--gold-light); color:var(--brand); font-weight:700; font-size:.82rem; padding:5px 12px; border-radius:100px; white-space:nowrap}
.bonus-total{text-align:center; font-family:var(--font-head); font-size:1.4rem; color:var(--orange-dark); margin-top:18px}
/* Scarcity */
.stockbar{max-width:520px; margin:24px auto 8px; background:var(--paper); border:1px solid var(--cream-4); border-radius:100px; height:18px; overflow:hidden}
.stockbar i{display:block; height:100%; width:14%; background:linear-gradient(90deg,var(--orange),var(--orange-dark))}
.stockbar.in-view i{animation:deplete 4.5s ease-out forwards, stockBlink 1.1s ease-in-out 4.5s infinite}
@keyframes deplete{from{width:88%}to{width:10%}}
@keyframes stockBlink{0%,100%{opacity:1}50%{opacity:.4}}
/* Verknappungs-Balken: laeuft von 88% auf 10% runter und pulsiert dort (Rafael 17.7.) */
.scbar-fill{width:88%}
.g-anim.in .scbar-fill{animation:deplete 4.5s ease-out forwards, stockBlink 1.1s ease-in-out 4.5s infinite}
@media(prefers-reduced-motion:reduce){.scbar-fill{width:10%!important;animation:none!important}}
/* Guarantee */
.guarantee{background:var(--success-tint); border:1px solid var(--success-border); border-radius:var(--r); padding:40px; text-align:center; max-width:760px; margin:0 auto}
.seal{width:96px; height:96px; border-radius:50%; background:var(--success); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; margin:0 auto 20px; font-weight:700; line-height:1.1}
.seal b{font-family:var(--font-head); font-size:1.8rem}
.seal span{font-size:.72rem; text-transform:uppercase; letter-spacing:.06em}
/* Social proof, review wall (Kaufzone) */
.rating-banner{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 16px; margin-bottom:6px}
.rb-stars{color:var(--gold); letter-spacing:3px; font-size:1.5rem}
.rb-score{font-family:var(--font-head); font-size:1.25rem; color:var(--brand)}
.rb-score b{font-size:1.9rem; color:var(--orange-dark)}
.rb-count{font-size:.92rem; color:var(--coffee-400)}
.rb-count span{color:var(--muted); font-size:.76rem}
.review-wall{columns:3 250px; column-gap:22px; margin-top:6px}
.rcard{break-inside:avoid; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:20px 22px; margin-bottom:22px}
.rcard .stars{color:var(--gold); letter-spacing:2px; margin-bottom:8px; font-size:.95rem}
.rcard p{margin:0 0 12px; font-size:.97rem; line-height:1.55}
.rcard .who{font-weight:600; font-size:.9rem}
.rcard .vbadge{display:inline-block; font-size:.74rem; color:var(--success); font-weight:600; margin-left:6px}
.rcard .tag{font-size:.72rem; color:var(--muted); font-weight:600; margin-left:4px}
/* Product trust badges (Offer) */
.trust-badges{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:880px; margin:34px auto 8px}
.trust-badges .tb{display:flex; align-items:center; gap:11px; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:13px 16px; font-size:.9rem; font-weight:500; color:var(--brand)}
.trust-badges .tb-i{font-size:1.2rem; flex:none; line-height:1}
.trust-note{text-align:center; font-size:.76rem; color:var(--muted); margin:0}
@media(max-width:680px){.trust-badges{grid-template-columns:1fr 1fr; gap:10px}}
/* Supplement facts panel (Features) */
.sfacts{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:24px 26px; margin-top:30px}
/* Bild randlos: Desktop = linke Haelfte komplett, Mobil = vollflaechig oben (Rafael 17.7.) */
.ingpanel{background:var(--cream-3); border-radius:var(--r); padding:0; margin-top:26px; display:grid; grid-template-columns:.95fr 1.05fr; gap:0; align-items:stretch; max-width:800px; overflow:hidden}
.ingpanel picture{display:block; height:100%}
.ingpanel img{display:block; width:100%; height:100%; object-fit:cover; margin:0; border-radius:0}
.ingpanel ul{list-style:none; margin:0; padding:34px 36px; display:flex; flex-direction:column; justify-content:center; gap:16px}
.ingpanel li{display:flex; gap:12px; align-items:flex-start; line-height:1.35}
.ingpanel li::before{content:"✔"; color:var(--orange-dark); font-weight:700; font-size:1.05rem; flex:none; margin-top:1px}
.ingpanel li b{display:block; color:var(--brand); font-size:1.06rem}
.ingpanel li .ing-d{font-size:.92rem; color:var(--coffee-400)}
@media(max-width:680px){.ingpanel{grid-template-columns:1fr; padding:0; gap:0}
  .ingpanel img{width:100%; height:auto; aspect-ratio:3/2}
  .ingpanel ul{padding:24px 22px}}
.sf-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; border-bottom:2px solid var(--brand); padding-bottom:10px; margin-bottom:4px}
.sf-head .sf-t{font-family:var(--font-head); font-weight:700; font-size:1.2rem; color:var(--brand)}
.sf-sub{font-size:.84rem; color:var(--muted)}
.sf-table{width:100%; border-collapse:collapse; font-size:.95rem}
.sf-table th,.sf-table td{text-align:left; padding:10px 6px; border-bottom:1px solid var(--cream-4)}
.sf-table th{font-family:var(--font-body); font-size:.76rem; text-transform:uppercase; letter-spacing:.05em; color:var(--coffee-400); font-weight:700}
.sf-table td:nth-child(2),.sf-table th:nth-child(2),.sf-table td:nth-child(3),.sf-table th:nth-child(3){text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.sf-table td:first-child{font-weight:600; color:var(--brand)}
.sf-table tr:last-child td{border-bottom:none}
.sf-table.sf-armed tbody tr{opacity:0; transform:translateY(12px); transition:opacity .5s ease, transform .5s ease}
.sf-table.sf-armed tbody tr.sf-in{opacity:1; transform:none}
@media(prefers-reduced-motion:reduce){.sf-table.sf-armed tbody tr{opacity:1; transform:none; transition:none}}
.sf-note{font-size:.78rem; color:var(--muted); margin:12px 0 0; line-height:1.5}
/* 3-step usage (How-to) */
.howto{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; max-width:var(--wide); margin:24px auto 0}
.howto .ht{text-align:center; background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); padding:24px 20px}
.howto .ht-n{display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; border-radius:50%; background:var(--orange-tint); color:var(--orange-dark); font-family:var(--font-head); font-weight:700; font-size:1.25rem; margin-bottom:12px}
.howto .ht-photo{width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:12px; margin-bottom:14px}
.howto .ht-ic{display:inline-flex; align-items:center; justify-content:center; width:64px; height:64px; border-radius:50%; background:var(--orange-tint); margin-bottom:14px}
.howto .ht-ic svg{width:32px; height:32px; stroke:var(--orange-dark); fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.howto .ht-step{display:block; font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--orange-dark); margin-bottom:5px}
.howto .ht b{display:block; margin-bottom:4px}
.howto .ht .ht-d{font-size:.9rem; color:var(--coffee-400)}
@media(max-width:680px){.howto{grid-template-columns:1fr; gap:12px}}
.coffee-tip{display:grid; grid-template-columns:.82fr 1.18fr; max-width:var(--wide); margin:22px auto 0; background:var(--orange-tint); border:1px solid var(--cream-4); border-radius:var(--r); overflow:hidden; box-shadow:0 12px 34px rgba(75,51,52,.08)}
.coffee-tip .ct-img{margin:0}
.coffee-tip .ct-img img,.coffee-tip .ct-img video{width:100%; height:100%; object-fit:cover; display:block}
.coffee-tip .ct-copy{padding:26px 32px; align-self:center}
.coffee-tip .ct-tag{display:inline-flex; align-items:center; gap:6px; font-size:.95rem; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:var(--orange-dark); margin-bottom:10px}
.coffee-tip .ct-copy .ct-h{display:block; font-family:var(--font-head); font-size:clamp(2.178rem,2.6vw,2.2rem); line-height:1.18; color:var(--brand); margin:0 0 10px}
.coffee-tip .ct-copy p{font-size:1rem; color:var(--coffee-400); line-height:1.55; margin:0}
.coffee-tip .ct-copy p strong{color:var(--brand)}
@media(max-width:680px){.coffee-tip{grid-template-columns:1fr} .coffee-tip .ct-img img,.coffee-tip .ct-img video{aspect-ratio:3/2}}
/* Final-CTA rating line */
.cta-rating{display:inline-flex; align-items:center; gap:9px; margin:18px 0 0; color:var(--gold-light); font-size:.92rem}
.cta-rating .crs{color:var(--gold); letter-spacing:2px}
.cta-rating b{color:#fff}
/* Objections */
.obj{padding:20px 0; border-bottom:1px solid var(--cream-4)}
.obj:last-child{border:none}
.obj .qq{font-family:var(--font-head); font-style:italic; font-size:1.2rem; color:var(--brand); margin-bottom:6px}
.obj .qq::before{content:"„"} .obj .qq::after{content:"\""}
.obj .aa{color:var(--coffee-400)}
.obj .aa::before{content:"→ "; color:var(--orange-dark); font-weight:700}
/* FAQ */
.faq{max-width:720px; margin:0 auto}
.faq details{background:var(--paper); border:1px solid var(--cream-4); border-radius:var(--r); margin-bottom:12px; overflow:hidden}
.faq summary{padding:18px 22px; font-weight:600; cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:14px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--orange-dark); font-size:1.5rem; font-weight:400; flex:none}
.faq details[open] summary::after{content:"–"}
.faq .ans{padding:0 22px 20px; color:var(--coffee-400)}
/* Final CTA fork */
.fork{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin:34px 0}
.fork .opt{border-radius:var(--r); padding:28px; border:1px solid rgba(255,255,255,.18)}
.fork .o1{background:rgba(255,255,255,.05)} .fork .o1 b{color:var(--gold-light)}
.fork .o2{background:var(--orange-dark)} .fork .o2 b{color:#fff} .fork .o2{color:#fff}
.signature{font-family:var(--font-head); font-style:italic; font-size:1.05rem; margin-top:22px; color:var(--gold-light)}
/* Footer */
footer{background:var(--brand); color:#d9cdc9; font-size:.82rem; padding:48px 0; line-height:1.7}
footer .wrap{max-width:920px}
footer b{color:var(--gold-light)}
footer .foot-claim{font-size:.78rem; color:#b3a7a4; margin-top:18px}
/* Sticky mobile CTA (post-reveal only feel) */
.sticky-cta{position:fixed; left:0; right:0; bottom:0; z-index:60; background:var(--paper); border-top:1px solid var(--cream-4); padding:11px 16px calc(11px + env(safe-area-inset-bottom)); display:none; align-items:center; justify-content:space-between; gap:14px; box-shadow:0 -4px 18px rgba(0,0,0,.07)}
.sticky-cta .p b{font-family:var(--font-head); font-size:1.2rem; color:var(--brand)}
.sticky-cta .p span{font-size:.78rem; color:var(--muted); display:block}
.sticky-cta .btn{height:46px; padding:0 22px; font-size:.85rem; box-shadow:none; white-space:nowrap; hyphens:none; flex:none}
/* Sticky-CTA auch auf Desktop (sobald das erste Offer sichtbar war) */
.sticky-cta.is-visible{display:flex}
body.has-sticky{padding-bottom:84px}
@media(min-width:641px){.sticky-cta{justify-content:center; gap:36px}}
/* Responsive */
@media(min-width:641px) and (max-width:900px){.cards-3,.formula .cards-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
  .bundles{grid-template-columns:1fr}
  .reveal-grid{grid-template-columns:1fr; gap:34px}
  .reveal-img{order:-1; max-width:420px; margin:0 auto; min-width:0}
  /* Das Bild darf nicht auf seine Mindest-Inhaltsbreite wachsen: in FR und IT
     schob es die Section bei 390px sonst 22px aus dem Bild. */
  .reveal-img img{position:static; height:auto; min-width:0; max-width:100%}
  /* Badge auf Mobile kompakt + hoeher, sonst draengt er sich an die Packung (Rafael 17.7.) */
  .reveal-badge{top:4%; bottom:auto; font-size:.86rem; letter-spacing:.06em; padding:9px 16px; max-width:96%; white-space:normal; text-align:center; line-height:1.32}
  .fork{grid-template-columns:1fr}
  .bundle.feat{transform:none}
}
@media(max-width:640px){
  body{font-size:17px; padding-bottom:84px}
  section{padding:var(--sp-16) 0}
  /* Übergang Origin -> "Stell dir vor": Abstand nur mobil kompakter */
  .sect-origin{padding-bottom:22px}
  .sect-dream{padding-top:22px}
  .cards-2,.cards-3,.formula .cards-3{grid-template-columns:1fr}
  .wrap,.col,.article{padding:0 20px}
  .sticky-cta.is-visible{display:flex}
  .stat-row{gap:18px}
  .compare{font-size:.86rem}
  .compare th,.compare td{padding:10px 10px}
  .guarantee{padding:28px 22px}
}
/* ===== KOLLAGEN INTENSIV, Curiosity-Hook + einheitlicher Abstands-Rhythmus ===== */
.hook-line{font-family:var(--font-head); font-style:italic; font-weight:600; font-size:clamp(1.35rem,2.5vw,1.9rem); line-height:1.3; color:var(--brand); border-left:4px solid var(--orange); padding:4px 0 4px 20px}.hook-line .hl-c{font-style:inherit; font-weight:inherit; color:var(--accent-dark,#9a2f4e)}
section{padding:clamp(56px,7vw,86px) 0}
.article h2,.col h2{margin-bottom:14px}
.article h3{margin-top:38px; margin-bottom:10px}
.article .proofq h3{margin-top:23px}
.article .lead,.col .lead{margin:0 0 20px}
.solution-eyebrow{margin-bottom:18px}
figure.cell-graphic{margin:40px 0 10px}
figure.cell-graphic figcaption{margin-top:14px}
figure.cell-graphic + h3{margin-top:16px}
.section-figure{margin:36px auto 8px}
.mistakes{margin:26px 0 10px}
.dev-list{margin:18px 0 8px}
.compare{margin:30px 0}
.disc{margin-top:12px}
.bigq,.pivot-q{margin:30px auto}
.denkfehler-box,.subhead{margin:30px 0}
.cards{margin-top:26px}
.reveal-bul{margin:18px 0}
.hero-badges{margin:22px 0 24px}
.byline{margin-top:26px}
.hero .opener{margin-top:26px}
.hero .opener p{margin:0 0 14px}
.hero .opener p.hook-line{margin:20px 0}

/* ===== V2 · erste Hälfte (clean) ===== */
.hero-hero{padding:48px 28px 46px;background:linear-gradient(162deg,#fdeef2 0%,#f5dde6 100%);border-bottom:1px solid #f0cfd9}
.hh-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:54px;align-items:center;max-width:1064px;margin:0 auto}
.hh-text{min-width:0}
.hh-text .hero-meta{margin-bottom:14px}
.hh-text h1{font-family:var(--font-body);font-weight:800;font-size:clamp(1.863rem,2.42vw,2.17rem);line-height:1.4;letter-spacing:-.01em;color:var(--brand);margin:0 0 16px;text-wrap:balance;hyphens:none}
.hh-text h1 b{font-weight:800;color:var(--accent)}
.hh-dek{font-family:var(--font-body);font-weight:500;font-size:clamp(1.16rem,1.7vw,1.36rem);line-height:1.44;color:var(--brand);margin:0 0 22px}
.hh-aber{font-family:var(--font-body);font-weight:400;font-size:clamp(1.02rem,1.4vw,1.18rem);line-height:1.46;color:var(--brand);margin:0;max-width:50ch;background:#fff;border-radius:14px;padding:15px 20px;box-shadow:0 8px 22px rgba(75,51,52,.1);display:flex;align-items:center;gap:16px}
.hh-aber em{font-style:italic}
.hh-aber b{color:var(--accent);font-weight:700}
.hh-aber-txt{margin:0}
.hh-scroll{flex:none;width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:1.5rem;line-height:1;box-shadow:0 10px 24px rgba(178,58,93,.32);animation:hhbob 1.9s ease-in-out infinite}
@keyframes hhbob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
@media(prefers-reduced-motion:reduce){.hh-scroll{animation:none}}
.hh-dek b{font-weight:700;color:var(--accent)}
.hh-img{margin:0}
.hh-img img{width:100%;height:auto;border-radius:18px;display:block;box-shadow:0 20px 48px rgba(75,51,52,.2)}
.hh-img figcaption{font-size:.82rem;color:var(--coffee-400);margin-top:10px;line-height:1.4}
.hh-imgwrap{position:relative;display:block;container-type:inline-size}
.qmark{position:absolute;transform:translate(-50%,-50%);font-family:var(--font-head);font-weight:800;font-size:12cqw;line-height:1;color:#e8153a;pointer-events:none;text-shadow:0 0 9px rgba(232,21,58,.7),0 0 20px rgba(232,21,58,.5),0 2px 5px rgba(0,0,0,.4);animation:qshimmer 2.2s ease-in-out infinite}
.qmark-l{left:19.0%;top:52.1%}
.qmark-r{left:82.4%;top:52.3%;animation-delay:1.1s}
@keyframes qshimmer{0%,100%{opacity:.85;filter:brightness(1)}50%{opacity:1;filter:brightness(1.4) drop-shadow(0 0 12px rgba(232,21,58,.85))}}
@media(prefers-reduced-motion:reduce){.qmark{animation:none}}
@media(max-width:860px){.hh-grid{grid-template-columns:1fr;gap:24px}.hero-hero{padding:30px 22px 32px}.hh-img{max-width:400px}}
.hero-checks{list-style:none;margin:24px 0;padding:6px 26px;display:block;background:var(--paper,#fffdfb);border:1px solid var(--cream-4,#e9e0d1);border-radius:16px;box-shadow:0 10px 28px rgba(75,51,52,.055)}.hero-checks li{display:flex;align-items:baseline;gap:13px;padding:15px 0;border-bottom:1px solid var(--cream-4,#ece4dc);font-size:clamp(1.02rem,1.35vw,1.15rem);line-height:1.42;color:var(--brand)}.hero-checks li:last-child{border-bottom:0}.hero-checks .hc-ic{flex:none;width:auto;height:auto;border-radius:0;background:none;color:var(--accent-dark,#9a2f4e);font-weight:800;font-size:1.02rem;display:inline;margin:0}.hero-checks .hc-d{color:var(--coffee-400,#7a6870);font-weight:400}.hero-checks .hc-d::before{content:", "}@media(max-width:560px){.hero-checks{padding:4px 18px}.hero-checks li{padding:13px 0;gap:10px}}


.hero-rating{font-size:.88rem;color:var(--coffee-400);margin-top:4px}
.hero-rating b{color:var(--brand)}
.inline-fig{margin:30px 0}
.inline-fig img{width:100%;height:auto;border-radius:14px;display:block;box-shadow:0 14px 36px rgba(75,51,52,.14)}
.inline-fig figcaption{font-size:.83rem;color:var(--coffee-400);margin-top:10px;line-height:1.4;font-style:italic}
.bg-dark .inline-fig figcaption{color:var(--gold-light)}
.trust-stats--row{display:grid !important;grid-template-columns:repeat(4,1fr);gap:16px;margin:30px 0;border:none;padding:0}
.trust-stats--row .ts-circle{width:100%;max-width:134px;height:auto;aspect-ratio:1/1;padding:10px}
.trust-stats--row .ts-circle b{font-size:1.35rem;color:var(--orange-dark);line-height:1}
.trust-stats--row .ts-circle span{font-size:.77rem;line-height:1.2}
@media(max-width:560px){.trust-stats--row{grid-template-columns:repeat(2,1fr);gap:18px 12px}}
.trust-panel{background:rgba(255,255,255,.5);border:1px solid rgba(255,255,255,.75);border-radius:22px;padding:30px;margin:26px 0;box-shadow:0 12px 34px rgba(75,51,52,.06)}
.trust-panel .trust-stats--row{margin-top:0}
.trust-panel .press-row{margin-bottom:0}
@media(max-width:560px){.trust-panel{padding:24px 18px}}
.mistakes{background:var(--paper);border:1px solid var(--cream-4);border-bottom:none;border-radius:16px 16px 0 0;padding:6px 24px;margin:30px 0 0;box-shadow:0 8px 24px rgba(75,51,52,.06)}
.mistakes .fail{border-bottom:1px solid var(--cream-4);padding:18px 0;margin:0}
.mistakes .fail:last-child{border-bottom:none}
.build-graphic{position:relative;margin:36px 0 30px;display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:stretch}
.bld-side{background:rgba(255,255,255,.05);border:1px solid rgba(235,216,178,.22);border-radius:16px;padding:26px 20px 22px;text-align:center}
.bld-side--motor{background:rgba(242,169,191,.1);border-color:rgba(242,169,191,.35)}
.bld-ic{font-size:2.4rem;line-height:1;margin-bottom:10px}
.bld-t{font-family:var(--font-body);font-weight:800;font-size:1.05rem;color:#fff;margin-bottom:6px}
.bld-d{font-size:.9rem;color:var(--gold-light);line-height:1.4}
.bld-arrow{align-self:center;font-size:1.8rem;color:var(--gold-light);opacity:.7}
.bld-bubble{position:absolute;left:50%;top:-15px;transform:translateX(-50%);background:var(--orange-dark);color:#fff;font-size:.9rem;font-weight:600;padding:7px 18px;border-radius:100px;white-space:nowrap;box-shadow:0 8px 20px rgba(0,0,0,.32)}
.bld-bubble b{color:var(--gold-light)}
@media(max-width:560px){.build-graphic{grid-template-columns:1fr;gap:10px}.bld-arrow{transform:rotate(90deg);justify-self:center}}
.cmd-table{margin:30px 0;border:1px solid var(--cream-4);border-radius:14px;overflow:hidden;background:var(--paper);box-shadow:0 8px 24px rgba(75,51,52,.06)}
.cmd-row{display:grid;grid-template-columns:1.2fr 1fr 1.3fr;gap:12px;padding:14px 18px;border-bottom:1px solid var(--cream-4);font-size:.95rem;align-items:center}
.cmd-row:last-child{border-bottom:none}
.cmd-head{background:var(--cream-3);font-weight:700;font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--coffee-400)}
.cmd-l{font-weight:700;color:var(--brand)}
.cmd-good{background:rgba(235,216,178,.2)}
.cmd-hero{background:var(--orange-tint)}
.cmd-hero .cmd-l{color:var(--orange-dark)}
.cmd-row b{color:var(--orange-dark)}
@media(max-width:560px){.cmd-row{grid-template-columns:1fr;gap:3px}.cmd-head{display:none}.cmd-l{font-size:1rem;margin-bottom:2px}}
.bars-graphic{margin:30px 0;background:var(--paper);border:1px solid var(--cream-4);border-radius:16px;padding:24px 26px;box-shadow:0 8px 24px rgba(75,51,52,.06)}
.bars-title{text-align:center;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:var(--coffee-400);font-weight:700;margin-bottom:22px}
.bars-row{display:flex;align-items:flex-end;justify-content:center;gap:26px}
.bar-col{display:flex;flex-direction:column;align-items:center;flex:1;max-width:130px}
.bar{width:100%;border-radius:10px 10px 0 0;display:flex;align-items:flex-start;justify-content:center;min-height:40px}
.bar-full{background:linear-gradient(180deg,var(--orange),var(--orange-dark))}
.bar-mid{background:var(--gold)}
.bar-low{background:var(--cream-4)}
.bar-n{color:#fff;font-weight:800;font-size:1.2rem;margin-top:8px}
.bar-low .bar-n{color:var(--brand)}
.bar-lab{font-size:.82rem;color:var(--coffee-400);font-weight:600;margin-top:12px;text-align:center}
.bars-foot{text-align:center;margin-top:20px;color:var(--brand);font-size:1.02rem}
.bars-foot b{color:var(--orange-dark)}
.role-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}
.sysgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:30px 0}
.sysgrid figure{margin:0;background:#faf1f3;border:1px solid var(--cream-4);border-radius:14px;overflow:visible;box-shadow:0 8px 24px rgba(75,51,52,.06);display:flex;flex-direction:column}
.sysgrid img{width:100%;flex:none;aspect-ratio:16/11;height:auto;object-fit:cover;display:block;border-radius:14px 14px 0 0}
.sysgrid figcaption{padding:12px 14px;flex:1 1 auto}
.sysgrid figcaption b{display:block;color:var(--brand);font-size:1.2rem;margin-bottom:3px}
.sysgrid .ing-kw{font-style:normal;color:var(--orange-dark);font-weight:700;font-size:.74em}
.sysgrid figcaption span{display:block;font-size:.85rem;color:var(--coffee-400);line-height:1.4}
@media(max-width:680px){.sysgrid{grid-template-columns:1fr 1fr;gap:10px}}
.sysgrid figure::after{content:"";position:absolute;top:60px;right:-12px;width:12px;height:2px;background:var(--gold);z-index:1}
.sysgrid figure:nth-child(3n)::after{display:none}
.sysgrid figure::before{content:"";position:absolute;left:50%;bottom:-12px;transform:translateX(-50%);width:2px;height:12px;background:var(--gold);z-index:1}
.sysgrid figure:nth-child(n+4)::before{display:none}
@media(max-width:680px){.sysgrid figure::after,.sysgrid figure::before{display:none}}
.sysgrid figure{position:relative}
.neu-badge{position:absolute;top:10px;right:10px;background:#2ca05f;color:#fff;font-size:.95rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;padding:8px 19px;border-radius:100px;box-shadow:0 4px 12px rgba(33,160,80,.4);z-index:2}
.sysgrid figure.is-new{border-color:#eabccb}
.sysgrid figure.is-claim{border-color:var(--success-border)}
.sysgrid figure.is-claim figcaption{background:var(--success-tint);border-radius:0 0 14px 14px}
.sysgrid figure.is-new figcaption{background:linear-gradient(135deg,#fbe9ef 0%,#f6d7e2 45%,#fbe9ef 90%);background-size:200% 200%;animation:sysShimmer 6.5s ease-in-out infinite;border-radius:0 0 14px 14px}
@keyframes sysShimmer{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@media(prefers-reduced-motion:reduce){.sysgrid figure.is-new figcaption{animation:none}}
.tripep-banner{display:flex;align-items:center;justify-content:center;gap:28px;background:linear-gradient(120deg,#45303a,#5e2740);border-radius:14px;padding:26px 32px;margin:30px 0;box-shadow:0 16px 38px rgba(69,48,58,.24)}
.tpb-vis{flex:none;display:flex;align-items:center}
.tpb-dot{width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 34% 28%,#f2e9fb,#b399dd);box-shadow:0 3px 10px rgba(0,0,0,.3),inset 0 1px 2px rgba(255,255,255,.5);animation:tpbpulse 2.4s ease-in-out infinite}
.tpb-link{width:20px;height:6px;background:linear-gradient(90deg,#b399dd,#e0d3f2);opacity:.85}
.tpb-vis .tpb-dot:nth-child(3){animation-delay:.3s}
.tpb-vis .tpb-dot:nth-child(5){animation-delay:.6s}
@keyframes tpbpulse{0%,100%{transform:scale(1)}50%{transform:scale(1.13);box-shadow:0 5px 18px rgba(235,216,178,.65),0 3px 10px rgba(0,0,0,.3),inset 0 1px 2px rgba(255,255,255,.6)}}
@media(prefers-reduced-motion:reduce){.tpb-dot{animation:none}}
.tpb-txt{display:flex;flex-direction:column;gap:5px;align-items:flex-start}
.tpb-kick{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-light);font-weight:800}
.tpb-name{font-family:var(--font-head);font-weight:700;font-size:clamp(2.057rem,4.6vw,2.5rem);color:#fff;line-height:1.02}
.tpb-sub{color:rgba(255,255,255,.85);font-size:.95rem;line-height:1.4;max-width:46ch}
@media(max-width:560px){.tripep-banner{flex-direction:column;text-align:center;gap:16px;padding:24px 22px}.tpb-vis{justify-content:center}.tpb-sub{max-width:none}}
.press-row{margin:30px 0;text-align:center}
.press-lab{display:block;font-size:.72rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.press-logos{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:18px 34px}
.press-logos img{height:26px;width:auto;max-width:120px;object-fit:contain;opacity:.8;filter:grayscale(.3)}
@media(max-width:560px){.press-logos{gap:16px 24px}.press-logos img{height:21px}}
.kilo-graphic{display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;background:linear-gradient(180deg,var(--orange-tint),var(--cream-3));border:1.5px solid var(--gold-light);border-left:5px solid var(--orange);border-radius:18px;padding:28px 32px;margin:30px 0;box-shadow:0 12px 30px rgba(190,99,48,.1)}
.kg-sack{width:150px;flex:none;text-align:center}
.kg-sack img{width:100%;height:auto;display:block;margin:0 auto;filter:drop-shadow(0 10px 18px rgba(90,60,30,.22))}
.kg-price{display:block;font-family:var(--font-head);font-weight:700;color:var(--brand);font-size:1.2rem;line-height:1.1;margin-top:10px}
.kg-price small{display:block;font-family:var(--font-body);font-weight:600;color:var(--muted);font-size:.74rem;margin-top:4px}
.kg-barblock{margin-bottom:18px}
.kg-barblock:last-of-type{margin-bottom:0}
.kg-lbl{display:block;font-weight:700;color:var(--brand);font-size:.92rem;margin-bottom:8px}
.kg-bar{display:flex;align-items:center;gap:12px}
.kg-track{flex:1;height:16px;border-radius:100px;background:#ead9c8;overflow:hidden;display:block}
.kg-fill-full{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--gold),#b6934f)}
.kg-fill-red{display:block;height:100%;width:9%;background:linear-gradient(90deg,#e8153a,#b8102d)}
.kg-bar-val{flex:none;font-weight:800;font-size:.9rem;color:var(--brand);white-space:nowrap}
.kg-bar-val-red{color:#c81330}
.kg-note{font-size:.88rem;color:var(--coffee-400);line-height:1.5;margin:16px 0 0}
@media(max-width:560px){.kilo-graphic{grid-template-columns:1fr;text-align:center;gap:20px;padding:24px 22px}.kg-sack{width:130px;margin:0 auto}.kg-lbl,.kg-note{text-align:left}}
.role-card{background:var(--paper);border:1px solid var(--cream-4);border-radius:16px;padding:22px 20px;text-align:center;box-shadow:0 6px 18px rgba(75,51,52,.06)}
.role-ic{font-size:2rem;line-height:1;margin-bottom:10px}
.role-h{font-family:var(--font-body);font-weight:800;font-size:1.1rem;color:var(--orange-dark);margin-bottom:8px}
.role-d{font-size:.92rem;color:var(--brand);line-height:1.45}
@media(max-width:680px){.role-cards{grid-template-columns:1fr}}

.cost-bars{margin:30px 0;background:var(--paper);border:1px solid var(--cream-4);border-radius:16px;padding:24px 26px;box-shadow:0 8px 24px rgba(75,51,52,.06)}
.cb-row{display:grid;grid-template-columns:auto 190px 1fr;gap:14px;align-items:center;margin-bottom:14px}
.cb-emo{font-size:1.55rem;line-height:1;text-align:center}
.cb-row:last-of-type{margin-bottom:0}
.cb-lab{font-size:.9rem;font-weight:600;color:var(--brand);text-align:right;line-height:1.2}
.cb-track{background:var(--cream-3);border-radius:8px;height:36px;overflow:hidden}
.cb-fill{height:100%;border-radius:8px;display:flex;align-items:center;padding:0 13px;color:#fff;font-weight:700;font-size:.88rem;white-space:nowrap}
.cb-fill--sell{width:44%;background:var(--cream-4);color:var(--brand)}
.cb-fill--raw{width:100%;background:linear-gradient(90deg,var(--orange),var(--orange-dark))}
.cost-foot{text-align:center;margin-top:18px;font-size:.94rem;color:var(--coffee-400)}
.cost-foot b{color:var(--orange-dark)}
@media(max-width:520px){.cb-row{grid-template-columns:auto 1fr;gap:4px 10px}.cb-lab{text-align:left}.cb-emo{grid-row:span 2;align-self:center}}

.xlist{list-style:none;margin:16px 0 4px;padding:0;display:grid;gap:11px}
.xlist li{position:relative;padding-left:36px;font-size:1.02rem;line-height:1.45;color:var(--brand)}
.xlist li::before{content:"✕";position:absolute;left:0;top:1px;width:23px;height:23px;border-radius:50%;background:var(--orange-tint);color:var(--orange-dark);font-weight:800;font-size:.76rem;display:flex;align-items:center;justify-content:center}
.xlist li b{font-weight:700;color:var(--brand)}
.article .sub-h{font-family:var(--font-body);font-weight:600;font-size:clamp(2.057rem,3vw,2.5rem);line-height:1.16;color:var(--brand);margin:30px 0;letter-spacing:-.01em}.sub-h em{white-space:nowrap}@media(max-width:360px){.sub-h em{white-space:normal}}
.opener-trust{display:flex;flex-wrap:nowrap;align-items:center;gap:10px 15px;width:100%;max-width:100%;overflow-x:auto;margin:26px 0;padding:14px 18px;background:var(--paper);border:1px solid var(--cream-4);border-radius:14px;box-shadow:0 6px 18px rgba(75,51,52,.06);scrollbar-width:none}
.opener-trust::-webkit-scrollbar{display:none}
.ot-block{display:flex;align-items:center;gap:9px;flex:none}
.ot-block--sold{padding-left:15px;border-left:1px solid var(--cream-4)}
.ot-stars{color:#f0a028;font-size:1rem;letter-spacing:1px;line-height:1;white-space:nowrap}
.ot-txt{display:inline-flex;flex-direction:column;line-height:1.1}
.ot-txt b{font-size:1.04rem;font-weight:800;color:var(--brand);white-space:nowrap}
.ot-txt span{font-size:.76rem;color:var(--muted);margin-top:2px;white-space:nowrap}
@media(max-width:540px){
  .opener-trust{display:grid;grid-template-columns:1fr 1fr;flex-wrap:wrap;overflow-x:visible;gap:14px;align-items:start}
  .opener-trust .ot-block--sold{border-left:0;padding-left:0}
  .opener-trust .ot-block:nth-child(3),.opener-trust .ot-block:nth-child(4){border-top:1px solid var(--cream-4);padding-top:12px}
}
.sub-h em{font-style:italic;color:var(--accent)}
.article .sub-h--lg{font-size:clamp(2.057rem,3vw,2.35rem)}

/* iPad-Mail-Paar (aus V4-Intro portiert) */
.mail-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0}
@media(max-width:699px){.mail-pair{gap:9px}.mp-quote{left:6px;right:6px;bottom:6px;padding:7px 9px;font-size:.74rem;line-height:1.28;border-radius:9px;border-left-width:4px}.mp-quote .mq-n{display:block;margin-bottom:1px}}
.mp-item{position:relative;container-type:inline-size}
.mp-photo{width:100%;display:block;border-radius:14px}
.mail-pair figcaption{grid-column:1/-1;font-size:.85rem;color:var(--muted,#8a7680);line-height:1.45}

/* ===== D-SET Version 5: Kassenbon-Offer-Boxen (21.7.) ===== */
.dxhint{text-align:center;font-size:.85rem;color:var(--coffee-400);margin:14px auto 57px;max-width:640px;border:1px dashed var(--orange-light);border-radius:12px;padding:11px 18px;background:var(--paper)}
.dxgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}
@media(max-width:1020px){.dxgrid{grid-template-columns:1fr;max-width:480px;margin:0 auto}}@media(max-width:1020px){.dxgrid .obox:nth-child(1){order:3}.dxgrid .obox:nth-child(2){order:1}.dxgrid .obox:nth-child(3){order:2}}
.obox{background:var(--paper);border:1px solid var(--cream-4);border-radius:20px;padding:28px 20px 20px;position:relative;box-shadow:0 8px 26px rgba(69,48,58,.06)}
.obox.feat{border:1.5px solid var(--accent);box-shadow:0 22px 54px rgba(178,58,93,.18);transform:translateY(-14px);background:radial-gradient(130% 70% at 50% 0%,#fdf1f4,var(--paper) 70%)}
@media(max-width:1020px){.obox.feat{transform:none;order:-1}}
.oflag{position:absolute;top:-14px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:6px 16px;border-radius:100px;box-shadow:0 8px 20px rgba(69,48,58,.16)}
.oflag.pop{background:var(--orange);color:#fff}
.oflag.best{background:var(--gold-light);color:#6b5116;border:1px solid var(--gold)}
.ohead{display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;margin-bottom:14px}
.ohead img{width:100%;max-width:240px;height:150px;object-fit:contain;margin-bottom:8px;filter:drop-shadow(0 10px 18px rgba(69,48,58,.16))}
.obox.feat .ohead img{max-width:270px;height:170px}
.ohead .t{font-weight:800;font-size:1.35rem;line-height:1.1}
.ohead .s{font-size:.85rem;color:var(--coffee-400);margin-top:3px}
.bon{list-style:none;margin:0;padding:0;border-top:1px solid var(--cream-4)}
.bon.prod{margin-bottom:2px}
.bon.prod li{padding:12px 0;border-bottom:0}
.bon li{display:grid;grid-template-columns:40px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--cream-3)}
.bon img{width:40px;height:40px;object-fit:contain;background:var(--cream-2);border-radius:9px;border:1px solid var(--cream-4)}
.bon .em{width:40px;height:40px;border-radius:9px;background:var(--cream-2);border:1px solid var(--cream-4);display:flex;align-items:center;justify-content:center;font-size:1.05rem}
.bon .n{font-weight:700;font-size:.86rem;line-height:1.2}
.bon .n small{display:block;font-weight:500;font-size:.74rem;color:var(--muted)}
.bon .p{text-align:right;font-size:.82rem;font-weight:700;white-space:nowrap}
.bon .p s{display:block;color:var(--muted);font-weight:500}
.bon .gift{color:#187a3c;font-weight:800;font-size:.74rem}
.giftzone{background:#f4faf5;border:1px solid #d8ecdd;border-radius:12px;padding:4px 12px 6px;margin-top:6px}
.giftzone .gz-h{display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:800;color:#187a3c;padding:8px 0 3px}
.giftzone .bon{border-top:0}
.giftzone .bon li{border-bottom:1px dashed #dcefe1}
.giftzone .bon li:last-child{border-bottom:0}
.giftzone .bon img,.giftzone .bon .em{background:#fff;border-color:#d8ecdd}
.sumbox{background:linear-gradient(160deg,#fff8ef,#fdeee6);border:1.5px solid var(--gold);border-radius:12px;padding:10px 12px 11px;text-align:center;margin-top:14px}
.sumbox .lab{font-size:.62rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#a07818}
.sumbox .line{display:flex;align-items:baseline;justify-content:center;gap:10px;margin-top:3px;flex-wrap:wrap}
.sumbox .was{font-size:1.35rem;font-weight:600;color:var(--neg);text-decoration:line-through;text-decoration-thickness:2px}
.sumbox .now{font-size:1.35rem;font-weight:600;color:var(--brand)}
.sumbox .save{display:inline-block;margin-top:5px;background:var(--success-tint);border:1px solid var(--success-border);color:#187a3c;font-weight:800;font-size:.76rem;padding:3px 11px;border-radius:100px}
.mohero{text-align:center;margin-top:26px}
.mohero .mo{font-size:2.2rem;font-weight:900;line-height:1;color:#187a3c}
.mohero .mo small{font-size:.92rem;font-weight:600;color:var(--muted)}
.mohero .strike{font-size:.84rem;color:var(--muted);margin-top:3px}
.mohero .strike s{color:var(--neg)}
.perday{display:inline-flex;align-items:center;gap:6px;background:var(--orange-tint);border:1px solid var(--orange-light);color:var(--orange-dark);font-size:.82rem;font-weight:800;padding:4px 12px;border-radius:100px;margin-top:9px}
.scarce{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:11px;font-size:.78rem;font-weight:700;color:var(--sale);text-align:center}
.dxbtn{display:flex;align-items:center;justify-content:center;min-height:52px;padding:12px 18px;line-height:1.3;text-align:center;border-radius:100px;font-weight:700;font-size:.98rem;letter-spacing:.02em;text-decoration:none;margin-top:26px;transition:.15s}
.dxbtn.p{background:var(--orange-dark);color:#fff;box-shadow:0 10px 26px rgba(154,47,78,.3)}
.dxbtn.p:hover{background:var(--orange-darker)}
.dxbtn.s{background:var(--paper);color:var(--orange-dark);border:1.5px solid var(--orange-light)}
.dxbtn.s:hover{background:var(--orange-tint)}
.subcta{text-align:center;font-size:.75rem;color:var(--coffee-400);margin-top:9px}

/* ===== HERO V3: Polaroid-Duo mit Soul-Selfies (21.7.) ===== */
.hh-grid-v3{grid-template-columns:1fr 1.08fr;gap:46px;align-items:center}
.hh-grid-v3 .hero-meta{margin-bottom:22px}
.hh-grid-v3 .hero-meta .hero-kicker{margin-bottom:0;animation:none}
.hh-grid-v3 .hero-meta .hero-kicker::after{display:none}
.hh-grid-v3 .hh-text h1{margin:0 0 22px}
.hh-grid-v3 .hh-dek{margin:0 0 22px}
.hh-grid-v3 .hh-aber{font-size:clamp(.92rem,1.2vw,1.04rem)}
@media(max-width:900px){.hh-grid-v3{grid-template-columns:1fr;gap:34px}}@media(max-width:900px){.hh-text h1 .hh-warum{display:block;width:fit-content;margin:30px auto 4px}.hh-grid-v3 .hh-text h1{font-size:clamp(2.56rem,2.85vw,2.56rem)}}
.hh-text h1 .hh-count{display:inline-block;font-size:.62em;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--coffee-400);margin-bottom:6px}
.hh-text h1 u{font-weight:800}
.hh-grid-v3 .hh-text h1{font-size:clamp(2.154rem,2.85vw,2.56rem);line-height:1.28}
.hh-text h1 .hh-warum{display:inline-block;margin-top:16px;font-size:.92em;font-weight:900;color:var(--accent-dark,#9a2f4e);background:#fff;padding:2px 16px 3px;border-radius:11px;box-shadow:0 10px 26px rgba(154,47,78,.16)}
.hh-polas{margin:0}
.pola-stack{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start;padding:18px 6px 10px}
.pola{background:#fff;padding:11px 11px 8px;border-radius:5px;box-shadow:0 26px 60px rgba(75,51,52,.3),0 4px 14px rgba(75,51,52,.14);position:relative}
.pola img{width:100%;height:auto;display:block;border-radius:2px;box-shadow:none}
.pola-ok{transform:rotate(-3.4deg)}
.pola-bad{transform:rotate(2.8deg);margin-top:38px}
.pola-bad img{filter:saturate(.85)}
.tape{position:absolute;top:-15px;left:50%;transform:translateX(-50%) rotate(-5deg);width:96px;height:32px;background:linear-gradient(180deg,rgba(243,231,201,.92),rgba(236,221,184,.85));box-shadow:0 3px 8px rgba(0,0,0,.14);border-left:1px dashed rgba(0,0,0,.06);border-right:1px dashed rgba(0,0,0,.06)}
.pola-bad .tape{transform:translateX(-50%) rotate(4deg)}
.pola-cap{display:block;padding:10px 4px 8px;font-family:"Caveat",cursive;font-weight:600;font-size:1.62rem;line-height:1.05;text-align:center;color:var(--brand)}
.pola-cap em{font-style:normal;font-weight:700;padding:0 4px;border-radius:4px}
.pola-cap .pc-ok{background:#e7f5ec;color:#187a3c}
.pola-cap .pc-bad{background:var(--neg-tint);color:var(--neg)}
.hh-polas figcaption{font-size:.82rem;color:var(--coffee-400);margin-top:14px;line-height:1.4;text-align:center}
.figpriv{display:block;font-size:.68rem;color:var(--muted);margin-top:3px;font-weight:400}
@media(max-width:900px){.pola-stack{max-width:520px;margin:0 auto} .pola-cap{font-size:1.4rem}}

/* ===== LEAD V3: 2 Arten von Frauen (21.7., gestapelt + Emotionen) ===== */
.lead-types{display:flex;flex-direction:column;gap:16px;margin:22px 0 26px}
.lt-card{display:grid;grid-template-columns:64px 1fr;gap:16px;align-items:start;background:var(--paper);border:1px solid var(--cream-4);border-left:5px solid var(--accent);border-radius:16px;padding:20px 22px;box-shadow:0 10px 28px rgba(75,51,52,.08)}
.lt-emo{width:64px;height:64px;border-radius:50%;background:var(--accent-tint,#f7ebef);border:1.5px solid var(--accent-light);display:flex;align-items:center;justify-content:center;font-size:2rem;line-height:1}
.lt-tag{display:inline-block;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;color:var(--accent-dark);background:var(--accent-tint,#f7ebef);border:1px solid var(--accent-light);padding:2px 10px;border-radius:100px;margin-bottom:8px}
.lt-h{margin:0 0 6px;font-family:var(--font-head);font-weight:800;font-size:1.22rem;line-height:1.3;color:var(--brand)}
.lt-h em{font-style:normal;color:var(--accent)}
.lt-p{margin:0;font-size:.97rem;line-height:1.5;color:var(--coffee-400)}
@media(max-width:560px){.lt-card{grid-template-columns:48px 1fr;padding:16px} .lt-emo{width:48px;height:48px;font-size:1.5rem} .lt-h{font-size:1.08rem}}

/* ===== STAT-LIST: Wissenschaftlich belegt (22.7., Zeilen-Layout) ===== */
.statgrid{display:flex;flex-direction:column;gap:14px;margin:30px auto 6px;max-width:840px}
.statcard{display:grid;grid-template-columns:72px 148px 1fr;gap:16px 22px;align-items:center;text-align:left;background:var(--paper);border:1px solid var(--cream-4);border-left:4px solid var(--accent);border-radius:16px;padding:18px 24px;box-shadow:0 6px 18px rgba(69,48,58,.05)}
.statcard .sc-ic{width:72px;height:72px;object-fit:contain;display:block}
.statcard .sc-mid{text-align:center}
.statcard .sc-num{font-family:var(--font-head);font-weight:800;font-size:clamp(1.9rem,3.4vw,2.45rem);line-height:1;color:var(--accent-dark,#9a2f4e)}
.statcard .sc-head{margin-top:6px}
.statcard .sc-lead{display:block;font-weight:800;font-size:1.16rem;line-height:1.15;color:var(--brand)}
.statcard .sc-qual{display:block;font-weight:600;font-size:.78rem;line-height:1.25;color:var(--coffee-400);margin-top:3px}
.statcard .sc-body{border-left:1px solid var(--cream-4);padding-left:22px}
.statcard .sc-desc{font-size:.9rem;line-height:1.5;color:var(--coffee-400);margin:0}
.statcard .sc-src{font-size:.76rem;color:var(--muted);margin-top:8px}
@media(max-width:680px){.statcard{grid-template-columns:52px 1fr;gap:12px 16px;padding:16px 18px}
  .statcard .sc-mid{grid-column:2;text-align:left}
  .statcard .sc-body{grid-column:1 / -1;border-left:0;padding-left:0;border-top:1px solid var(--cream-3);padding-top:12px;margin-top:2px}
  .statcard .sc-ic{width:48px;height:48px}}


/* Feinschliff 18.9.: Banderolen mittig, Zusicherungen auch unter der Abo-Kachel */
.ao-kopf{justify-content:center; text-align:center; flex-wrap:wrap}
.ao-sicher{max-width:780px; margin:26px auto 0}
.ao-sicher .assure{max-width:none; margin:0 auto}
.ao-sicher .checkout-trust{margin-top:18px}
.assure.assure-2{grid-template-columns:repeat(2,1fr)}
@media(max-width:760px){.assure.assure-2{grid-template-columns:1fr}}

/* 19.9.: Die Studien-Section steht auf Weiss, damit sie sich von den cremefarbenen
   Nachbarn abhebt (Rafael). */
.bg-studien{background:#fff}


/* ===== Presale-2-Bausteine ===== */
.banderole{position:sticky;top:0;z-index:900;background:#9e1f3f;color:#fff;text-align:center;font-weight:700;font-size:1.02rem;letter-spacing:.02em;padding:12px 22px;line-height:1.45;box-shadow:0 4px 14px rgba(69,48,58,.18)}
[data-hero][hidden], [data-htext][hidden]{display:none!important}
/* D-33: Icon-Text-Zeilen immer vertikal mittig, nie auf Grundlinie */
.hero-checks li, .ibullets li, .wenn-list li, .claim, .kb, .ub, .benefit, .fail{align-items:center}
.hero-checks .hc-svg{flex:none;width:39px;height:39px;align-self:center}
.hero-checks{padding-top:0}
.hero-checks li.gelenk{background:#f1f8f4;margin:0 -26px;padding-left:26px;padding-right:26px}
.hero-checks li.gelenk:first-child{border-top-left-radius:15px;border-top-right-radius:15px}
@media(max-width:560px){.hero-checks{padding-top:0}.hero-checks li.gelenk{margin:0 -18px;padding-left:18px;padding-right:18px}}
.ibullets .ic, .wenn-list .wl-emo{align-self:center}
.hero-checks .hc-d{color:var(--coffee-400);font-weight:400}
.hero-checks .hc-d::before{content:", "}
.ibullets{list-style:none;margin:22px 0;padding:0;display:grid;gap:14px}
.ibullets li{display:flex;gap:14px;align-items:flex-start;font-size:1.05rem;line-height:1.55;color:var(--brand)}
.ibullets .ic{flex:none;font-size:1.3rem;line-height:1.3}
.punch{font-weight:800;font-size:1.12rem;color:var(--brand);margin:20px 0 22px}
.punch b{color:var(--accent)}
.shotfig{position:relative;margin:0 0 18px}
.shotfig img{width:100%;height:auto;display:block;border-radius:16px;box-shadow:0 16px 40px rgba(75,51,52,.16)}
.shotfig .fig-badge{position:absolute;top:16px;right:16px;background:var(--orange-darker,#7e2540);color:#fff;font-weight:700;font-size:1.12rem;padding:12px 22px;border-radius:100px;box-shadow:0 10px 24px rgba(126,37,64,.3)}
.formcards{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 24px}
.formcard{border-radius:14px;padding:16px 18px;text-align:center;border:1px solid var(--cream-4);background:var(--paper)}
.formcard .fk{font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:6px}
.formcard .fs{font-size:.95rem;color:var(--coffee-400)}
.formcard .fv{font-size:1.15rem;font-weight:800;color:var(--coffee-400);margin-top:6px}
.formcard.hot{background:#f7dbe4;border-color:#e6b6c6}
.formcard.hot .fk,.formcard.hot .fv{color:var(--accent-dark,#9a2f4e)}
.pola-cap{line-height:1.18}
.chip-w{background:#fff;color:var(--accent-dark,#9a2f4e);font-weight:700;padding:1px 9px 2px;border-radius:8px;box-shadow:0 4px 12px rgba(154,47,78,.12)}
/* D-32: Hervorhebungen in Headlines im dunklen Akzent */
.sub-h em,.story-h em{color:var(--accent-dark,#9a2f4e)}
.hh-text h1 b{color:var(--accent-dark,#9a2f4e)}
.hh-text h1 u{text-decoration-color:var(--accent-dark,#9a2f4e);white-space:nowrap}
.hh-text h1{overflow-wrap:break-word}
@media(max-width:680px){.hh-text h1 u{white-space:normal}}
@media(max-width:680px){.formcards{grid-template-columns:1fr}
.shotfig .fig-badge{font-size:.95rem;padding:9px 15px;top:12px;right:12px}}


/* Hero (Energy-Analog, Rafael 14.9.) */
.hv{padding:44px 28px 52px;background:linear-gradient(162deg,#fdf5f8 0%,#f9e8ef 100%);border-bottom:1px solid #f4dde5}
.hv.cream{background:linear-gradient(180deg,#fffdf9 0%,#f9f3e9 100%);border-bottom:1px solid #eee2d2}
.hv.paper{background:#fffefd;border-bottom:1px solid #eee2d2}
.hv-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;max-width:1064px;margin:0 auto}
.hv-text{min-width:0}
.hv-kicker{display:inline-block;background:rgba(255,255,255,.55);border:1px solid var(--orange-light);color:var(--orange-dark);font:700 .72rem/1 Jost,system-ui,sans-serif;text-transform:uppercase;letter-spacing:.14em;padding:8px 15px;border-radius:100px;margin-bottom:22px}
.hv h1{font-family:var(--font-head);font-weight:800;font-size:clamp(1.9rem,3.4vw,2.9rem);line-height:1.12;letter-spacing:-.01em;color:var(--brand);margin:0 0 14px}
.hv h1 em{font-style:normal;color:var(--orange-dark)}
.hv-pill{display:inline-block;background:#fff;color:var(--orange-dark);font:900 1.08rem/1.2 Jost,system-ui,sans-serif;padding:6px 14px;border-radius:10px;box-shadow:0 8px 20px rgba(154,47,78,.14);margin:2px 0 18px}
.hv-lead{font:500 clamp(1.05rem,1.5vw,1.2rem)/1.5 Jost,system-ui,sans-serif;color:var(--brand);margin:0 0 18px;max-width:52ch}
.hv-lead b{color:var(--accent)}
.hv-box{display:flex;gap:14px;align-items:flex-start;background:#fff;border-radius:14px;padding:14px 18px;box-shadow:0 8px 22px rgba(75,51,52,.1);max-width:52ch;font:400 clamp(.95rem,1.25vw,1.05rem)/1.45 Jost,system-ui,sans-serif;color:var(--brand)}
.hv-box i{flex:none;width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-style:normal;font-size:1.3rem;box-shadow:0 8px 20px rgba(178,58,93,.3)}
.hv-box p{margin:0}
.hv-card{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 24px 60px rgba(75,51,52,.22);aspect-ratio:4/5;background:#e9e0d1}
.hv-card img{width:100%;height:100%;object-fit:cover;display:block}
.hv-quote{position:absolute;left:14px;right:14px;bottom:14px;display:flex;gap:12px;align-items:center;background:rgba(69,48,58,.86);backdrop-filter:blur(6px);color:#fff;border-radius:14px;padding:12px 14px;font:500 .95rem/1.35 Jost,system-ui,sans-serif}
.hv-quote i{flex:none;width:34px;height:34px;border-radius:50%;background:var(--accent);display:grid;place-items:center;font:800 .95rem/1 Jost,system-ui,sans-serif;font-style:normal}
.hv-quote b{display:block;font-weight:800;font-size:.85rem;letter-spacing:.02em;opacity:.95}
.hv-tag{position:absolute;top:14px;left:14px;background:#fff;color:var(--orange-dark);font:800 .72rem/1 Jost,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;padding:9px 14px;border-radius:100px;box-shadow:0 8px 20px rgba(0,0,0,.14)}
.hv-sym{display:block;text-align:right;font:400 .72rem/1 Jost,system-ui,sans-serif;color:#8a7680;margin-top:8px}

.hero-main{border-bottom:1px solid #f0cfd9}
.hv-foot{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:14px;background:linear-gradient(180deg,rgba(69,48,58,.72),rgba(69,48,58,.92));backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:16px;padding:10px 16px 10px 10px;box-shadow:0 14px 34px rgba(0,0,0,.28)}
.hv-foot .hf-prod{flex:none;width:92px;border-radius:11px;overflow:hidden;background:#fff;box-shadow:0 4px 12px rgba(75,51,52,.14)}
.hv-foot .hf-prod img{width:100%;height:auto;display:block}
.hv-foot .hf-txt{min-width:0;color:#fff;font:500 .95rem/1.35 Jost,system-ui,sans-serif}
.hv-foot .hf-txt b{display:block;font-weight:800;font-size:.85rem;letter-spacing:.02em;color:#f3c9d6;margin-bottom:2px}
@media(max-width:560px){.hv-foot{gap:10px;padding:8px 12px 8px 8px}.hv-foot .hf-prod{width:64px}.hv-foot .hf-txt{font-size:.85rem;line-height:1.3}}
@media(max-width:820px){.hv-grid{grid-template-columns:1fr;gap:22px}.hv{padding:26px 20px 30px}.hv-card{max-width:420px;margin:0 auto}.hv h1{font-size:clamp(1.7rem,7.2vw,2.2rem)}.hv-kicker{font-size:.62rem;letter-spacing:.1em;padding:7px 12px;margin-bottom:16px}}


/* Angebots-Block 18.9.2026 (Variante 2b): Abo oben als 90-Tage-Set, Bundles darunter.
   Eigener Prefix ao-, damit nichts mit .block oder .boffer der Salespage kollidiert. */
/* Die Angebots-Sektionen stehen auf Weiss, damit die rosé Buehne und die
   cremefarbene Bundle-Flaeche klar herauskommen (Rafael, 18.9.). */
#angebot-frueh, #angebot{background:#fff}
.ao-block{border-radius:20px; overflow:hidden; border:1px solid var(--cream-4); padding:0}
.ao-abo{background:linear-gradient(162deg,#fdf5f8 0%,#f9e8ef 100%); border-color:#f0cfd9; margin-bottom:30px}
.ao-bundle{background:var(--cream-1)}
.ao-kopf{display:flex; align-items:center; gap:12px; padding:20px 22px; font-family:var(--font-head); font-weight:700; font-size:1.5rem; line-height:1.25; letter-spacing:-.01em}
.ao-kopf-abo{background:linear-gradient(180deg,#f9e2ea 0%,#f3d2de 100%); color:var(--brand); border-bottom:1px solid #eac3d1}
.ao-kopf-once{background:linear-gradient(180deg,#f7efe3 0%,#f0e4d2 100%); color:var(--brand); border-bottom:1px solid #e6d7c2}
.ao-zz{margin-left:auto; font-family:var(--font-body); font-size:.88rem; font-weight:600; opacity:.9}
.ao-inhalt{padding:24px 18px 26px}
.ao-einer{max-width:420px; margin:0 auto}
.ao-kopf-karte{background:#45303a; color:#fff; font-size:1rem; border-radius:18px 18px 0 0; padding:13px 16px; justify-content:center; text-align:center}
.ao-einer .obox{border-radius:0 0 18px 18px; border-top:0}
.ao .obox{position:relative; background:#fff}
.ao-rabatt{position:absolute; top:14px; right:14px; z-index:3; background:#e01f47; color:#fff; border-radius:7px; padding:8px 16px; font-family:var(--font-body); font-size:1.2rem; font-weight:700; line-height:1.2; white-space:nowrap; letter-spacing:.01em; box-shadow:0 4px 12px rgba(224,31,71,.28)}
.ao .obox.mitrabatt .ohead img{margin-top:30px}
.ao .dxgrid{margin-top:64px}
@media(max-width:820px){
  .ao-kopf{font-size:1.2rem; padding:16px; flex-wrap:wrap; gap:4px; justify-content:center; text-align:center}
  .ao-zz{margin-left:0; flex-basis:100%; text-align:center}
  .ao-kopf-karte{font-size:.95rem}
  .ao-abo{margin-bottom:0}
  .ao-bundle{margin-top:20px}
  .ao-kopf-once{margin-bottom:0}
  .ao-bundle .dxgrid{margin-top:9px}
  .ao-rabatt{top:12px; right:11px; font-size:1rem; padding:6px 12px}
}
}


    .payoff-box{background:var(--paper,#fffefd);border:1px solid var(--cream-4,#e9e0d1);border-radius:16px;padding:24px 26px 20px;margin:0 0 30px;box-shadow:0 14px 34px rgba(75,51,52,.10)}
    .payoff-box .pb-tag{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;background:#fbe7e7;color:#b00023;padding:5px 12px;border-radius:100px;margin-bottom:10px}
    .payoff-box .pb-head{font-family:var(--font-head,Georgia,serif);font-weight:700;font-size:1.28rem;line-height:1.28;color:var(--brand,#45303a);margin:0 0 14px}
    .payoff-box .pb-row{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--cream-4,#e9e0d1)}
    .payoff-box .pb-x{flex-shrink:0;width:23px;height:23px;border-radius:50%;background:#fbe7e7;color:#b00023;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.8rem;margin-top:2px}
    .payoff-box .pb-row p{margin:0;font-size:.99rem;line-height:1.5}
    .payoff-box .pb-row .pb-fix{color:#1d8a45;font-weight:600}
    .payoff-box .pb-close{margin:14px 0 0;font-size:1.02rem}
    .payoff-box .pb-row--focus{background:var(--orange-tint,#fdf1e6);border-radius:10px;padding:12px 14px;border-top:none;margin-top:6px}
    .pb-bridge{text-align:center;margin-top:41px}
    .pb-bridge h2{font-size:clamp(2.42rem,3.6vw,3rem);line-height:1.14;text-wrap:balance;margin:0 auto;max-width:20ch}
    .pb-bridge .pb-arrow{font-size:2rem;color:var(--orange-dark,#be6330);margin-top:20px;animation:pbArrow 1.8s ease-in-out infinite}
    @keyframes pbArrow{0%,100%{transform:translateY(0);opacity:.75}50%{transform:translateY(9px);opacity:1}}
    @media(prefers-reduced-motion:reduce){.pb-bridge .pb-arrow{animation:none}}section.pb-sec{padding-top:clamp(40px,5vw,62px);padding-bottom:clamp(40px,5vw,62px)}@media(max-width:680px){section.pb-sec{padding-top:29px;padding-bottom:29px}.pb-bridge{margin-top:0}.pb-bridge .pb-arrow{margin-top:14px;font-size:1.7rem}}
    

#erfahrungs-finder .tf-wrap{max-width:1000px;margin:0 auto;padding:0 22px}
#erfahrungs-finder .tf-head{max-width:720px}
#erfahrungs-finder .tf-panel{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 18px;background:var(--paper,#fff);border:1px solid var(--cream-4);border-radius:100px;box-shadow:0 10px 30px rgba(75,51,52,.08);padding:10px 14px;margin:30px auto;max-width:720px}
#erfahrungs-finder .tf-pills{display:flex;flex-wrap:wrap;gap:6px}
#erfahrungs-finder .tf-pill{appearance:none;border:1.5px solid transparent;background:transparent;color:var(--brand);font-family:inherit;font-weight:700;font-size:.88rem;padding:9px 16px;border-radius:100px;cursor:pointer;transition:all .15s}
#erfahrungs-finder .tf-pill:hover{background:var(--cream-2)}
#erfahrungs-finder .tf-pill.is-on{background:var(--accent);color:#fff;box-shadow:0 6px 16px rgba(178,58,93,.25)}
#erfahrungs-finder .tf-meta{font-size:.88rem;color:var(--coffee-400);padding-right:8px;white-space:nowrap}
#erfahrungs-finder .tf-meta b{color:var(--accent-dark,var(--accent))}
#erfahrungs-finder .tfc{position:relative;margin:30px 0}
#erfahrungs-finder .tfc-viewport{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;display:flex;border-radius:4px}
#erfahrungs-finder .tfc-viewport::-webkit-scrollbar{display:none}
#erfahrungs-finder .tfc-page{flex:0 0 100%;min-width:100%;scroll-snap-align:start;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-content:start;padding:2px}
@media(max-width:900px){#erfahrungs-finder .tfc-page{grid-template-columns:1fr 1fr}}
@media(max-width:640px){#erfahrungs-finder .tfc-page{grid-template-columns:1fr}}
#erfahrungs-finder .rev{margin:0}
#erfahrungs-finder .rev p{flex:1}
#erfahrungs-finder .rev{display:flex;flex-direction:column}
#erfahrungs-finder .tfc-nav{display:flex;align-items:center;justify-content:center;gap:16px;margin:26px 0 0}
#erfahrungs-finder .tfc-btn{appearance:none;border:0;width:46px;height:46px;border-radius:50%;background:var(--accent);color:#fff;font-size:1.15rem;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(178,58,93,.3);transition:all .15s}
#erfahrungs-finder .tfc-btn:hover{background:var(--accent-dark,var(--orange-dark))}
#erfahrungs-finder .tfc-btn[disabled]{background:var(--cream-4);color:var(--muted);box-shadow:none;cursor:default}
#erfahrungs-finder .tfc-count{font-size:.92rem;font-weight:700;color:var(--brand);min-width:86px;text-align:center}
#erfahrungs-finder .tfc-count span{color:var(--muted);font-weight:500}
#erfahrungs-finder .tf-foot{font-size:.8rem;color:var(--muted);line-height:1.5;margin:26px 0 0;max-width:820px}
.sf-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}@media(max-width:560px){.sfacts{padding:18px 14px}.sf-table{font-size:.78rem}.sf-table th,.sf-table td{padding:9px 4px}.sf-table th{font-size:.6rem;letter-spacing:.02em}.sf-table th:nth-child(2),.sf-table th:nth-child(3){white-space:normal}}#erfahrungs-finder{overflow-x:clip}#erfahrungs-finder .tfc-viewport{overscroll-behavior-x:contain}@media(max-width:560px){#erfahrungs-finder .tf-wrap{padding:0 16px}#erfahrungs-finder .tf-panel{border-radius:22px;padding:14px 12px;gap:10px 8px}#erfahrungs-finder .tf-pills{justify-content:center}#erfahrungs-finder .tf-pill{font-size:.82rem;padding:8px 12px}}@media(max-width:680px){.dxbtn.s{background:var(--orange-dark);color:#fff;border-color:transparent;box-shadow:0 10px 26px rgba(154,47,78,.3)}}
.lpfoot{background:var(--brand,#45303a);color:rgba(255,255,255,.7);padding:34px 22px 40px;text-align:center;font-size:.86rem;line-height:1.6}.lpfoot nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin-bottom:16px}.lpfoot a{color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:2px}.lpfoot a:hover{border-bottom-color:#fff}.lpfoot .fn{font-size:.8rem;color:rgba(255,255,255,.55);max-width:640px;margin:0 auto 12px}.lpfoot .cr{font-size:.78rem;color:rgba(255,255,255,.45)}@media(max-width:560px){.lpfoot{padding:28px 18px 34px}.lpfoot nav{gap:9px 18px;font-size:.84rem}}@media(max-width:560px){.checkout-trust{justify-content:center}.checkout-trust .pay-badges{justify-content:center}}.cmp-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}@media(max-width:640px){.compare{font-size:.72rem;min-width:0;width:100%;table-layout:fixed}.compare th:first-child,.compare td:first-child{width:30%}.compare th,.compare td{padding:8px 6px;overflow-wrap:break-word;hyphens:auto}.compare .cmp-img{width:58px;height:58px}.compare thead th{font-size:.6rem;letter-spacing:.02em}}.jumpmid{display:block;height:0;scroll-margin-top:clamp(200px,46vh,460px)}@media(max-width:680px){.jumpmid{scroll-margin-top:clamp(150px,38vh,300px)}}

/* Mobil-Korrekturen Sprachfassungen (19.8.): in FR/IT/NL sind Banderole und
   Kursiv-Headlines laenger als im Deutschen. Zwei Folgen davon werden hier
   geloest, damit sie in JEDER Sprache tragen. */
@media(max-width:680px){
  
  .banderole{font-size:.9rem; padding:11px 16px}
}
/* 2. Kursive Teil-Headline darf umbrechen, sobald der Platz knapp wird.
      Das nowrap galt bis 360px und liess die laengeren Sprachen aus dem Bild laufen. */
@media(max-width:900px){
  .sub-h em{white-space:normal}
}