/* Bine backt – Vorschau Startseite (Mockup freigegeben am 02.10.2026)
   Gilt nur auf der Startseite (body.home) und nur in der Vorschau. */
body.bb-vorschau.home .bb-panel:not(.bb-panel--petrol){background:transparent!important;box-shadow:none!important;border:0!important;border-radius:0!important;border-top:1px solid #e5e5e2!important}
body.bb-vorschau.home .bb-panel--petrol{box-shadow:none!important;border-radius:var(--bb-radius-lg)}
body.bb-vorschau.home .bb-panel--petrol + .bb-panel{border-top:0!important}

/* Hero: Bild als Foto mit Ecken statt Verlauf */
body.bb-vorschau.home .hv__text .hl span{color:#9a3d33}

/* Wegweiser: weiße Karten mit Linie, ohne Schatten; Button wird Textlink */
body.bb-vorschau.home .bb-wegweiser .wp-block-column{box-shadow:none!important;border:1px solid #e5e5e2;border-radius:var(--bb-radius-lg)!important;position:relative;transition:border-color .2s}
body.bb-vorschau.home .bb-wegweiser .wp-block-column:hover{border-color:#9a3d33}
body.bb-vorschau.home .bb-wegweiser h3{color:#3a2620!important}
body.bb-vorschau.home .bb-wegweiser .wp-block-column:hover h3{color:#9a3d33!important}
body.bb-vorschau.home .bb-wegweiser .wp-block-column p{font-size:var(--wp--preset--font-size--m,1rem)!important}
body.bb-vorschau.home .bb-wegweiser .wp-block-button__link{background:none!important;color:#9a3d33!important;padding:0 0 .2rem!important;border:0!important;border-bottom:2px solid currentColor!important;border-radius:0!important;font-weight:700;font-size:1rem!important;box-shadow:none!important}
body.bb-vorschau.home .bb-wegweiser .wp-block-button__link::after{content:"";position:absolute;inset:0}

/* Rezept-Kacheln: Foto mit Schatten, Titel darunter statt auf dem Foto */
body.bb-vorschau.home a.rezept-kachel{aspect-ratio:auto!important;overflow:visible!important;border-radius:0!important;display:grid!important;gap:.85rem;border-top:1px solid #e5e5e2;padding-top:1rem;margin-bottom:1.5rem}
body.bb-vorschau.home a.rezept-kachel img{position:static!important;aspect-ratio:3/2;height:auto!important;box-shadow:0 16px 36px rgba(58,38,32,.12),0 4px 10px rgba(58,38,32,.045);transition:transform .4s ease}
body.bb-vorschau.home a.rezept-kachel > span:first-of-type{display:none!important}
body.bb-vorschau.home a.rezept-kachel > span:last-of-type{position:static!important;color:#3a2620!important;text-shadow:none!important;font-size:clamp(1.15rem,1.05rem + .4vw,1.35rem)!important;font-weight:500!important}
body.bb-vorschau.home a.rezept-kachel:hover > span:last-of-type{color:#9a3d33!important}
body.bb-vorschau.home a.rezept-kachel:hover img{transform:scale(1.02)}
body.bb-vorschau.home .rezept-kachel img{filter:none!important}

/* Blog-Kacheln: Foto mit Schatten, Titel darunter, keine Karte */
body.bb-vorschau.home .bb-kachel{background:transparent!important;box-shadow:none!important;border:0!important;border-top:1px solid #e5e5e2!important;border-radius:0!important;padding:1rem 0 0!important}
body.bb-vorschau.home .bb-kachel .wp-block-post-featured-image{box-shadow:0 16px 36px rgba(58,38,32,.12),0 4px 10px rgba(58,38,32,.045);border-radius:0!important;overflow:hidden}
body.bb-vorschau.home .bb-kachel .wp-block-post-featured-image img{border-radius:0!important}
body.bb-vorschau.home .bb-kachel .wp-block-post-featured-image::after{display:none!important}
body.bb-vorschau.home .bb-kachel .wp-block-post-title{position:static!important;color:#3a2620!important;text-shadow:none!important;padding:1rem 0 0!important;font-size:clamp(1.15rem,1.05rem + .4vw,1.35rem)!important;font-weight:500!important;line-height:1.25}
body.bb-vorschau.home .bb-kachel .wp-block-post-title a{color:inherit!important}
body.bb-vorschau.home .bb-kachel:hover .wp-block-post-title{color:#9a3d33!important}

/* Starter-Check: dunkle Fläche wie im Werkzeug-Hinweis */
body.bb-vorschau.home .bb-quiz-cta:has(a[href*="starter-check"]){background:#3a2620!important;border:0!important;border-radius:var(--bb-radius-lg)!important;overflow:hidden;margin-top:2.5rem}
body.bb-vorschau.home .bb-quiz-cta:has(a[href*="starter-check"]) :is(h2,p){color:#fcfcfb!important}
body.bb-vorschau.home .bb-quiz-cta:has(a[href*="starter-check"]) .bb-quiz-cta__eyebrow{color:#f7ece9!important}
body.bb-vorschau.home .bb-quiz-cta:has(a[href*="starter-check"]) .wp-block-button__link{background:#fcfcfb!important;color:#3a2620!important;border-color:#fcfcfb!important}
body.bb-vorschau.home .bb-quiz-cta:has(a[href*="starter-check"]) .wp-block-button__link:hover{background:#fff!important;color:#7a2f27!important}
body.bb-vorschau.home .bb-quiz-cta:has(a[href*="starter-check"]) + .bb-panel{border-top:0!important}

/* Buttons etwas weniger dominant (wie im Design System) */
body.bb-vorschau.home .bb-btn .wp-block-button__link{border-radius:.5rem!important}

/* WhatsApp und Newsletter: Linie statt Petrol-Strich, kein Schatten */
body.bb-vorschau.home .bb-kanal{box-shadow:none!important;border-top:1px solid #e5e5e2!important;background:transparent!important}
body.bb-vorschau.home .bb-kachel > *{margin-left:0!important;margin-right:0!important}
body.bb-vorschau.home .bb-kachel .wp-block-post-title{padding-left:0!important;padding-right:0!important}

/* ================= Startseite nach Mockup (inc/gestaltung-startseite.php) ================= */
.bb-st{--rand:clamp(1rem,.6087rem + 1.7391vw,2rem);font-family:Mulish,sans-serif;color:#3a2620;font-size:var(--wp--preset--font-size--m,1.0625rem);line-height:1.65;margin-top:0!important}
.bb-st *{box-sizing:border-box}
.bb-st img{display:block;max-width:100%;height:auto}
.bb-st .seite{max-width:73.5rem;margin:0 auto;padding:0 var(--rand)}
.bb-st .bb-dachzeile{display:block;font:700 clamp(.75rem,.7255rem + .1087vw,.8125rem)/1.3 Mulish,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#9a3d33}
.bb-st .bb-button{display:inline-flex;align-items:center;gap:.5rem;font:700 .9375rem/1 Mulish,sans-serif;padding:.625rem 1.125rem;border-radius:.5rem;border:2px solid #9a3d33;background:#9a3d33;color:#fff!important;text-decoration:none!important;cursor:pointer}
.bb-st .bb-button:hover{background:#7a2f27;border-color:#7a2f27}
.bb-st .bb-button--zweit{background:#fff;color:#9a3d33!important}
.bb-st .bb-button--zweit:hover{background:#f7ece9;border-color:#9a3d33}
.bb-st .bb-button:focus-visible,.bb-st .mehr-link:focus-visible{outline:3px solid #3a2620;outline-offset:2px}
.bb-st .mehr-link{font-weight:700;color:#9a3d33!important;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;white-space:nowrap}
.bb-st .mehr-link:hover{color:#7a2f27!important}
.bb-st .abschnitt{padding:clamp(3rem,2.6087rem + 1.7391vw,4rem) 0}
.bb-st .abschnitt + .abschnitt{border-top:1px solid #e5e5e2}
.bb-st .abschnitt__kopf{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:.75rem 2rem;margin-bottom:2rem}
.bb-st h2{font:600 clamp(1.625rem,1.4783rem + .6522vw,2rem)/1.18 Fraunces,Georgia,serif;color:#3a2620;margin:.4rem 0 0;text-wrap:balance;letter-spacing:normal}
.bb-st h2::before{content:none!important}
.bb-st p{margin:0}
/* Hero */
.bb-st .sh{max-width:73.5rem;margin:0 auto;padding:2rem var(--rand) clamp(3rem,2.6087rem + 1.7391vw,4rem);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.bb-st .sh h1{font:600 clamp(2.4rem,1.6rem + 3.4vw,4.4rem)/1.02 Fraunces,Georgia,serif;margin:0;letter-spacing:-.01em;color:#3a2620}
.bb-st .sh h1 .rot{display:block;color:#9a3d33}
.bb-st .sh .lead{font-family:Fraunces,Georgia,serif;font-style:italic;font-size:clamp(1.1rem,1rem + .4vw,1.3rem);line-height:1.55;margin:1.25rem 0 0;max-width:30rem}
.bb-st .sh .bb-button{margin-top:1.6rem}
.bb-st .sh__bild img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:1rem}
.bb-st .sh__bine{display:flex;gap:.9rem;align-items:center;margin-top:2rem;padding-top:1.25rem;border-top:1px solid #e5e5e2;max-width:30rem;font-size:clamp(.875rem,.8505rem + .1087vw,.9375rem)}
.bb-st .sh__bine img{width:3.5rem;height:3.5rem;border-radius:50%;object-fit:cover;flex:none}
/* Band */
.bb-st .band{background:#f1f1ef;padding:clamp(3rem,2.6087rem + 1.7391vw,4rem) var(--rand);text-align:center}
.bb-st .band h2{margin:0}
.bb-st .band p{max-width:40rem;margin:1rem auto 0;font-size:clamp(1.05rem,1rem + .35vw,1.25rem);line-height:1.7}
/* Ich */
.bb-st .ich{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.bb-st .ich blockquote{margin:.6rem 0 0;padding:0;border:0;font:500 clamp(1.35rem,1.15rem + .8vw,1.75rem)/1.35 Fraunces,Georgia,serif;text-wrap:balance;color:#3a2620}
.bb-st .ich p{margin:1rem 0 0;max-width:36rem}
.bb-st .ich .bb-button{margin-top:1.5rem}
.bb-st .ich img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%;border-radius:1rem}
/* Wege */
.bb-st .wege{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem)}
.bb-st .weg{position:relative;background:#fff;border:1px solid #e5e5e2;border-radius:1rem;padding:clamp(1rem,.8043rem + .8696vw,1.5rem);display:grid;gap:.6rem;align-content:start;justify-items:start}
.bb-st .weg img{width:6.5rem;height:auto;margin-bottom:.25rem}
.bb-st .weg h3{margin:0;font:600 clamp(1.3125rem,1.2391rem + .3261vw,1.5rem)/1.2 Fraunces,Georgia,serif;color:#3a2620}
.bb-st .weg .mehr-link{margin-top:.4rem}
.bb-st .weg .mehr-link::after{content:"";position:absolute;inset:0}
.bb-st .weg:hover{border-color:#9a3d33}
.bb-st .weg:hover h3{color:#9a3d33}
/* Zusammen */
.bb-st .zusammen{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.bb-st .zusammen img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:1rem}
.bb-st .zusammen p{margin:.9rem 0 0}
.bb-st .zusammen .bb-button{margin-top:1.4rem}
/* Rezeptkarten */
.bb-st .raster{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:clamp(2rem,1.6087rem + 1.7391vw,3rem) clamp(1.25rem,2.5vw,2.25rem)}
.bb-st .raster--4{grid-template-columns:repeat(auto-fill,minmax(min(100%,14rem),1fr))}
.bb-st .rk2{position:relative;display:flex;flex-direction:column;gap:1.1rem;border-top:1px solid #e5e5e2;padding-top:1.1rem}
.bb-st .rk2__bild{overflow:hidden;box-shadow:0 16px 36px rgba(58,38,32,.12),0 4px 10px rgba(58,38,32,.045);background:#f1f1ef}
.bb-st .rk2__bild img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform .4s ease}
.bb-st .rk2__inhalt{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:.6rem;padding-right:clamp(.75rem,1.5vw,1.5rem)}
.bb-st .rk2__dach{font:700 clamp(.75rem,.7255rem + .1087vw,.8125rem)/1.3 Mulish,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#9a3d33}
.bb-st .rk2__titel{margin:0;font:300 clamp(1.2rem,1.1rem + .4vw,1.35rem)/1.12 Fraunces,Georgia,serif;color:#3a2620;text-wrap:balance;min-height:calc(3 * 1.12em)}
.bb-st .rk2__titel b{font-weight:500}
.bb-st .rk2__titel a{color:inherit;text-decoration:none}
.bb-st .rk2__titel a::after{content:"";position:absolute;inset:0}
.bb-st .rk2__mehr{margin-top:auto;font:700 clamp(.875rem,.8505rem + .1087vw,.9375rem)/1.3 Mulish,sans-serif;color:#9a3d33;border-bottom:1px solid currentColor;padding-bottom:.2rem}
.bb-st .rk2:hover .rk2__titel b{color:#9a3d33}
.bb-st .rk2:hover .rk2__bild img{transform:scale(1.03)}
.bb-st .rk2:has(a:focus-visible),.bb-st .ak:has(a:focus-visible){outline:3px solid #3a2620;outline-offset:6px;border-radius:2px}
.bb-st :is(.rk2__titel,.ak__titel) a:focus-visible{outline:none}
/* Werkzeug Starter-Check */
.bb-st .werk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);background:#3a2620;color:#fcfcfb;border-radius:1rem;overflow:hidden}
.bb-st .werk img{width:100%;height:100%;object-fit:cover;min-height:16rem}
.bb-st .werk__text{padding:clamp(1.5rem,1rem + 2.5vw,3rem);display:grid;gap:.6rem;align-content:center;justify-items:start}
.bb-st .werk .bb-dachzeile{color:#f7ece9}
.bb-st .werk h2{margin:0;color:#fff}
.bb-st .werk p{max-width:30rem;color:#fcfcfb}
.bb-st .werk__fakten{display:flex;flex-wrap:wrap;gap:.4rem;margin:.2rem 0 .4rem}
.bb-st .werk__fakten span{font:700 .72rem/1 Mulish,sans-serif;letter-spacing:.06em;padding:.4rem .65rem;border:1px solid rgba(252,252,251,.35);border-radius:999px}
.bb-st .werk .bb-button{background:#fcfcfb;border-color:#fcfcfb;color:#3a2620!important}
.bb-st .werk .bb-button:hover{background:#fff;border-color:#fff;color:#7a2f27!important}
/* Blog */
.bb-st .ak{position:relative;display:grid;gap:.8rem;align-content:start}
.bb-st .ak__bild{overflow:hidden;border-radius:1rem;background:#f1f1ef}
.bb-st .ak__bild img{width:100%;aspect-ratio:3/2;object-fit:cover;transition:transform .4s ease}
.bb-st .ak__titel{margin:0;font:600 clamp(1.125rem,1.0761rem + .2174vw,1.25rem)/1.3 Fraunces,Georgia,serif;text-wrap:balance}
.bb-st .ak__titel a{color:#3a2620;text-decoration:none}
.bb-st .ak__titel a::after{content:"";position:absolute;inset:0}
.bb-st .ak:hover .ak__titel a{color:#9a3d33}
.bb-st .ak:hover .ak__bild img{transform:scale(1.03)}
/* Kanal */
.bb-st .kanal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(1.5rem,4vw,3rem);align-items:start}
.bb-st .kanal p{margin:0 0 1rem}
.bb-st .kanal small{display:block;color:#62514a;font-size:.85rem;margin-top:1rem}
/* Newsletter */
.bb-st .brief{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);background:#fff;border:1px solid #e5e5e2;border-radius:1rem;overflow:hidden}
.bb-st .brief img{width:100%;height:100%;object-fit:cover;min-height:18rem}
.bb-st .brief__text{padding:clamp(1.5rem,1rem + 2.5vw,3rem);display:grid;gap:.6rem;align-content:center}
.bb-st .brief h2{margin:0;font:600 clamp(2rem,1.6rem + 1.6vw,2.8rem)/1.05 Fraunces,Georgia,serif}
.bb-st .brief h2 small{display:block;font:italic 400 1.15rem/1.4 Fraunces,Georgia,serif;color:#62514a;margin-top:.3rem}
.bb-st .brief .klein,.bb-st .brief .nl-fineprint{font-size:.82rem!important;color:#62514a!important}
.bb-st .brief .nl-form{display:grid;gap:.6rem;margin-top:.6rem}
.bb-st .brief .nl-row{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.bb-st .brief .nl-field{font:400 1rem/1.2 Mulish,sans-serif!important;padding:.75rem .9rem!important;border:1.5px solid #8c8580!important;border-radius:.375rem!important;background:#fff!important;color:#3a2620;min-width:0;width:100%;box-shadow:none!important}
.bb-st .brief .nl-btn{display:flex;justify-content:center;width:100%;font:700 .9375rem/1 Mulish,sans-serif!important;padding:.85rem 1.125rem!important;border-radius:.5rem!important;border:2px solid #9a3d33!important;background:#9a3d33!important;color:#fff!important;text-transform:none!important;letter-spacing:0!important;box-shadow:none!important;cursor:pointer}
.bb-st .brief .nl-btn:hover{background:#7a2f27!important;border-color:#7a2f27!important}
.bb-st .brief .nl-fineprint{margin:0}
@media (max-width:52rem){.bb-st .sh{grid-template-columns:1fr}.bb-st .sh__bild{order:-1}}
@media (max-width:44rem){
 .bb-st .ich{grid-template-columns:1fr}.bb-st .ich img{max-width:20rem;aspect-ratio:1/1}
 .bb-st .wege{grid-template-columns:1fr}.bb-st .weg{grid-template-columns:5rem minmax(0,1fr);column-gap:1rem}.bb-st .weg img{grid-row:1/span 3;width:5rem}
 .bb-st .zusammen{grid-template-columns:1fr}
 .bb-st .raster,.bb-st .raster--4{grid-template-columns:1fr;gap:2rem}.bb-st .rk2__titel{min-height:0}.bb-st .rk2__inhalt{padding-right:0}
 .bb-st .werk{grid-template-columns:1fr}.bb-st .werk img{aspect-ratio:3/2;min-height:0}
 .bb-st .kanal{grid-template-columns:1fr}
 .bb-st .brief{grid-template-columns:1fr}.bb-st .brief img{aspect-ratio:3/2;min-height:0}.bb-st .brief .nl-row{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.bb-st :is(.rk2__bild,.ak__bild) img{transition:none}}

/* Startseiten-Hero randlos (Variante B, Sabine 03.10.2026), wie der Übersichts-Hero */
body{overflow-x:clip}
main:has(> .bb-st){margin-top:0!important}
@media (min-width:60.0625rem){
 .bb-st .sh{--uh-innen:max(var(--rand),calc((100vw - 73.5rem)/2 + var(--rand)));max-width:none;padding:0;gap:0;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);align-items:stretch;min-height:clamp(28rem,36vw,34rem)}
 .bb-st .sh > div:first-child{align-self:center;padding:3rem clamp(2rem,4vw,4rem) 3.5rem var(--uh-innen)}
 .bb-st .sh__bild{position:relative;overflow:hidden;margin:0;border-radius:0;aspect-ratio:auto;height:100%}
 .bb-st .sh__bild img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none;object-fit:cover;border-radius:0!important}
}
@media (max-width:60rem){
 .bb-st .sh{padding-top:0}
 .bb-st .sh__bild{margin-inline:calc(-1 * var(--rand));border-radius:0}
 .bb-st .sh__bild img{border-radius:0!important}
}