/* 12.09.2026: Weiße und farbige Inhaltsabschnitte wechseln sich ab.
   Logozeilen gehören zum angrenzenden weißen Abschnitt. Formulare bleiben
   zusammenhängende Bedienflächen; Dialoge und verborgene Schritte sind keine Bänder. */
/* Unterseiten beginnen kompakt und rein typografisch. Die Fotocollage bleibt der
   Startseite vorbehalten. */
.inner-page .inner-hero-photos{
  display:grid;
  min-height:560px;
  padding:92px 36px 88px;
  place-items:center;
}
.inner-page .inner-hero-photos .inner-hero-gallery,
.inner-page .inner-hero-photos .inner-scroll-cue{display:none}
.inner-page .inner-hero-photos .inner-hero-copy{
  width:min(940px,100%);
  margin:0 auto;
  text-align:center;
}
.inner-page .inner-hero-photos .lead{
  max-width:760px;
  margin-right:auto;
  margin-left:auto;
}
.inner-page .inner-hero-photos .actions{justify-content:center}
[data-rhythm-band][data-section-tone="white"]{--rhythm-bg:#fff}
[data-rhythm-band][data-section-tone="mint"]{--rhythm-bg:#a5cfb2}
[data-rhythm-band][data-section-tone="lavender"]{--rhythm-bg:#e8def4}
[data-rhythm-band][data-section-tone="apricot"]{--rhythm-bg:#ffc9ae}
[data-rhythm-band][data-section-tone="yellow"]{--rhythm-bg:#faf6b4}
html body main [data-rhythm-band]{background:var(--rhythm-bg)!important;color:#1a1a1a}
/* Schmale Lesespalten behalten ihre Breite; ihre Farbe reicht bis zum Rand. */
html body main .content-section[data-rhythm-band]{
  padding-block:56px;margin-block:0;border-top:0;
  box-shadow:0 0 0 100vmax var(--rhythm-bg);
  clip-path:inset(0 -100vmax);
}
html body main>.content-prose:has(>.content-section){padding-block:0}
.article-layout .content-prose>.content-section:first-of-type{margin-top:32px}
.article-layout .article-photo{z-index:1}
/* Auf einer weißen Fläche liegen Produktkarten wie bisher weiß auf Weiß. */
html body main [data-rhythm-band][data-section-tone="white"] .feature-card{background:#fff}
/* Die geteilte Brand-Zeile bleibt auch mit Abschnittsfarbe zweispaltig. */
@media(max-width:700px){
  html body main .content-section[data-rhythm-band]{padding-block:38px}
  .inner-page .inner-hero-photos{min-height:auto;padding:72px 22px 76px}
  .inner-page .inner-hero-photos .actions{align-items:stretch;flex-direction:column}
  .inner-page .inner-hero-photos .btn{justify-content:center;width:100%}
}
/* Blogbilder behalten gerade Ecken; Text sitzt mit Abstand in der weißen Karte. */
html body main .content-library[data-rhythm-band] .editorial{border-radius:0!important}
html body main .content-library[data-rhythm-band] .editorial h2{margin-inline:24px}

/* Rechtliches und AGB bleiben bewusst neutral: ruhige weiße Leseflächen ohne
   wechselnde Markenfarben. */
html body.page-rechtliches main [data-section-tone],
html body.page-rechtliches main [data-rhythm-band]{
  --section-field:#fff;
  --rhythm-bg:#fff;
  background:#fff!important;
}
html body.page-rechtliches main .content-section[data-rhythm-band]{
  box-shadow:0 0 0 100vmax #fff;
}

/* Mintfarbener Abschluss nach Jens Referenz vom 13.09.2026. */
html body main .start-closing-cta{
  --section-field:#a5cfb2;
  --rhythm-bg:#a5cfb2;
  --feld-100:#a5cfb2;
  --feld-600:#1f4e31;
  background:#a5cfb2!important;
  color:#1a1a1a;
}

/* Einheitlicher Footer: Weiß, schwarze Schrift, ohne grünes Abschlussband. */
html body.tilt-preview .site-footer.brand-footer{
  background:#fff!important;
  color:#151515!important;
  border-top:0!important;
  --feld-600:#151515;
}
html body.tilt-preview .site-footer.brand-footer .footer-logo,
html body.tilt-preview .site-footer.brand-footer .footer-heading,
html body.tilt-preview .site-footer.brand-footer .footer-top a,
html body.tilt-preview .site-footer.brand-footer .footer-bottom,
html body.tilt-preview .site-footer.brand-footer .footer-bottom a,
html body.tilt-preview .site-footer.brand-footer .cookie-footer button{
  color:#151515!important;
}
html body.tilt-preview .site-footer.brand-footer .footer-bottom{
  border-color:rgba(21,21,21,.18)!important;
}

/* Die erläuternden Texte der Emma-Schritte müssen auch in der fixierten
   Desktop-Darstellung sichtbar bleiben. */
.emma-story .emma-scroll-copy>p:not(.emma-step-number),
.emma-story .emma-scroll-copy>.text-link{
  display:block!important;
  visibility:visible!important;
  color:#1a1a1a;
}
