/*
Theme Name: Sabine Blog
Theme URI: https://sabinedobner.de
Description: Schlankes Block-Child-Theme von Twenty Twenty-Five mit fest verankertem Design-System (Fraunces & Mulish, eigene Farbpalette). Selbst gehostete Schriften, keine externen CDN-Aufrufe.
Author: Sabine Dobner
Template: twentytwentyfive
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 8.0
Text Domain: sabine-blog
*/

:root{--bb-border:1px solid var(--wp--preset--color--sand);--bb-card-bg:#FFFCF7;--bb-surface:#FFFFFF;--bb-radius-sm:0.5rem;--bb-radius-md:0.75rem;--bb-radius-lg:1rem;--bb-shadow-sm:0 0.125rem 0.625rem rgba(43,38,34,.08);--bb-shadow-md:0 0.5rem 1.125rem rgba(43,38,34,.12);--bb-shadow-lg:0 0.75rem 2rem rgba(43,38,34,.14);--bb-shadow-panel:0 0.625rem 1.875rem rgba(43,38,34,.12);--bb-text-muted:#5C5347;--bb-text-placeholder:#9a9088;--bb-petrol-tint:#DCE8E7;--bb-petrol-dark:#2E5150;--bb-sand-tint:#EFE7DC;--bb-border-hover:#E0D2BF;--bb-hairline:#ECE5DA;--bb-tint-warm:#F3EEE6;--bb-table-zebra:#FAF6EF;--bb-tipp-wash:#F3F6F5;--bb-tipp-edge:#3E6B6A;--bb-tipp-ink:#2E5150;--bb-info-wash:#F7F3EC;--bb-info-edge:#8A8172;--bb-info-ink:#5C5347;--bb-hinweis-wash:#FBF6F1;--bb-hinweis-edge:#BE5A2E;--bb-hinweis-ink:#813A1A;--bb-gutter-mobile:10px;--bb-section-pad-x:clamp(1.5rem,4vw,2rem);--bb-section-pad-y:clamp(2rem,5vw,3rem);--bb-card-pad:1.15rem;--bb-grid-gap:1.5rem}
/* Rezept-Kacheln: Hover-Zoom */
.rezept-kachel img{transition:transform .5s ease,filter .5s ease}
.rezept-kachel:hover img{transform:scale(1.06);filter:brightness(.92)}

/* TEIL A – Bine-Sektion auf Desktop spiegeln (Foto rechts), Mobile gestapelt */
@media (min-width:782px){.bine-reverse{flex-direction:row-reverse}}

/* TEIL B – Newsletter-Formular */
.nl-form{display:flex;flex-direction:column;gap:.75rem;margin-top:1.25rem;max-width:27.5rem}
.nl-form .nl-field{width:100%;min-height:3rem;padding:.7rem 1rem;border:var(--bb-border);border-radius:var(--bb-radius-sm);background:var(--bb-surface);color:var(--wp--preset--color--espresso);font-family:Mulish,sans-serif;font-size:1rem}
.nl-form .nl-field::placeholder{color:var(--bb-text-placeholder)}
.nl-form .nl-field:focus{outline:none;border-color:var(--wp--preset--color--terrakotta);box-shadow:0 0 0 0.125rem rgba(190,90,46,.2)}
.nl-form .nl-btn{width:100%;padding:.7em 1.6em;border:1.5px solid var(--wp--preset--color--terrakotta);border-radius:.85em;background:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);font-family:Mulish,sans-serif;font-weight:700;font-size:1.15rem;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
.nl-form .nl-btn:hover,.nl-form .nl-btn:focus{background:var(--wp--preset--color--kruste);border-color:var(--wp--preset--color--kruste);color:var(--wp--preset--color--creme)}

/* Newsletter-Felder: nur Mobile – Überlauf fixen + kompakter */
@media (max-width:781px){.nl-form .nl-field{box-sizing:border-box;width:100%;max-width:100%;padding-top:.5rem;padding-bottom:.5rem}}

/* Newsletter-Formular: Honeypot, Fineprint, Erfolg + optionales Band ([bb_newsletter]) */
.nl-form .nl-hp{position:absolute!important;left:-9999px;width:0.0625rem;height:0.0625rem;overflow:hidden}
.nl-fineprint{margin:.15rem 0 0;font-family:Mulish,sans-serif;font-size:.8rem;line-height:1.45;color:var(--bb-text-placeholder)}
.nl-done{margin:0;font-family:Mulish,sans-serif;font-size:1.05rem;line-height:1.55;color:var(--wp--preset--color--espresso)}
.bb-nl{background:var(--wp--preset--color--sand);border-radius:var(--bb-radius-lg);padding:clamp(1.75rem,4vw,2.75rem)}
.bb-nl__title{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.2;font-size:clamp(1.4rem,1.1rem + 1vw,1.9rem);color:var(--wp--preset--color--espresso);margin:0 0 .5rem}
.bb-nl__text{font-family:Mulish,sans-serif;font-size:1rem;line-height:1.6;color:var(--wp--preset--color--espresso);margin:0 0 1rem}

/* ===== Newsletter-CTA (Block 11036) – modernes Split-Card, randloses Foto ===== */
.bb-nlcta.bb-panel{overflow:hidden;padding:0}
.bb-nlcta .wp-block-columns{align-items:stretch!important;gap:0!important;margin-block:0}
.bb-nlcta__media{padding:0!important;display:flex;min-height:17rem}
.bb-nlcta__media>.wp-block-image{margin:0;width:100%;display:flex}
.bb-nlcta__media>.wp-block-image>img{width:100%;height:100%;object-fit:cover;object-position:57% center;display:block;border-radius:0!important}
.bb-nlcta__body{padding:clamp(1.75rem,4vw,2.5rem)!important;align-self:center}
.bb-nlcta__eyebrow{display:inline-block;font-family:Mulish,sans-serif;font-weight:700;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--wp--preset--color--kruste);background:var(--bb-sand-tint);padding:.35rem .8rem;border-radius:999px;margin:0 0 .9rem}
.bb-nlcta__h{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.1;color:var(--wp--preset--color--espresso);font-size:clamp(1.9rem,1.5rem + 1.6vw,2.75rem);margin:0}
.bb-nlcta__h span{display:block;font-size:.46em;font-weight:500;color:var(--bb-text-muted);margin-top:.15rem}
.bb-nlcta__text{font-family:Mulish,sans-serif;color:#3F382F;font-size:clamp(1.02rem,1rem + .3vw,1.15rem);line-height:1.65;margin:.9rem 0 0}
.bb-nlcta__text--soft{color:var(--bb-text-muted);font-size:.95rem}
.bb-nlcta .nl-form{margin-top:1.15rem;max-width:28rem}
.bb-nlcta .nl-row{display:flex;gap:.6rem}
.bb-nlcta .nl-row .nl-field{flex:1;margin:0}
@media(max-width:781px){
	.bb-nlcta__media{min-height:0}
	.bb-nlcta__media>.wp-block-image>img{height:auto;aspect-ratio:3/2}
	.bb-nlcta .nl-row{flex-direction:column;gap:.75rem}
}

/* ===== Freebie-CTA Starter-Check (Block 11437, Startseite + Hub) ===== */
.bb-quiz-cta__bild{display:block;aspect-ratio:3/2;border-radius:var(--bb-radius-md);overflow:hidden;text-decoration:none}
.bb-quiz-cta__bild img{width:100%;height:100%;object-fit:cover;display:block}
.bb-quiz-cta__eyebrow{font-size:.95rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin:0 0 .25rem}
.bb-quiz-cta__h{font-size:clamp(1.9rem,1.5rem + 1.5vw,2.6rem);font-weight:600;line-height:1.15;margin:0}
.bb-quiz-cta__text{font-size:clamp(1.05rem,1rem + .4vw,1.2rem);line-height:1.6;margin:0}
.bb-quiz-cta .wp-block-buttons{margin-top:1rem}

/* Lust auf Brot: Button Desktop in Spalte, Mobile unten */
@media (max-width:781px){.lab-hide-mobile{display:none !important}}
@media (min-width:782px){.lab-hide-desktop{display:none !important}}

/* Seitenhintergrund: Creme + feine Leinenstruktur */
body{background-color:var(--wp--preset--color--creme);background-image:repeating-linear-gradient(0deg, rgba(43,38,34,0.03) 0 0.0625rem, transparent 0.0625rem 0.3125rem),repeating-linear-gradient(90deg, rgba(43,38,34,0.03) 0 0.0625rem, transparent 0.0625rem 0.3125rem)}
/* Panel-Karten */
.bb-panel{max-width:var(--wp--style--global--wide-size);margin-inline:auto;margin-block:clamp(2rem,4vw,2.25rem);background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-panel)}
@media (max-width:781px){.bb-panel{margin-inline:calc(var(--bb-gutter-mobile) - var(--wp--style--root--padding-left))!important;margin-block:1.5rem;border-radius:var(--bb-radius-md);box-shadow:none}}

.bb-panel--sand{background:var(--wp--preset--color--sand)}
/* Petrol-Akzentpanel – kräftiger Kontrast für Statement-Sektionen */
/* !important nötig, weil WP an .has-…-color-Klassen selbst !important hängt */
.bb-panel--petrol{background:var(--wp--preset--color--petrol);border-color:var(--wp--preset--color--petrol)}
.bb-panel--petrol .has-text-color{color:var(--wp--preset--color--creme) !important}
/* Intro-Lead (Hub-Seiten): xxl wirkt zu wuchtig – auf Lead-Größe (xl) zähmen.
   !important nötig, weil WP an .has-…-font-size-Klassen selbst !important hängt. */
.bb-intro p.has-xxl-font-size{font-size:var(--wp--preset--font-size--l) !important;line-height:1.45}
.bb-visually-hidden{position:absolute;width:0.0625rem;height:0.0625rem;padding:0;margin:-0.0625rem;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Footer */
.bb-footer a{color:var(--wp--preset--color--creme);text-decoration:none}
.bb-footer-logo{margin:0 0 .8rem}
.bb-footer-logo img{display:block;height:auto;max-width:100%}
.bb-footer a:hover,.bb-footer a:focus{color:var(--wp--preset--color--petrol)}
.bb-footer ul{list-style:none;margin:0;padding:0}
.bb-footer li a{display:inline-block;padding-block:.4rem}

/* Schritt-Liste */
/* Wegpunkt-Band: getöntes Band mit terrakotta Links-Kante als ruhiger, klarer Kapitel-Start. */
.bb-step{display:flex;align-items:center;gap:.9rem;background:var(--bb-sand-tint);border-left:.25rem solid var(--wp--preset--color--terrakotta);padding:.9rem 1.15rem;margin:0 0 1.35rem}

.bb-step .bb-step__num{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.875rem;line-height:1;color:var(--wp--preset--color--terrakotta)}
.bb-step .bb-step__title{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--xl);line-height:1.2;color:var(--wp--preset--color--espresso);display:block;margin:0}
/* Beschreibungstext im Kapitel-Kopf ausgeblendet (gewünscht) */
.bb-step .bb-step__desc{display:none}
/* Foto-Kacheln Query-Loop */
.bb-fototile{overflow:hidden}
.bb-fototile .wp-block-cover__inner-container{position:static}
.bb-fototile .wp-block-cover__image-background{transition:transform .5s ease,filter .5s ease}
.bb-fototile:hover .wp-block-cover__image-background{transform:scale(1.06);filter:brightness(.92)}
.bb-fototile .wp-block-post-title{margin:0}
.bb-fototile .wp-block-post-title a{color:var(--wp--preset--color--creme);text-decoration:none;text-shadow:0 0.0625rem 0.1875rem rgba(43,38,34,.5)}
.bb-fototile .wp-block-post-title a::after{content:"";position:absolute;inset:0}

/* ===== Hero-Sektion (global) – Vorgabe: Sauerteig-Grundlagen. Bild variabel pro Seite; ===== */
/* Gradient + Subline-Größe zentral hier definiert (überschreibt Inline-Werte der Blöcke). */
.bb-hubhero .wp-block-cover__inner-container{width:100%;max-width:var(--wp--style--global--wide-size);margin-inline:auto;padding-inline:1.5rem}
.bb-hubhero__text{max-width:37.5rem}
/* Cream-Gradient links→rechts, läuft weit nach rechts aus */
.bb-hubhero .wp-block-cover__background{background:linear-gradient(90deg,rgba(247,243,239,0.95) 0%,rgba(247,243,239,0.6) 46%,rgba(247,243,239,0) 85%) !important}
/* Subline einheitlich 25px = 1.5625rem */
.bb-hubhero__text p{font-size:1.5625rem !important;line-height:1.5}
/* Hero-Bild links↔rechts spiegeln (nur wo bb-hubhero--flip gesetzt ist) */
.bb-hubhero--flip .wp-block-cover__image-background{transform:scaleX(-1)}
@media (max-width:781px){.bb-hubhero{min-height:20rem !important}.bb-hubhero .wp-block-cover__background{background:linear-gradient(180deg,rgba(251,247,241,.70) 0%,rgba(251,247,241,.90) 100%) !important}}

.bb-fototile .wp-block-post-title a:hover,.bb-fototile .wp-block-post-title a:focus{color:var(--wp--preset--color--creme)}

.bb-hubhero{overflow:hidden}


/* Schritt-Boxen: kein eigener Rahmen ums Kapitel; Kapitel-Start über das getönte Band (.bb-step). */
.bb-stepbox{background:transparent;border:0;border-radius:0;padding:0}
.bb-stepbox + .bb-stepbox{margin-top:2.75rem}
/* Hub-Kapitel: Karten als mitwachsendes Grid statt starrem Core-Flex (columns-N).
   Greift bei jeder Kartenzahl – auch beim 1-Artikel-Kapitel, das WP ohne is-flex-container
   ausgibt und das sonst auf volle Breite aufgeblasen würde. */
.bb-stepbox .wp-block-query .wp-block-post-template{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1.25rem}
/* width:100% (mit !important gegen Core-Flex-Layout) nötig, damit die li ihre Grid-Spalte
   füllt – sonst kollabiert sie auf Inhaltsbreite (Grid-stretch greift mit Flex-li nicht). */
.bb-stepbox .wp-block-query .wp-block-post-template>li{display:flex;width:100% !important}
/* Feature-Karte (.bb-card-wide, z.B. Kapitel mit einem Highlight-Artikel): über die volle Reihe
   statt einsam in einer Grid-Spalte. Skaliert mit – mehrere Wide-Karten stapeln voll. */
.bb-stepbox .wp-block-query .wp-block-post-template>li:has(.bb-card-wide){grid-column:1 / -1}
/* Inhaltskarte (.bb-card): Bild + (Label) + Titel + (Exzerpt) + („Jetzt lesen").
   Volle Karte auf allen Breiten; Text-Kinder direkt in .bb-card. Blog + Hubs. */
.bb-card{display:flex;flex-direction:column;height:100%;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-md);overflow:hidden}
.bb-card .wp-block-post-featured-image{margin:0;overflow:hidden}
.bb-card .wp-block-post-featured-image a{display:block}
.bb-card .wp-block-post-featured-image img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .45s ease}
.bb-card:hover .wp-block-post-featured-image img{transform:scale(1.05)}
.bb-card>:is(.bb-card__eyebrow,.wp-block-post-title,.wp-block-post-excerpt,.wp-block-read-more){padding-inline:var(--bb-card-pad)}
.bb-card>.wp-block-post-featured-image+*{margin-top:var(--bb-card-pad)}
/* Titel direkt nach Bild (Hub-Karten ohne Eyebrow): Abstand oben = unten (1rem) */
.bb-card>.wp-block-post-featured-image+.wp-block-post-title{margin-top:1rem}
/* Eyebrow direkt nach Bild (Blog-Karten): mehr Luft zwischen Bild und Eyebrow */
.bb-card>.wp-block-post-featured-image+.bb-card__eyebrow{margin-top:1.75rem}
.bb-card>:last-child{margin-bottom:var(--bb-card-pad)}
.bb-card .bb-card__eyebrow{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--xs);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--wp--preset--color--terrakotta);margin:0 0 .5rem}
.bb-card .wp-block-post-title{font-family:Fraunces,Georgia,serif;font-size:var(--wp--preset--font-size--l);line-height:1.22;margin:0 0 1rem}
.bb-card .wp-block-post-title a{color:var(--wp--preset--color--espresso);text-decoration:none}
.bb-card .wp-block-post-title a:hover,.bb-card .wp-block-post-title a:focus{color:var(--wp--preset--color--terrakotta)}
/* Titel-Links global: kein Browser-/TT5-Fokuskasten; barrierefreie Unterstreichung nur bei Tastatur-Fokus */
.wp-block-post-title a:focus{outline:none}
.wp-block-post-title a:focus-visible{outline:none;text-decoration:underline;text-decoration-color:var(--wp--preset--color--terrakotta);text-decoration-thickness:0.125rem;text-underline-offset:0.25rem}
.bb-card .wp-block-post-excerpt{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--m);line-height:1.6;color:var(--bb-text-muted);margin:0}
.bb-card .wp-block-post-excerpt p,.bb-card .wp-block-post-excerpt__excerpt{margin:0}
.bb-card .wp-block-read-more{display:inline-flex;align-items:center;width:max-content;font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--m);font-weight:700;color:var(--wp--preset--color--terrakotta);text-decoration:none;margin-top:auto;padding-top:1rem}
.bb-card .wp-block-read-more::after{content:"→";display:inline-block;margin-left:.45rem;transition:transform .2s ease}
.bb-card:hover .wp-block-read-more::after{transform:translateX(.25rem)}
.bb-card .wp-block-read-more:hover,.bb-card .wp-block-read-more:focus{color:var(--wp--preset--color--kruste)}
@media(max-width:781px){.bb-stepbox .wp-block-post-template.is-flex-container.columns-3>li{flex-basis:100%}}

/* Mobil: etwas kompaktere Kapitel-Abstände */
@media(max-width:781px){
.bb-stepbox + .bb-stepbox{padding-top:1.5rem;margin-top:1.5rem}
}

/* Breite Einzelkarte (Schritt 5) */
.bb-card-wide{flex-direction:column;align-items:stretch}
.bb-card-wide .wp-block-post-featured-image{flex:none;max-width:none;margin:0}
.bb-card-wide .wp-block-post-featured-image,.bb-card-wide .wp-block-post-featured-image a{display:block;height:auto}
.bb-card-wide .wp-block-post-featured-image img{width:100%;height:auto;aspect-ratio:2.4/1;object-fit:cover}
.bb-card-wide__body{display:block;padding:1rem 1.3rem 1.2rem}
.bb-card-wide .wp-block-post-title{margin:0 0 .45rem}
.bb-card-wide .wp-block-post-excerpt{margin:0}
@media(max-width:781px){
.bb-card-wide{flex-direction:column}
.bb-card-wide .wp-block-post-featured-image{flex:none;max-width:none}
.bb-card-wide .wp-block-post-featured-image,.bb-card-wide .wp-block-post-featured-image a{height:auto}
.bb-card-wide .wp-block-post-featured-image img{height:auto;aspect-ratio:3/2}
.bb-card-wide__body{padding:0}
}

/* Kärtchen-Tiefe: Schatten + Hover-Lift (Inhaltskarte + Bildkachel) */
.bb-card,.bb-kachel{box-shadow:var(--bb-shadow-sm)}
.bb-card:hover .wp-block-post-featured-image img,.bb-card:focus-within .wp-block-post-featured-image img,.bb-kachel:hover .wp-block-post-featured-image img{transform:scale(1.06)}
@media(max-width:781px){.bb-kachel{box-shadow:none}}

.bb-card-wide .wp-block-post-featured-image img{object-position:center bottom}

/* ===== Hub 3: Probleme ===== */
/* Schnellfinder-Tabelle */
.bb-finder{width:100%;border-collapse:collapse;margin-top:1.5rem;font-family:Mulish,sans-serif;background:transparent}
.bb-finder th,.bb-finder td{text-align:left;padding:.9rem 1.25rem;border-bottom:1px solid rgba(43,38,34,.1);vertical-align:top}
.bb-finder thead th{background:transparent;color:var(--wp--preset--color--terrakotta);font-family:Fraunces,Georgia,serif;font-weight:600;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid rgba(190,90,46,.35)}
.bb-finder tbody td{color:var(--wp--preset--color--espresso)}
.bb-finder tbody tr:last-child td{border-bottom:0}
.bb-finder a{color:var(--wp--preset--color--terrakotta);font-weight:600;text-decoration:none}
.bb-finder a:hover{color:var(--wp--preset--color--kruste);text-decoration:underline}
@media(min-width:782px){.bb-finder th:first-child,.bb-finder td:first-child{padding-left:0}.bb-finder th:last-child,.bb-finder td:last-child{text-align:right;padding-right:0;white-space:nowrap}}
@media(max-width:781px){.bb-finder{box-shadow:none;background:transparent}.bb-finder thead{display:none}.bb-finder tbody,.bb-finder tr,.bb-finder td{display:block;width:100%}.bb-finder tr{background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);margin-bottom:1rem;padding:.5rem .25rem;box-shadow:var(--bb-shadow-sm)}.bb-finder td{border:0;padding:.35rem 1rem}.bb-finder td::before{content:attr(data-label);display:block;font-family:Fraunces,Georgia,serif;font-weight:600;color:var(--wp--preset--color--terrakotta);font-size:.8rem}}
/* Cluster-Ueberschrift */
.bb-clusterhead{font-family:Fraunces,Georgia,serif;font-weight:600;color:var(--wp--preset--color--espresso);font-size:1.3rem;line-height:1.2;margin:0 0 .25rem}
/* Router-Karten */
.bb-router{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-top:1.5rem}
.bb-router__card{display:block;background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:1.25rem 1.3rem;text-decoration:none;box-shadow:var(--bb-shadow-sm);transition:transform .15s ease,box-shadow .15s ease}
.bb-router__card:hover{transform:translateY(-0.125rem);box-shadow:var(--bb-shadow-md)}
.bb-router__title{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.2rem;color:var(--wp--preset--color--espresso);display:block;margin-bottom:.35rem}
.bb-router__text{font-family:Mulish,sans-serif;color:var(--wp--preset--color--espresso);font-size:.95rem;line-height:1.5;display:block}
.bb-router__card.is-soon{opacity:.6;cursor:default}
.bb-router__badge{display:inline-block;margin-top:.6rem;font-family:Mulish,sans-serif;font-size:.8rem;font-weight:700;color:var(--wp--preset--color--terrakotta)}
@media(max-width:781px){.bb-router{grid-template-columns:1fr}}
/* FAQ + Rettungs-Tipp */
.bb-faq{margin:1.5rem 0}
.bb-faq .wp-block-details{background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-md);box-shadow:var(--bb-shadow-sm);padding:0;margin-bottom:.75rem;overflow:hidden;transition:border-color .15s ease}
.bb-faq .wp-block-details[open]{border-color:var(--wp--preset--color--terrakotta)}
.bb-faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.2rem;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.1rem;line-height:1.3;color:var(--wp--preset--color--espresso);cursor:pointer;outline:none}
.bb-faq summary:focus-visible{box-shadow:inset 0 0 0 .125rem var(--wp--preset--color--terrakotta)}
.bb-faq summary::-webkit-details-marker{display:none}
.bb-faq summary::after{content:"+";flex:none;font-family:Mulish,sans-serif;font-weight:400;font-size:1.5rem;line-height:1;color:var(--wp--preset--color--terrakotta)}
.bb-faq .wp-block-details[open] summary::after{content:"\2013"}
.bb-faq .wp-block-details>*:not(summary){margin:0;padding:0 1.2rem 1.1rem}
.bb-faq .wp-block-details p{font-family:Mulish,sans-serif;color:var(--wp--preset--color--espresso);line-height:1.6;margin:0}
.bb-tip{background:var(--bb-petrol-tint);border-left:4px solid var(--wp--preset--color--petrol);border-radius:var(--bb-radius-md);padding:1.1rem 1.3rem;margin-top:1.5rem;font-family:Mulish,sans-serif;color:var(--wp--preset--color--espresso);line-height:1.6}
.bb-tip strong{font-family:Fraunces,Georgia,serif;color:var(--bb-petrol-dark)}

/* Schnellfinder: Feinschliff */
.bb-finder tbody td:first-child{font-weight:600;color:var(--wp--preset--color--espresso)}
.bb-finder tbody tr{transition:background .15s ease}
.bb-finder tbody tr:hover{background:rgba(190,90,46,.05)}
.bb-finder__btn{display:inline-block;padding:.35rem .9rem;border:1px solid var(--wp--preset--color--terrakotta);border-radius:var(--bb-radius-sm);color:var(--wp--preset--color--terrakotta);font-family:Mulish,sans-serif;font-size:.85rem;font-weight:700;text-decoration:none;white-space:nowrap;transition:background .15s ease,color .15s ease}
.bb-finder__btn:hover{background:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);text-decoration:none}
@media(min-width:782px){.bb-finder{table-layout:fixed}.bb-finder th:nth-child(1),.bb-finder td:nth-child(1){width:28%}.bb-finder th:nth-child(2),.bb-finder td:nth-child(2){width:26%}.bb-finder th:nth-child(3),.bb-finder td:nth-child(3){width:30%}.bb-finder th:nth-child(4),.bb-finder td:nth-child(4){width:16%}}

/* Schnellfinder: Mobil-Feinschliff */
@media(max-width:781px){
.bb-finder{font-size:1rem}
.bb-finder tr{padding:.85rem 1.1rem}
.bb-finder td{padding:.3rem 0;overflow-wrap:break-word;word-break:break-word}
.bb-finder td::before{font-size:.82rem;letter-spacing:.04em;margin-bottom:.15rem}
.bb-finder tbody td:first-child{font-size:1.05rem}
}

/* Schnellfinder: Mobil Overflow-Fix */
@media(max-width:781px){.bb-finder,.bb-finder tbody,.bb-finder tr,.bb-finder td{box-sizing:border-box;max-width:100%}}

/* (Exzerpt-Sichtbarkeit: .bb-card zeigt es; .bb-kachel versteckt es) */


/* ===== Header / Navigation ===== */
.bb-header{background:var(--wp--preset--color--creme);border-bottom:var(--bb-border)}
header.wp-block-template-part{position:sticky;position:-webkit-sticky;top:0;z-index:100}
/* Scroll-Anchoring aus: sonst schaukelt der schrumpfende Sticky-Header beim
   Zurueckscrollen auf — das wachsende Logo aendert die Flusshoehe, der Browser
   zieht scrollY um die Logo-Hoehe nach und ueberspringt damit die Shrink-Schwelle
   (Zappeln). Ohne Anchoring verschiebt sich der Inhalt einmal sanft ueber die
   0,3s-Transition. (Safari kennt kein Scroll-Anchoring -> dort wirkungslos.) */
html{overflow-anchor:none}
.bb-header__inner{max-width:var(--wp--style--global--wide-size);margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:0;padding:1.6rem 0 1rem;transition:padding .3s ease}
.bb-logo{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.5rem;color:var(--wp--preset--color--espresso);text-decoration:none;line-height:1;flex:0 0 auto;min-height:0;margin-bottom:.95rem;max-height:5.625rem;overflow:hidden;transition:max-height .3s ease,opacity .25s ease,margin .3s ease,transform .3s ease}
.bb-logo-img{display:block;height:3.25rem;width:auto;transition:height .3s ease}
@media(max-width:781px){.bb-logo-img{height:2.375rem}}
.bb-nav-toggle{position:absolute;left:-9999px}
.bb-burger{display:none}
.bb-menu{list-style:none;position:relative;display:flex;align-items:center;justify-content:center;gap:2.2rem;margin:0;padding:0;font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--l)}
.bb-header .bb-menu>li>a{color:var(--wp--preset--color--espresso)}
.bb-menu>li{position:relative}
.bb-menu a{color:var(--wp--preset--color--espresso);text-decoration:none}
.bb-menu>li>a{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem 0}
.bb-menu>li>a:hover{color:var(--wp--preset--color--terrakotta)}
.bb-caret{display:inline-block;width:0;height:0;font-size:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid currentColor;flex:0 0 auto}
.bb-mega{position:absolute;top:100%;left:0;padding-top:.9rem;background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:.7rem;box-shadow:var(--bb-shadow-lg);display:grid;grid-template-columns:1fr 1fr;gap:.7rem;width:41.25rem;opacity:0;visibility:hidden;transform:translateY(0.375rem);transition:opacity .15s ease,transform .15s ease;z-index:200}
.bb-has-sub:hover .bb-mega,.bb-has-sub:focus-within .bb-mega{opacity:1;visibility:visible;transform:translateY(0)}
.bb-mega--small{grid-template-columns:1fr;width:20.625rem}
/* Variante A: breites Dropdown rechtsbündig zur Navigation (Kante = CTA-Button) */
.bb-nav{position:relative;width:100%;border-top:var(--bb-border);padding-top:1rem}
.bb-menu>li:has(> .bb-mega:not(.bb-mega--small)){position:static}
@media(min-width:782px){
.bb-menu{justify-content:space-between;max-width:62.5rem;margin-inline:auto}
/* "Über uns": kleines Dropdown rechtsbündig zur Sektionskante (bb-nav = 67.5rem) abschließen */
.bb-menu>li:has(> .bb-mega--small){position:static}
.bb-mega--small{left:auto;right:0}
.bb-menu .bb-mega:not(.bb-mega--small){left:0;right:0;width:auto;transform:translateY(0.375rem)}
.bb-has-sub:hover .bb-mega:not(.bb-mega--small),.bb-has-sub:focus-within .bb-mega:not(.bb-mega--small){transform:translateY(0)}
.bb-header.bb-shrink .bb-logo{margin-bottom:.5rem}
.bb-header.bb-shrink .bb-logo-img{height:2.25rem}
.bb-header.bb-shrink .bb-nav{padding-top:.6rem}
.bb-header.bb-shrink .bb-header__inner{padding-top:.6rem;padding-bottom:.5rem}
}
.bb-mega__item{display:flex;gap:.7rem;align-items:flex-start;padding:.85rem 1rem;border-radius:var(--bb-radius-md);border:var(--bb-border);background:var(--bb-card-bg);text-decoration:none}
.bb-mega__item:hover{background:var(--bb-sand-tint)}
.bb-mega__item--wide{grid-column:span 2}
.bb-mega__ico{flex:0 0 auto;width:2.125rem;height:2.125rem;border-radius:50%;background:var(--bb-petrol-tint);color:var(--wp--preset--color--petrol);display:flex;align-items:center;justify-content:center}
.bb-mega__t{display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--m);color:var(--wp--preset--color--espresso);line-height:1.2}
.bb-mega__d{display:block;font-size:var(--wp--preset--font-size--s);color:var(--bb-text-muted);margin-top:.1rem}
.bb-mega__simple{display:block;padding:.6rem .8rem;border-radius:var(--bb-radius-sm);color:var(--wp--preset--color--espresso);font-family:Mulish,sans-serif}
.bb-mega__simple:hover{background:var(--bb-sand-tint);color:var(--wp--preset--color--terrakotta)}
/* === Button-System "Bine backt" (Klasse bb-btn) === */
.wp-block-button.bb-btn>.wp-block-button__link{font-family:Mulish,sans-serif;font-weight:700;line-height:1.2;font-size:var(--wp--preset--font-size--s);padding:.7em 1.6em;border:1.5px solid var(--wp--preset--color--terrakotta);border-radius:.85em;background-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);text-decoration:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.wp-block-button.bb-btn>.wp-block-button__link:hover,.wp-block-button.bb-btn>.wp-block-button__link:focus{background-color:var(--wp--preset--color--kruste);border-color:var(--wp--preset--color--kruste);color:var(--wp--preset--color--creme)}
.wp-block-button.bb-btn.bb-l>.wp-block-button__link{font-size:1.15rem}
.wp-block-button.bb-btn.bb-outline>.wp-block-button__link{background-color:transparent;color:var(--wp--preset--color--terrakotta)}
.wp-block-button.bb-btn.bb-outline>.wp-block-button__link:hover,.wp-block-button.bb-btn.bb-outline>.wp-block-button__link:focus{background-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme)}
@media(max-width:781px){
.bb-header__inner{position:relative;flex-direction:row;justify-content:space-between;align-items:center;padding:.85rem 1.5rem}
.bb-logo{margin-bottom:0}
.bb-nav{border-top:0;padding-top:0}
.bb-burger{display:flex;flex-direction:column;justify-content:center;gap:0.3125rem;width:2.625rem;height:2.625rem;cursor:pointer;flex:0 0 auto}
.bb-burger span{display:block;height:0.125rem;width:1.5rem;margin:0 auto;background:var(--wp--preset--color--espresso);border-radius:0.125rem;transition:transform .2s ease,opacity .2s ease}
.bb-nav-toggle:checked ~ .bb-burger span:nth-child(1){transform:translateY(0.4375rem) rotate(45deg)}
.bb-nav-toggle:checked ~ .bb-burger span:nth-child(2){opacity:0}
.bb-nav-toggle:checked ~ .bb-burger span:nth-child(3){transform:translateY(-0.4375rem) rotate(-45deg)}
.bb-nav{position:absolute;top:100%;left:0;right:0;background:var(--wp--preset--color--creme);border-bottom:var(--bb-border);max-height:0;overflow:hidden;transition:max-height .28s ease}
.bb-nav-toggle:checked ~ .bb-nav{max-height:85vh;overflow:auto}
.bb-menu{flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.5rem 1.5rem;font-size:1.05rem}
.bb-menu>li{position:static;border-bottom:.5px solid var(--wp--preset--color--sand)}
.bb-menu>li>a{padding:.9rem 0}
.bb-mega{position:static;opacity:1;visibility:visible;transform:none;display:block;width:auto;border:0;box-shadow:none;background:transparent;padding:0 0 .6rem;grid-template-columns:1fr}
.bb-mega--small{width:auto}
.bb-mega__item,.bb-mega__item--wide{border:0;background:transparent;padding:.5rem 0 .5rem .4rem;grid-column:auto}
.bb-mega__item:hover{background:transparent}
.bb-mega__simple{padding:.5rem 0 .5rem .4rem}
.bb-caret{display:none}
}

@media(max-width:781px){.bb-menu>li:not(.bb-cta-li)>a{font-family:Fraunces,Georgia,serif;font-size:1.2rem;font-weight:600;color:var(--wp--preset--color--espresso);text-transform:none;letter-spacing:normal}}

/* Header: Abstand zur ersten Sektion + Admin-Bar-Offset */
.wp-site-blocks > main{margin-top:clamp(1.5rem, 4vw, 2.5rem) !important}
.admin-bar header.wp-block-template-part{top:32px}
@media screen and (max-width:782px){.admin-bar header.wp-block-template-part{top:46px}}

/* Nav: Klick-Rahmen entfernen, dezenter Hover-Unterstrich */
.bb-menu a:focus,.bb-mega a:focus,.bb-logo:focus{outline:none}
.bb-menu a:focus-visible,.bb-mega a:focus-visible,.bb-logo:focus-visible{outline:none;text-decoration:underline;text-decoration-color:var(--wp--preset--color--terrakotta);text-decoration-thickness:0.125rem;text-underline-offset:0.3125rem}
.bb-menu>li:not(.bb-cta-li)>a{font-family:Fraunces,Georgia,serif;font-weight:600;text-transform:uppercase;letter-spacing:.14em;font-size:.85rem;background-image:linear-gradient(var(--wp--preset--color--terrakotta),var(--wp--preset--color--terrakotta));background-repeat:no-repeat;background-position:left bottom;background-size:0% 0.125rem;transition:background-size .2s ease,color .15s ease}
.bb-menu>li:not(.bb-cta-li)>a:hover{background-size:100% 0.125rem;color:var(--wp--preset--color--terrakotta)}
/* Aktiver Menüpunkt ("du bist hier") – persistenter Petrol-Unterstrich */
.bb-menu>li.bb-current:not(.bb-cta-li)>a{background-image:linear-gradient(var(--wp--preset--color--petrol),var(--wp--preset--color--petrol));background-repeat:no-repeat;background-position:left bottom;background-size:100% 0.125rem}

/* Ueber-Bine Zickzack */
.bb-zz{margin-top:clamp(2.5rem,6vw,4rem);margin-bottom:clamp(2.5rem,6vw,4rem)}
.bb-zz .wp-block-image{text-align:center;margin:0}
.bb-zz .wp-block-image img{width:clamp(12.5rem, 26vw, 20rem);max-width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:50%;box-shadow:var(--bb-shadow-panel)}
@media(min-width:782px){.bb-zz.bb-zz--rev{flex-direction:row-reverse}}

/* Ueber-Bine Bildspalte zentriert */
@media(min-width:782px){.bb-zz .wp-block-column:first-child{display:flex;flex-direction:column;align-items:center;justify-content:center}}
.bb-zz .wp-block-image{margin:0 auto;text-align:center}

/* Robert-Seite */
.bb-rt .wp-block-image{margin:0}
.bb-rt .wp-block-image img{border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-panel)}
@media(min-width:782px){.bb-rt .wp-block-column:first-child{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;align-self:flex-start}}

/* Robert O-Ton */
.bb-saysmark{display:block;text-align:center;font-family:Fraunces,Georgia,serif;font-size:clamp(3rem,8vw,5rem);line-height:.5;color:var(--wp--preset--color--terrakotta);margin-bottom:.3rem}
.bb-quote__bubble{background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-lg);padding:1.3rem 1.6rem;box-shadow:var(--bb-shadow-panel)}
.bb-quote__bubble::before{content:"\201E";display:block;font-family:Fraunces,Georgia,serif;font-size:2.8rem;line-height:.7;color:var(--wp--preset--color--terrakotta);margin-bottom:.2rem}
.bb-quote__kicker{margin-top:0;color:var(--wp--preset--color--espresso)}

/* Startseite + Desktop: Abstand ZWISCHEN den Sektionen (11.07. halbiert)
   (greift nur zwischen benachbarten Panels – erste/letzte Kante bleibt unberührt) */
@media(min-width:782px){
.home .bb-panel + .bb-panel{margin-top:clamp(1.75rem,3vw,2.75rem)}
}

/* Mobile: Buttons in "Wo stehst du gerade?" so groß wie der Karten-Teasertext */
@media(max-width:781px){
.bb-wegweiser .wp-block-button.bb-btn>.wp-block-button__link{font-size:clamp(1rem, 0.95rem + 0.25vw, 1.1rem)}
}

/* ===== Brotback-Lexikon: Suche + A–Z-Register ===== */
.bb-lexikon{box-sizing:border-box;padding:clamp(1.25rem,4vw,2.25rem)}
.bb-lex-search{margin:0 0 1.25rem}
.bb-lex-search__input{box-sizing:border-box;width:100%;min-height:3rem;padding:.75rem 1.1rem;border:var(--bb-border);border-radius:var(--bb-radius-sm);background:var(--bb-surface);color:var(--wp--preset--color--espresso);font-family:Mulish,sans-serif;font-size:1rem}
.bb-lex-search__input::placeholder{color:var(--bb-text-placeholder)}
.bb-lex-search__input:focus{outline:none;border-color:var(--wp--preset--color--terrakotta);box-shadow:0 0 0 .125rem rgba(190,90,46,.2)}
.bb-lex-az{display:flex;flex-wrap:wrap;gap:.4rem;margin:0 0 1.75rem}
.bb-lex-az__letter{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:.95rem;line-height:1;min-width:2.1rem;padding:.5rem .55rem;text-align:center;border:var(--bb-border);border-radius:var(--bb-radius-sm);background:var(--bb-card-bg);color:var(--wp--preset--color--espresso);cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
.bb-lex-az button:hover{background:var(--wp--preset--color--terrakotta);border-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme)}
.bb-lex-az__letter.is-empty{opacity:.3;cursor:default;background:transparent;border-color:transparent}
/* Scroll-Ziel: Sticky-Header-Höhe ausgleichen */
.bb-lex-group{margin:0 0 1.75rem;scroll-margin-top:clamp(4.5rem,9vh,6rem)}
.admin-bar .bb-lex-group{scroll-margin-top:clamp(6.5rem,9vh,8rem)}
.bb-lex-group:last-child{margin-bottom:0}
/* Luft über jeder Buchstaben-Gruppe (außer der ersten) */
.bb-lex-group + .bb-lex-group{margin-top:clamp(2.5rem,6vw,3.5rem)}
.bb-lex-group__head{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.5rem;color:var(--wp--preset--color--terrakotta);margin:0 0 .85rem;padding-bottom:.35rem;border-bottom:1px solid rgba(190,90,46,.3)}
.bb-lex-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.bb-lex-item{display:flex}
.bb-lex-item__link{display:block;height:auto;width:100%;background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:.95rem 1.1rem;text-decoration:none;box-shadow:var(--bb-shadow-sm);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.bb-lex-item__link:hover,.bb-lex-item__link:focus{transform:translateY(-.125rem);box-shadow:var(--bb-shadow-md);border-color:var(--bb-border-hover);outline:none}
.bb-lex-item__term{display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.1rem;color:var(--wp--preset--color--espresso);margin-bottom:.25rem}
.bb-lex-item__link:hover .bb-lex-item__term,.bb-lex-item__link:focus .bb-lex-item__term{color:var(--wp--preset--color--terrakotta)}
.bb-lex-item__teaser{display:block;font-family:Mulish,sans-serif;font-size:.9rem;line-height:1.5;color:var(--bb-text-muted)}
.bb-lex-empty{font-family:Mulish,sans-serif;color:var(--bb-text-muted);text-align:center;padding:1.5rem 0;margin:0}
@media(max-width:781px){
.bb-lex-list{grid-template-columns:1fr}
.bb-lex-az__letter{min-width:1.9rem;padding:.45rem .5rem;font-size:.9rem}
}

/* ===== Lexikon-Einzelseite (ACF: Verwandte Begriffe) ===== */
.bb-lex-related{margin-top:2.5rem;padding-top:1.5rem;border-top:var(--bb-border)}
.bb-lex-related__head{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.3rem;color:var(--wp--preset--color--espresso);margin:0 0 .85rem}
.bb-lex-related__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
.bb-lex-related__link{display:inline-block;padding:.4rem .9rem;border:var(--bb-border);border-radius:var(--bb-radius-sm);background:var(--bb-surface);color:var(--wp--preset--color--kruste);font-family:Mulish,sans-serif;font-size:.95rem;font-weight:600;text-decoration:none;transition:background .15s ease,color .15s ease,border-color .15s ease}
.bb-lex-related__link:hover,.bb-lex-related__link:focus{background:var(--wp--preset--color--terrakotta);border-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);outline:none}

/* ===================================================================
 * Fachartikel-Einzelseite (single-fachartikel.html)
 * =================================================================== */

/* --- Hero: Panel mit Hintergrund; Bild links, Text rechts (Desktop), gestapelt (Mobile) --- */
.bb-article-hero{padding:var(--bb-section-pad-y) var(--bb-section-pad-x)}
.bb-article-hero__cols{gap:clamp(1.5rem,4vw,3rem)!important;align-items:center;margin-bottom:0!important}
.bb-article-hero__img img{width:100%;height:auto;object-fit:cover;aspect-ratio:3/2;border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm)}
.bb-article-hero__title{font-family:Fraunces,Georgia,serif;font-size:var(--wp--preset--font-size--xxl);line-height:1.15;color:var(--wp--preset--color--espresso);margin:0 0 1.1rem}
.bb-article-hero__lead{color:var(--wp--preset--color--terrakotta);font-size:var(--wp--preset--font-size--m);line-height:1.6;margin:1.25rem 0 0}
.bb-article-hero__lead p,.bb-article-hero__lead .wp-block-post-excerpt__excerpt{margin:0}

/* Eyebrow-Pill: Themenwelt, verlinkt auf die Hub-Seite */
.bb-eyebrow{display:inline-block;font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;line-height:1;color:var(--wp--preset--color--espresso);background:var(--wp--preset--color--sand);padding:.5rem .85rem;border-radius:var(--bb-radius-sm);text-decoration:none;transition:background .15s ease,color .15s ease}
.bb-eyebrow:hover,.bb-eyebrow:focus{background:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);outline:none}
/* Rezept-Hero: Bild kompakter (5:4, fast quadratisch) – balanciert 2–3-zeilige Titel im Desktop-Zweispalter; mobil gestapelt bleibt 3:2 */
@media(min-width:782px){.bb-article-hero--rezept .bb-article-hero__img img{aspect-ratio:5/4}}
/* Rezept-Hero: Eyebrow als Kicker ÜBER dem Titel */
.bb-article-hero--rezept .bb-eyebrow{margin:0 0 .85rem}
/* Rezept-Triebmittel-Pille in Petrol (Hero + Übersichtskarten); Fachartikel-Themenwelt-Pillen bleiben sand */
.bb-article-hero--rezept .bb-eyebrow,.bb-card .bb-eyebrow{background:var(--wp--preset--color--petrol);color:var(--wp--preset--color--creme)}

/* === Rezept-Seite: Quick-Facts-Band + WPRM-Karte === */
/* Quick-Facts (Gesamtzeit · Schwierigkeit · Menge) direkt unter dem Hero */
.bb-rezept-facts{box-sizing:border-box;display:flex;flex-wrap:wrap;justify-content:center;max-width:var(--wp--style--global--wide-size);margin:0 auto;padding:1rem 1.25rem;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-md);box-shadow:var(--bb-shadow-sm)}
.bb-fact{position:relative;flex:1 1 0;min-width:8rem;display:flex;flex-direction:column;align-items:center;gap:.3rem;padding:.4rem 1.5rem;text-align:center}
.bb-fact+.bb-fact::before{content:"";position:absolute;left:0;top:.2rem;bottom:.2rem;width:1px;background:var(--wp--preset--color--sand)}
.bb-fact__label{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bb-text-muted)}
.bb-fact__value{font-family:Fraunces,Georgia,serif;font-size:var(--wp--preset--font-size--l);line-height:1.2;color:var(--wp--preset--color--espresso)}
@media(max-width:781px){
.bb-rezept-facts{margin-left:calc(var(--bb-gutter-mobile) - var(--wp--style--root--padding-left));margin-right:calc(var(--bb-gutter-mobile) - var(--wp--style--root--padding-left));padding:.85rem 1rem}
.bb-fact{padding:.4rem .75rem;min-width:6rem}
.bb-fact__value{font-size:var(--wp--preset--font-size--m)}
}
/* WPRM-Rezeptkarte ins Karten-System: Radius/Schatten/Rahmen aus unseren Tokens,
   Fraunces für die Überschriften. Die Farben liefert das WPRM-Template "Oktober". */
.bb-article-body .wprm-recipe-container{margin:2.5rem 0}
.bb-article-body .wprm-recipe{border:var(--bb-border)!important;border-radius:var(--bb-radius-lg)!important;box-shadow:var(--bb-shadow-sm)!important;overflow:hidden}
.wprm-recipe-name,.wprm-recipe [class*="-header"],.wprm-recipe-roundup-name,.wprm-recipe h2,.wprm-recipe h3,.wprm-recipe h4{font-family:Fraunces,Georgia,serif!important}
/* Hero-Button „Zum Rezept springen" */
.bb-rezept-jump{margin:1.4rem 0 0}
/* Zeitplan-Karten (Backplan-Vergleich, z. B. Klassisch vs. Lang) */
.bine-zeitplan-karten{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--bb-grid-gap);margin:2.25rem 0}
.bine-zeitplan-karte{background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm);padding:1.4rem 1.5rem}
.bine-zeitplan-karte--empfehlung{border-color:var(--wp--preset--color--terrakotta);box-shadow:var(--bb-shadow-md)}
.bine-zeitplan-karte__header{display:flex;flex-direction:column;justify-content:flex-end;gap:.75rem;min-height:4.25rem;margin-bottom:1rem;padding-bottom:.9rem;border-bottom:1px solid var(--bb-border-hover)}
@media(max-width:781px){.bine-zeitplan-karte__header{min-height:0}}
.bine-zeitplan-karte__badge{align-self:flex-start;font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;line-height:1;color:var(--wp--preset--color--creme);background:var(--wp--preset--color--terrakotta);padding:.4rem .7rem;border-radius:var(--bb-radius-sm)}
.bine-zeitplan-karte__title{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--xl);line-height:1.2;color:var(--wp--preset--color--espresso);margin:0}
.bine-zeitplan-karte__label{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bb-text-muted);margin:.9rem 0 .25rem}
.bine-zeitplan-karte__body>.bine-zeitplan-karte__label:first-child{margin-top:0}
.bine-zeitplan-karte__text{font-family:Mulish,sans-serif;font-size:1rem;line-height:1.6;color:var(--wp--preset--color--espresso);margin:0}
@media(max-width:781px){.bine-zeitplan-karten{grid-template-columns:1fr;gap:1rem}}
/* Rezept-Zutaten (Baustein .rezept-zutaten): Titel + schlanke Mengen-Liste.
   Überschreibt gezielt die wuchtige Artikel-Tabellen-Karten-Optik – Desktop wie Mobile. */
.rezept-zutaten{margin:2rem 0}
.zutaten-titel{display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);line-height:1.25;color:var(--wp--preset--color--espresso);margin:0 0 .75rem;padding-bottom:.5rem;border-bottom:1px solid var(--bb-border-hover)}
.rezept-zutaten .zutaten-tabelle,.rezept-zutaten .zutaten-tabelle.has-fixed-layout{display:table;width:100%;table-layout:auto;margin:0;background:transparent;border:0;border-radius:0;box-shadow:none;overflow:visible;font-size:1rem}
.rezept-zutaten .zutaten-tabelle tbody{display:table-row-group}
.rezept-zutaten .zutaten-tabelle tr{display:table-row;background:transparent;border:0;border-radius:0;box-shadow:none;margin:0;padding:0}
.rezept-zutaten .zutaten-tabelle td{display:table-cell;padding:.5rem .25rem;border:0;border-bottom:1px solid var(--bb-hairline);font-family:Mulish,sans-serif;font-weight:400;font-size:1rem;line-height:1.5;color:var(--wp--preset--color--espresso);vertical-align:baseline}
.rezept-zutaten .zutaten-tabelle td.zutat{background:transparent!important;font-family:Mulish,sans-serif;font-weight:400;font-size:1rem;color:var(--wp--preset--color--espresso);margin:0}
.rezept-zutaten .zutaten-tabelle td.menge{text-align:right;white-space:nowrap;color:var(--bb-text-muted);font-variant-numeric:tabular-nums;width:1%;padding-left:1rem}
.rezept-zutaten .zutaten-tabelle tr:nth-child(even) td,.rezept-zutaten .zutaten-tabelle tr:hover td{background:transparent}
.rezept-zutaten .zutaten-tabelle td::before{display:none!important}
.rezept-zutaten .zutaten-tabelle tr:last-child td{border-bottom:0}
.rezept-zutaten .zutaten-tabelle tr.zwischensumme td{border-top:1px solid var(--bb-border-hover);border-bottom:0;padding-top:.6rem;font-weight:600;color:var(--wp--preset--color--kruste)}
/* Shop-the-Look (Affiliate-Produkte) – Karten-Grid */
.bine-shop-look{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--bb-grid-gap);margin:1.75rem 0}
.bine-shop-look__item{margin:0;display:flex;flex-direction:column;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm);overflow:hidden}
.bine-shop-look__item>a{display:block}
.bine-shop-look__item img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;background:var(--bb-sand-tint)}
.bine-shop-look__caption{padding:.9rem 1.1rem 1.1rem;font-family:Mulish,sans-serif;font-size:.95rem;line-height:1.55;color:var(--bb-text-muted)}
.bine-shop-look__caption a{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.05rem;color:var(--wp--preset--color--kruste);text-decoration:none}
.bine-shop-look__caption a:hover{text-decoration:underline}
.bine-shop-look__hinweis{font-size:.95rem;color:var(--bb-text-muted);margin:.6rem 0 0}
.bine-affiliate-disclaimer{margin:1.25rem 0 0;padding:1rem 1.25rem;background:var(--bb-sand-tint);border-radius:var(--bb-radius-md);font-size:.85rem;line-height:1.55;color:var(--bb-text-muted)}
@media(max-width:781px){.bine-shop-look{grid-template-columns:1fr;gap:1rem}}
/* Zeitfenster-Box „Der Teig richtet sich nach dir" (Marken-Leitsatz) */
.bine-zeitfenster-box{background:var(--bb-sand-tint);border:var(--bb-border);border-left:4px solid var(--wp--preset--color--terrakotta);border-radius:var(--bb-radius-lg);padding:1.4rem 1.6rem;margin:2.25rem 0}
.bine-zeitfenster-box__title{display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);line-height:1.25;color:var(--wp--preset--color--espresso);margin:0 0 .6rem}
.bine-zeitfenster-box p{font-family:Mulish,sans-serif;font-size:1rem;line-height:1.6;color:var(--wp--preset--color--espresso);margin:.5rem 0 0}
.bine-zeitfenster-box em{font-style:normal;font-weight:600;color:var(--wp--preset--color--kruste)}
/* Brot-Dreieck-Etikett (Triebkraft · Zeit · Temperatur) */
.bb-brot-dreieck{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.5rem 0}
.bb-brot-dreieck__item{flex:1 1 0;min-width:8rem;display:flex;flex-direction:column;gap:.3rem;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:.85rem 1.1rem}
.bb-brot-dreieck__label{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--bb-text-muted)}
.bb-brot-dreieck__value{font-family:Fraunces,Georgia,serif;font-size:var(--wp--preset--font-size--l);line-height:1.1;color:var(--wp--preset--color--espresso)}
@media(max-width:781px){.bb-brot-dreieck{gap:.5rem}.bb-brot-dreieck__item{min-width:6rem}}
/* Brot-Dreieck im Hero: kompakter, unter dem Titel */
.bb-brot-dreieck--hero{margin:0;gap:.5rem}
.bb-brot-dreieck--hero .bb-brot-dreieck__item{min-width:0;padding:.55rem .8rem}
.bb-brot-dreieck--hero .bb-brot-dreieck__label{font-size:.62rem}
.bb-brot-dreieck--hero .bb-brot-dreieck__value{font-size:.95rem}
/* Mobil: Chips stapeln (Label links / Wert rechts), kein Umbruch bei „Temperatur" */
@media(max-width:781px){
.bb-brot-dreieck--hero{flex-direction:column;gap:.4rem}
.bb-brot-dreieck--hero .bb-brot-dreieck__item{flex-direction:row;align-items:baseline;justify-content:space-between;gap:.75rem;padding:.5rem .85rem}
.bb-brot-dreieck--hero .bb-brot-dreieck__label{white-space:nowrap}
}

/* --- Inhaltsverzeichnis (auto aus den H2) --- */
.bb-toc{box-sizing:border-box;background:var(--bb-sand-tint);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:1rem 1.25rem;margin:1.75rem 0 2.25rem}
/* TOC-Platzierung: eigene, zugeklappte Box zwischen Hero und Textbox – Desktop wie Mobile */
.bb-toc--inline{display:none}
.bb-toc--top{display:block;max-width:var(--wp--style--global--wide-size);margin-left:auto;margin-right:auto}
@media(max-width:781px){
.bb-toc--top{max-width:none;margin:0 calc(1rem - var(--wp--style--root--padding-left)) 1.5rem}
}
.bb-toc__title{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;cursor:pointer;list-style:none;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);color:var(--wp--preset--color--espresso);outline:none}
.bb-toc__title:focus-visible{box-shadow:inset 0 0 0 .125rem var(--wp--preset--color--terrakotta)}
.bb-toc__title::-webkit-details-marker{display:none}
.bb-toc__label{position:relative;padding-right:1.4rem}
.bb-toc__label::after{content:"";position:absolute;right:0;top:.2em;width:.55rem;height:.55rem;border-right:.14rem solid var(--wp--preset--color--terrakotta);border-bottom:.14rem solid var(--wp--preset--color--terrakotta);transform:rotate(45deg);transition:transform .2s ease}
.bb-toc[open] .bb-toc__label::after{transform:rotate(-135deg)}
.bb-toc__meta{font-family:Mulish,sans-serif;font-size:.85rem;font-weight:400;color:var(--bb-text-muted);white-space:nowrap}
.bb-toc__list{list-style:none;margin:1rem 0 .25rem;padding:0;display:grid;gap:.55rem}
.bb-toc__item a{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--m);line-height:1.45;color:var(--wp--preset--color--petrol);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .15s ease}
.bb-toc__item a:hover,.bb-toc__item a:focus{border-bottom-color:currentColor;outline:none}
/* Sprungziel: etwas Luft über der angesprungenen Überschrift */
.bb-article-body h2[id],.entry-content h2[id],.wp-block-post-content h2[id]{scroll-margin-top:clamp(1.5rem,4vh,2.5rem)}

/* --- Autoren-Box --- */
.bb-authorbox{gap:clamp(1.25rem,3vw,2rem)!important;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-panel);padding:clamp(1.25rem,3vw,2rem);margin-block:clamp(2.25rem,5vw,3.25rem)}
.bb-authorbox__photo{flex:none;margin:0}
.bb-authorbox__photo img{width:7.5rem;height:7.5rem;border-radius:50%;object-fit:cover;display:block}
.bb-authorbox__body{flex:1}
.bb-authorbox__kicker{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--wp--preset--color--terrakotta);margin:0 0 .25rem}
.bb-authorbox__name{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);color:var(--wp--preset--color--espresso);margin:0 0 .5rem}
.bb-authorbox__text{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--m);line-height:1.6;color:var(--wp--preset--color--espresso);margin:0 0 .6rem}
.bb-authorbox__link{margin:0}
.bb-authorbox__link a{font-family:Mulish,sans-serif;font-weight:600;color:var(--wp--preset--color--kruste);text-decoration:none}
.bb-authorbox__link a:hover,.bb-authorbox__link a:focus{color:var(--wp--preset--color--terrakotta)}

/* --- Verwandte Beiträge (bb-card-Optik) --- */
.bb-related{margin-block:clamp(2.25rem,5vw,3.25rem)}
.bb-related__head{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--xl);color:var(--wp--preset--color--espresso);margin:0 0 1.25rem}
.bb-related__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--bb-grid-gap)}

/* --- Mobile --- */
@media(max-width:781px){
.bb-article-hero{padding:1.5rem}
.bb-authorbox{flex-direction:column;text-align:center}
.bb-authorbox__kicker{margin-top:.25rem}
.bb-related__grid{grid-template-columns:1fr 1fr;gap:1rem}
}
@media(max-width:480px){
.bb-related__grid{grid-template-columns:1fr}
}

/* --- Artikel-Textbox: weißer Lesebereich --- */
/* WP legt via .has-global-padding sein Root-Padding (clamp(30px,5vw,50px)) auf
   die Box UND den post-content darin. Wir übernehmen die Padding-Hoheit
   deterministisch (höhere Spezifität als .has-global-padding): die Box steuert
   den Abstand, das innere post-content-Padding wird genullt – eine Quelle. */
.bb-article-body{background:var(--bb-surface)}
/* Einheitliche Lesebreite aller Artikel-Posts (Rezept + Fachartikel): 860px = 53.75rem.
   !important schlägt die generierte .alignwide-Layoutregel (wie Hero/mobile bb-panel). */
.bb-article-body{max-width:53.75rem!important}
.bb-article-body.has-global-padding{padding-block:var(--bb-section-pad-y);padding-inline:var(--bb-section-pad-x)}
.bb-article-body .wp-block-post-content.has-global-padding{padding-inline:0}
/* Inhalte bleiben in der Box (kein Ausbruch/negative Margins über alignwide/alignfull) */
.bb-article-body .wp-block-post-content>.alignwide,.bb-article-body .wp-block-post-content>.alignfull{max-width:100%;margin-inline:0}

/* ===================================================================
 * Inhalts-Bausteine (aus dem Beitragstext) – Struktur aus dem früheren
 * „Warm Editorial"-Snippet-Set (Fluent Snippets inaktiv), Optik aber auf
 * die neue Marke gebracht. Infoboxen = Variante A (Chip + Eyebrow).
 * =================================================================== */

/* --- Infoboxen (Variante A): warmer Icon-Chip + Eyebrow-Label + Fraunces-Titel.
   Label & Icon werden je Typ-Klasse per CSS erzeugt – kein Eingriff in den Beitrag.
   Setzt die Struktur .infobox > .infobox-content voraus. --- */
.infobox:not(.infobox-weiterlesen){display:block;background:var(--bb-card-bg);border:0;border-left:3px solid var(--wp--preset--color--sand);border-radius:0;padding:1rem 1.35rem;margin:1.6em 0}
.infobox .infobox-content{min-width:0}
.infobox .infobox-content::before{display:block;font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;margin:0 0 .25rem;line-height:1}
.infobox .infobox-titel{display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);line-height:1.26;color:var(--wp--preset--color--espresso);margin:0 0 .35rem;padding:0;border:0}
.infobox p{margin:0 0 .5em;color:var(--wp--preset--color--espresso)}
.infobox p:last-child{margin-bottom:0}
.infobox :is(ul,ol){margin:.4em 0 0;color:var(--wp--preset--color--espresso)}
.infobox a{color:var(--wp--preset--color--terrakotta);text-decoration:underline}
.infobox a:hover,.infobox a:focus{color:var(--wp--preset--color--kruste)}
.infobox .infobox-footer{margin-top:.8em;padding-top:.6em;border-top:1px solid var(--bb-border-hover);font-size:.88em;color:var(--bb-text-muted);font-style:italic}
/* Markenwarme Tönung pro Typ – hebt die Box klar von der weißen Textbox ab */
.infobox.infobox-tipp{background:var(--bb-tipp-wash);border-left-color:var(--bb-tipp-edge)}
.infobox.infobox-info{background:var(--bb-info-wash);border-left-color:var(--bb-info-edge)}
.infobox.infobox-hinweis{background:var(--bb-hinweis-wash);border-left-color:var(--bb-hinweis-edge)}
.infobox.infobox-robert{background:var(--wp--preset--color--creme);border:1px solid var(--bb-border-hover);border-radius:var(--bb-radius-lg)}
/* Mein Tipp – Petrol */
.infobox-tipp .infobox-content::before{content:"Mein Tipp";color:var(--bb-tipp-ink)}
.infobox-tipp .infobox-titel{color:var(--bb-tipp-ink)}
/* Gut zu wissen – neutraler Espresso/Sand-Ton (kein Blau) */
.infobox-info .infobox-content::before{content:"Gut zu wissen";color:var(--bb-info-ink)}
.infobox-info .infobox-titel{color:var(--bb-info-ink)}
/* Achtung – Terrakotta/Kruste */
.infobox-hinweis .infobox-content::before{content:"Achtung";color:var(--bb-hinweis-ink)}
.infobox-hinweis .infobox-titel{color:var(--bb-hinweis-ink)}
/* Von Robert – Pflaume, Person */
.infobox-robert::before{background-color:var(--wp--preset--color--kruste);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20c0-3.6 3.1-6 7-6s7 2.4 7 6'/%3E%3C/svg%3E")}
.infobox-robert .infobox-content::before{content:"Von Robert";color:var(--wp--preset--color--kruste)}
.infobox-robert .infobox-footer{border-top-color:var(--wp--preset--color--sand)}
/* Nur EINE Überschrift: Eyebrow ausblenden, wo ein Titel vorhanden ist */
.infobox:not(.infobox-weiterlesen) .infobox-content:has(.infobox-titel)::before{content:none!important}
/* Mobile: gleiche schlichte Behandlung, nur etwas kompakteres Padding */
@media(max-width:781px){
.infobox:not(.infobox-weiterlesen){padding:.95rem 1.2rem;margin:1.3em 0}
}
/* === Robert-Box: freigestellte Figur links, Text umfliesst sie (Desktop + Mobil) === */
.infobox.infobox-robert{display:block}
.infobox.infobox-robert::before{content:"";float:left;width:7.5rem;height:11.25rem;margin:.15rem 1.25rem .35rem 0;border-radius:0;background:url("assets/robert.webp?v=4") no-repeat top center/contain}
.infobox.infobox-robert .infobox-titel{font-style:italic}
.infobox.infobox-robert .infobox-titel::after{content:":"}
.infobox.infobox-robert .infobox-footer{clear:both}
@media(max-width:781px){
.infobox.infobox-robert::before{width:4.75rem;height:7.125rem;margin:.1rem .85rem .3rem 0}
.infobox.infobox-robert .infobox-titel{padding-left:0!important}
}

/* --- „Weiterlesen"-Box (interne Verlinkungen) --- */
.infobox-weiterlesen{background:var(--bb-sand-tint);border:0;border-radius:var(--bb-radius-md);padding:1.75rem 2rem;margin:2.5rem 0}
.infobox-weiterlesen .infobox-titel{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(1.25rem,2vw + .3rem,1.5rem);color:var(--wp--preset--color--espresso);border:0;padding:0;margin:0 0 .3rem}
.infobox-weiterlesen .weiterlesen-liste{list-style:none!important;padding-left:0!important;margin:.5rem 0 0!important}
.infobox-weiterlesen .weiterlesen-liste li{display:block!important;padding:.85rem 0;border-bottom:1px solid var(--bb-hairline);list-style:none!important}
.infobox-weiterlesen .weiterlesen-liste li::before{content:none!important}
.infobox-weiterlesen .weiterlesen-liste li:last-child{border-bottom:none;padding-bottom:0}
.infobox-weiterlesen .weiterlesen-link{display:block!important;font-weight:700;font-size:clamp(.95rem,.85rem + .3vw,1.05rem);color:var(--wp--preset--color--terrakotta);text-decoration:none;line-height:1.3;margin-bottom:.3rem}
.infobox-weiterlesen .weiterlesen-link:hover,.infobox-weiterlesen .weiterlesen-link:focus{color:var(--wp--preset--color--espresso)}
.infobox-weiterlesen .weiterlesen-teaser{display:block!important;font-size:.9rem;color:var(--bb-text-muted);line-height:1.55}
@media(max-width:600px){.infobox-weiterlesen{padding:1.25rem;margin:2rem 0}.infobox-weiterlesen .weiterlesen-teaser{font-size:.85rem}}

/* --- "Weiterlesen"-Kachel, luftig/modern (helle Fläche, Petrol-Akzent) --- */
.bb-weiterlesen{background:var(--bb-surface);border:1px solid var(--bb-hairline);border-top:3px solid var(--wp--preset--color--petrol);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm);padding:1.75rem 2rem;margin:2.5rem 0}
.bb-weiterlesen__kicker{display:block;font-family:Mulish,sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--wp--preset--color--petrol);margin:0 0 .2rem}
.bb-weiterlesen__titel{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(1.25rem,2vw + .3rem,1.5rem);color:var(--wp--preset--color--espresso);margin:0 0 .75rem;padding:0}
.bb-weiterlesen__liste{list-style:none!important;padding-left:0!important;margin:0!important}
.bb-weiterlesen__liste li{padding:.85rem 0;margin:0;border-bottom:1px solid var(--bb-hairline);list-style:none!important}
.bb-weiterlesen__liste li::before{content:none!important}
.bb-weiterlesen__liste li:first-child{padding-top:0}
.bb-weiterlesen__liste li:last-child{border-bottom:0;padding-bottom:0}
.bb-weiterlesen__link{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(1rem,.9rem + .3vw,1.1rem);color:var(--wp--preset--color--espresso);text-decoration:none;line-height:1.3}
.bb-weiterlesen__link::after{content:"\2192";margin-left:.4rem;color:var(--wp--preset--color--petrol);display:inline-block;transition:transform .2s ease}
.bb-weiterlesen__link:hover,.bb-weiterlesen__link:focus{color:var(--wp--preset--color--petrol)}
.bb-weiterlesen__link:hover::after,.bb-weiterlesen__link:focus::after{transform:translateX(.25rem)}
.bb-weiterlesen__teaser{display:block;font-family:Mulish,sans-serif;font-size:.92rem;color:var(--bb-text-muted);line-height:1.55;margin-top:.15rem}
@media(max-width:600px){.bb-weiterlesen{padding:1.25rem;margin:2rem 0}}

/* --- Backlink zur Themenwelt am Artikelende (luftige Petrol-Pille) --- */
.bb-themenwelt-back{display:inline-flex;align-items:center;gap:.5rem;margin:2.5rem 0 0;padding:.6rem 1.15rem;background:var(--bb-petrol-tint);border-radius:999px;font-family:Mulish,sans-serif;font-weight:700;font-size:.92rem;color:var(--bb-petrol-dark);text-decoration:none;transition:background .2s ease}
.bb-themenwelt-back::after{content:"\2192";font-weight:700;transition:transform .2s ease;display:inline-block}
.bb-themenwelt-back:hover,.bb-themenwelt-back:focus{background:#CFE0DE}
.bb-themenwelt-back:hover::after,.bb-themenwelt-back:focus::after{transform:translateX(.2rem)}

/* --- Tabellen im Artikeltext: soft modern (Container, Sand-Kopf, Zebra) --- */
/* Einheitlicher Stil für ALLE Artikel-Tabellen (auch .bine-tabelle); mobil als Karten-Stack. */
.bb-article-body table,.bb-article-body table.has-fixed-layout{width:100%;table-layout:auto;border-collapse:separate;border-spacing:0;font-size:clamp(.9rem,.85rem + .25vw,1rem);margin:1.75rem 0;background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);overflow:hidden;box-shadow:var(--bb-shadow-sm)}
.bb-article-body table thead th{background:var(--wp--preset--color--petrol);color:var(--wp--preset--color--creme);font-family:Mulish,sans-serif;font-weight:600;font-size:1rem;text-transform:uppercase;letter-spacing:.04em;line-height:1.25;padding:.85rem 1.1rem;text-align:left;border:0;vertical-align:bottom}
.bb-article-body table tbody td{padding:.95rem 1.1rem;border:0;border-bottom:1px solid var(--bb-hairline);color:var(--wp--preset--color--espresso);vertical-align:top;line-height:1.55}
.bb-article-body table tbody tr:last-child td{border-bottom:0}
.bb-article-body table tbody td:first-child{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1rem;color:var(--wp--preset--color--kruste)}
.bb-article-body table .num{text-align:right;font-variant-numeric:tabular-nums}
.bb-article-body .wp-block-table{margin-inline:0}

/* Mobile: EIN einheitlicher leichter Stil für ALLE Artikel-Tabellen (Rezept + Fachartikel),
   egal ob 2 oder 5 Spalten. Kein Karten-Kasten, kein Petrol-Band: hairline-getrennte
   Einträge, 1. Spalte als Fraunces-Zwischentitel, weitere Spalten als „Spaltenkopf → Wert"
   (data-label) – nur wo es einen Spaltenkopf gibt. Referenz: rustikales-baguette. */
@media(max-width:781px){
.bb-article-body table{display:block;border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible;font-size:1rem;margin:1.5rem 0}
.bb-article-body table thead{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);border:0}
.bb-article-body table tbody{display:block}
.bb-article-body table tbody tr{display:block;background:transparent;border:0;border-bottom:1px solid var(--bb-border-hover);border-radius:0;box-shadow:none;padding:.9rem 0;margin:0;overflow:visible}
.bb-article-body table tbody tr:first-child{padding-top:0}
.bb-article-body table tbody tr:last-child{border-bottom:0;padding-bottom:0}
.bb-article-body table tbody td{display:block;text-align:left;padding:.2rem 0 0;border:0;color:var(--wp--preset--color--espresso);line-height:1.55;font-size:1rem}
.bb-article-body table tbody td::before{content:attr(data-label);display:block;font-family:Mulish,sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--bb-text-muted);margin-bottom:.05rem}
.bb-article-body table tbody td:not([data-label])::before{display:none}
.bb-article-body table tbody td:empty{display:none}
/* erste Zelle = leichter Fraunces-Zwischentitel, KEIN Band, KEIN Label */
.bb-article-body table tbody td:first-child{padding:0 0 .15rem;background:transparent!important;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.1rem;color:var(--wp--preset--color--kruste)}
.bb-article-body table tbody td:first-child::before{display:none}
}

/* --- Urgetreide-Sorten o. ä.: 3-Spalten-Bildkarten (Bilder quadratisch + Radius) --- */
.bb-sorten{gap:1.75rem;margin:1.75rem 0 2rem}
.bb-sorten .wp-block-column{display:flex;flex-direction:column}
.bb-sorten .bb-sorten__img{margin:0 0 .9rem}
.bb-sorten .bb-sorten__img img{width:100%;border-radius:var(--bb-radius-md);box-shadow:var(--bb-shadow-sm)}
.bb-sorten p{margin-top:0}
.bb-sorten .has-xs-font-size{margin-top:auto;padding-top:.6rem;color:var(--bb-text-muted)}
@media(max-width:781px){.bb-sorten{gap:1.1rem}.bb-sorten .wp-block-column{margin-bottom:.4rem}}

/* --- Inline-Bilder im Fachartikel: angemessen groß, zentriert, Radius, luftiger Abstand --- */
/* Gilt nur für Fachartikel (.bb-article-body); Rezepte haben diese Klasse nicht. bb-sorten-Bildkarten ausgenommen. */
.bb-article-body figure.wp-block-image:not(.bb-sorten__img){width:100%;max-width:100%;margin:2.5rem auto;text-align:center}
.bb-article-body figure.wp-block-image:not(.bb-sorten__img) img{width:100%;height:auto;max-width:100%;border-radius:var(--bb-radius-lg)}
@media(max-width:781px){
.bb-article-body figure.wp-block-image:not(.bb-sorten__img){margin:1.75rem auto}
.bb-article-body figure.wp-block-image:not(.bb-sorten__img) img{max-width:100%;border-radius:var(--bb-radius-md)}
}

/* ===================================================================
 * Mobile: einheitliche SEITLICHE Paddings = 1.5rem (alle Sektionen & Boxen).
 * !important nötig, um die Inline-Paddings der Panel-Sektionen zu überschreiben.
 * =================================================================== */
@media(max-width:781px){
.bb-panel{padding-left:1.5rem!important;padding-right:1.5rem!important}
.bb-toc,.bb-authorbox,.infobox-weiterlesen{padding-left:1.5rem;padding-right:1.5rem}
}

/* Mobile: 10px seitlicher Außenabstand auch für die übrigen Sektionsboxen
   (überschreibt WPs margin:auto der Root-Padding-Alignments). */
@media(max-width:781px){
.bb-toc--top,.bb-authorbox,.bb-related,.bb-blog-head,.bb-blog-grid,.bb-comments{margin-left:calc(var(--bb-gutter-mobile) - var(--wp--style--root--padding-left))!important;margin-right:calc(var(--bb-gutter-mobile) - var(--wp--style--root--padding-left))!important}
}

/* ===================================================================
 * Brotback-Blog-Übersicht (/back-wissen/): Kopf + Artikelkarten-Raster
 * =================================================================== */
.bb-blog-head{text-align:center;background:var(--bb-sand-tint);border:var(--bb-border);border-radius:var(--bb-radius-lg);padding:var(--bb-section-pad-y) var(--bb-section-pad-x);margin-block:clamp(1.5rem,4vw,2.5rem)}
.bb-blog-head__title{margin:0}
.bb-blog-head__title::after{content:"";display:block;width:2.75rem;height:.16rem;border-radius:1rem;background:var(--wp--preset--color--terrakotta);margin:.95rem auto 0}
.bb-blog-head__intro{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--m);line-height:1.6;color:var(--bb-text-muted);max-width:38rem;margin:1rem auto 0}

/* Raster: 3 / 2 / 1 Spalten (wie „Verwandte Beiträge") */
.bb-blog-grid .wp-block-post-template{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--bb-grid-gap);margin:0}
.bb-blog-grid .wp-block-post-template>li{margin:0}
@media(max-width:781px){.bb-blog-grid .wp-block-post-template{grid-template-columns:1fr 1fr;gap:1rem}}
@media(max-width:480px){.bb-blog-grid .wp-block-post-template{grid-template-columns:1fr}}

/* .bb-card--blog wurde in .bb-card konsolidiert (siehe Karten-Block oben). */

/* Rezept-Übersicht (/rezepte/): Triebmittel als Pille auf den Karten.
   .bb-card-Kinder werden im Flex-Column sonst voll gestreckt → align-self:flex-start
   hält die Pille kompakt; Innenabstand kommt über margin (statt padding-inline wie beim
   schlichten .bb-card__eyebrow). Greift nur bei .bb-eyebrow direkt in der Karte = Rezept-
   Karten; Blog-Karten nutzen .bb-card__eyebrow, der Hero-Eyebrow ist kein .bb-card-Kind. */
.bb-card>.bb-eyebrow{align-self:flex-start;margin:1.75rem var(--bb-card-pad) 0}
.bb-card>.bb-eyebrow+.wp-block-post-title{margin-top:.85rem}

/* ===================================================================
 * Bildkachel (.bb-kachel): kompakte Karte (Bild + Titel), mobil Titel-
 * über-Bild-Overlay, KEIN Exzerpt. Für Startseite + „Verwandte Beiträge".
 * =================================================================== */
.bb-kachel{display:flex;flex-direction:column;height:100%;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-md);overflow:hidden}
.bb-kachel .wp-block-post-featured-image{margin:0;overflow:hidden}
.bb-kachel .wp-block-post-featured-image a{display:block}
.bb-kachel .wp-block-post-featured-image img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;transition:transform .45s ease}
.bb-kachel .wp-block-post-title{font-family:Fraunces,Georgia,serif;font-size:1.05rem;line-height:1.3;margin:1.1rem .9rem 0}
@media(min-width:782px){.bb-kachel{padding-bottom:1.1rem}}
.bb-kachel .wp-block-post-title a{color:var(--wp--preset--color--espresso);text-decoration:none}
.bb-kachel .wp-block-post-title a:hover,.bb-kachel .wp-block-post-title a:focus{color:var(--wp--preset--color--terrakotta)}
.bb-kachel .wp-block-post-excerpt{display:none}
@media(max-width:781px){
.bb-kachel{background:transparent;border:0;border-radius:var(--bb-radius-md);position:relative;overflow:hidden}
.bb-kachel .wp-block-post-featured-image{position:relative;border-radius:var(--bb-radius-md);overflow:hidden}
.bb-kachel .wp-block-post-featured-image::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(43,38,34,0) 32%,rgba(43,38,34,0.45) 58%,rgba(43,38,34,0.85) 100%);pointer-events:none}
.bb-kachel .wp-block-post-title{position:absolute;left:0;right:0;bottom:0;margin:0;padding:.7rem .8rem;z-index:2}
.bb-kachel .wp-block-post-title a,.bb-kachel .wp-block-post-title a:hover,.bb-kachel .wp-block-post-title a:focus{color:var(--wp--preset--color--creme)}
}

/* Wegpunkt als editierbare Bloecke: Block-Standardabstaende neutralisieren, damit Optik 1:1 bleibt */
.bb-step > *{margin:0}

/* Robert-Box-Bild: runde Ecken global, statt Stil im Block (haelt den Bild-Block editor-gueltig) */
.robert-pic img{border-radius:16px}

/* Rezept-Kachel: editierbarer Bild+Titel-Block, ganzflaechiger Link (stretched link) */
.rezept-card{position:relative;display:grid;aspect-ratio:3/2;border-radius:16px;overflow:hidden}
.rezept-card > *{grid-area:1/1;margin:0;min-width:0}
.rezept-card__img{height:100%}
.rezept-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease,filter .5s ease}
.rezept-card:hover .rezept-card__img img{transform:scale(1.06);filter:brightness(.92)}
.rezept-card::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(45,41,38,0) 32%,rgba(45,41,38,0.45) 58%,rgba(45,41,38,0.85) 100%)}
.wp-block-group.rezept-card .rezept-card__title{align-self:end;z-index:2;margin:0;padding:0 1.1rem 1rem;color:#F7F3EF;font-weight:600;line-height:1.2;font-size:clamp(1.15rem, 1rem + 0.6vw, 1.5rem);text-shadow:0 1px 3px rgba(45,41,38,0.5)}
.rezept-card__title a{color:inherit;text-decoration:none}
.rezept-card__title a::after{content:'';position:absolute;inset:0;z-index:3}

/* Router-Karten als editierbare Bloecke: Karte = Gruppe statt <a>, ganzflaechiger Link + Schriftgroessen gegen Theme-Absatzregel sichern */
.bb-router.wp-block-group > *{margin:0}
.wp-block-group.bb-router__card{position:relative}
.wp-block-group.bb-router__card .bb-router__title{font-size:1.2rem;margin:0 0 .35rem}
.wp-block-group.bb-router__card .bb-router__text{font-size:.95rem;margin:0}
.bb-router__card .bb-router__title a{color:inherit;text-decoration:none}
.bb-router__card .bb-router__title a::after{content:'';position:absolute;inset:0;z-index:1}

/* ===================================================================
 * Brotback-Kompass – interaktives Quiz-Freebie (Shortcode [brotback_kompass])
 * =================================================================== */
.bb-kompass{max-width:var(--wp--style--global--wide-size);margin-inline:auto;margin-block:clamp(2rem,4vw,2.25rem);background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-panel);padding:clamp(1.75rem,4vw,3rem)}
@media (max-width:781px){.bb-kompass{margin-inline:calc(var(--bb-gutter-mobile) - var(--wp--style--root--padding-left))!important;margin-block:1.5rem;border-radius:var(--bb-radius-md);box-shadow:none;padding:1.5rem 1.15rem}}
.bb-kompass__screen{display:none}
.bb-kompass[data-state="intro"] .bb-kompass__screen--intro,
.bb-kompass[data-state="quiz"] .bb-kompass__screen--quiz,
.bb-kompass[data-state="result"] .bb-kompass__screen--result{display:block}

/* Intro */
.bb-kompass__hero{display:flex;align-items:center;gap:clamp(1.5rem,4vw,2.5rem);flex-wrap:wrap}
.bb-kompass__hero-media{flex:0 0 clamp(8rem,22vw,11rem);margin-inline:auto}
.bb-kompass__hero-media svg{display:block;width:100%;height:auto}
.bb-kompass__hero-text{flex:1 1 18rem}
.bb-kompass__kicker{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--xs);letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--wp--preset--color--kruste);margin:0 0 .75rem}
.bb-kompass__title{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.15;color:var(--wp--preset--color--espresso);font-size:var(--wp--preset--font-size--xxl);margin:0}
.bb-kompass__lead{color:var(--bb-text-muted);margin:1rem 0 0;line-height:1.6}
.bb-kompass__swoosh{display:block;margin-top:1.25rem;color:var(--wp--preset--color--kruste)}
.bb-kompass__actions{margin-top:clamp(1.5rem,4vw,2rem)}

/* Buttons */
.bb-kompass__btn{display:inline-flex;align-items:center;gap:.5rem;border:1.5px solid var(--wp--preset--color--terrakotta);background:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);font-family:Mulish,sans-serif;font-weight:700;font-size:1.0625rem;padding:.7em 1.5em;border-radius:var(--bb-radius-md);cursor:pointer;transition:background .15s,border-color .15s}
.bb-kompass__btn:hover,.bb-kompass__btn:focus{background:var(--wp--preset--color--kruste);border-color:var(--wp--preset--color--kruste);color:var(--wp--preset--color--creme)}
.bb-kompass__btn--block{width:100%;justify-content:center}
.bb-kompass__ghost{background:none;border:none;color:var(--bb-text-muted);font-family:Mulish,sans-serif;font-size:.95rem;cursor:pointer;padding:.5rem .25rem}
.bb-kompass__ghost:hover,.bb-kompass__ghost:focus{color:var(--wp--preset--color--terrakotta)}

/* Fortschritt */
.bb-kompass__progress{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--xs);letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--bb-text-muted);margin:0 0 .6rem}
.bb-kompass__bar{height:.4rem;background:var(--wp--preset--color--sand);border-radius:99px;overflow:hidden;margin:0 0 1.75rem}
.bb-kompass__bar span{display:block;height:100%;width:0;background:var(--wp--preset--color--terrakotta);border-radius:99px;transition:width .4s ease}

/* Fragen */
.bb-kompass__q{display:none}
.bb-kompass__q.is-current{display:block}
.bb-kompass__qtitle{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.2;color:var(--wp--preset--color--espresso);font-size:var(--wp--preset--font-size--xl);margin:0 0 1.35rem}
.bb-kompass__opts{display:flex;flex-direction:column;gap:.75rem;margin:0 0 1rem}
.bb-kompass__opt{display:flex;align-items:center;gap:.85rem;text-align:left;width:100%;background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:1rem 1.1rem;font-family:Mulish,sans-serif;font-size:1.0625rem;color:var(--wp--preset--color--espresso);cursor:pointer;transition:border-color .15s,background .15s,transform .15s}
.bb-kompass__opt:hover,.bb-kompass__opt:focus{border-color:var(--wp--preset--color--terrakotta);background:var(--bb-card-bg);transform:translateX(.15rem)}
.bb-kompass__opt-num{flex:0 0 1.85rem;width:1.85rem;height:1.85rem;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--bb-sand-tint);color:var(--wp--preset--color--kruste);font-weight:700;font-size:.95rem}
.bb-kompass__opt:hover .bb-kompass__opt-num,.bb-kompass__opt:focus .bb-kompass__opt-num{background:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme)}

/* Ergebnis */
.bb-kompass__res{display:none}
.bb-kompass__res.is-current{display:block}
.bb-kompass__res-head{display:flex;align-items:center;gap:1rem;background:var(--bb-sand-tint);border-radius:var(--bb-radius-md);padding:1.1rem 1.25rem;margin:0 0 1.5rem}
.bb-kompass__badge{flex:0 0 3.1rem;width:3.1rem;height:3.1rem;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--wp--preset--color--creme)}
.bb-kompass__badge svg{width:1.6rem;height:1.6rem}
.bb-kompass__badge--pflege{background:var(--wp--preset--color--petrol)}
.bb-kompass__badge--timing{background:var(--wp--preset--color--kruste)}
.bb-kompass__badge--werkzeug{background:var(--wp--preset--color--espresso)}
.bb-kompass__badge--erwartung{background:var(--wp--preset--color--terrakotta)}
.bb-kompass__res-eyebrow{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--xs);letter-spacing:.12em;text-transform:uppercase;font-weight:700;margin:0 0 .2rem}
.bb-kompass__res-eyebrow--pflege{color:var(--wp--preset--color--petrol)}
.bb-kompass__res-eyebrow--timing{color:var(--wp--preset--color--kruste)}
.bb-kompass__res-eyebrow--werkzeug{color:var(--wp--preset--color--espresso)}
.bb-kompass__res-eyebrow--erwartung{color:var(--wp--preset--color--terrakotta)}
.bb-kompass__res-title{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.2;color:var(--wp--preset--color--espresso);font-size:var(--wp--preset--font-size--l);margin:0}
.bb-kompass__res-body{margin:0;line-height:1.7}
.bb-kompass__first{background:var(--bb-sand-tint);border-radius:var(--bb-radius-md);padding:1.1rem 1.25rem;margin:1.5rem 0}
.bb-kompass__first b{color:var(--wp--preset--color--kruste)}
.bb-kompass__recipe-label{font-weight:700;font-size:.95rem;color:var(--bb-text-muted);margin:0 0 .5rem}
.bb-kompass__recipe{display:inline-flex;align-items:center;gap:.7rem;background:var(--bb-surface);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:.9rem 1.2rem;text-decoration:none;color:var(--wp--preset--color--espresso);font-weight:700}
.bb-kompass__recipe:hover,.bb-kompass__recipe:focus{border-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--espresso)}

/* Opt-in */
.bb-kompass__optin{margin-top:2rem;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-md);padding:clamp(1.25rem,3vw,1.75rem)}
.bb-kompass__optin h3{margin:0 0 .5rem}
.bb-kompass__optin p{margin:0;color:var(--bb-text-muted);line-height:1.6}
.bb-kompass__field{width:100%;box-sizing:border-box;min-height:3rem;padding:.7rem 1rem;border:var(--bb-border);border-radius:var(--bb-radius-sm);background:var(--bb-surface);color:var(--wp--preset--color--espresso);font-family:Mulish,sans-serif;font-size:1rem;margin:1rem 0}
.bb-kompass__field::placeholder{color:var(--bb-text-placeholder)}
.bb-kompass__field:focus{outline:none;border-color:var(--wp--preset--color--terrakotta);box-shadow:0 0 0 .125rem rgba(190,90,46,.2)}
.bb-kompass__hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.bb-kompass__fineprint{font-size:.8rem;color:var(--bb-text-muted);text-align:center;margin:.7rem 0 0}
.bb-kompass__success{background:var(--bb-petrol-tint);border:1px solid var(--wp--preset--color--petrol);border-radius:var(--bb-radius-md);padding:1.1rem 1.25rem;color:var(--bb-petrol-dark);line-height:1.6}
.bb-kompass__restart{text-align:center;margin-top:1.5rem}


/* === Backzeiten-Rechner – Sprung-CTA (Petrol, global) === */
.bz-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;background:var(--bb-card-bg,#FFFCF7);border:var(--bb-border);border-left:5px solid var(--wp--preset--color--petrol,#3E6B6A);border-radius:var(--bb-radius-lg,1rem);padding:clamp(1.2rem,3vw,1.75rem);margin:2rem 0;box-shadow:var(--bb-shadow-sm,0 .125rem .625rem rgba(43,38,34,.08))}
.bz-cta__body{flex:1 1 18rem}
.bz-cta__eyebrow{font-family:Mulish,sans-serif;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--wp--preset--color--petrol,#3E6B6A);margin:0 0 .5rem}
.bz-cta__title{font-family:Fraunces,Georgia,serif;font-size:1.5rem;line-height:1.3;color:var(--wp--preset--color--espresso,#2B2622);margin:0 0 .4rem}
.bz-cta__text{font-family:Mulish,sans-serif;font-size:.9375rem;color:var(--bb-text-muted,#5C5347);margin:0;max-width:40rem}
.bz-cta__btn,.bz-cta__btn:link,.bz-cta__btn:visited,.bz-cta__btn:hover,.bz-cta__btn:focus,.bz-cta__btn:active{color:var(--wp--preset--color--creme,#FBF7F1)!important;text-decoration:none!important}
.bz-cta__btn{flex:0 0 auto;display:inline-block;white-space:nowrap;font-family:Mulish,sans-serif;font-weight:700;font-size:.9375rem;background:var(--wp--preset--color--petrol,#3E6B6A);padding:.7rem 1.3rem;border-radius:9999px;transition:background .2s ease}
.bz-cta__btn:hover,.bz-cta__btn:focus{background:var(--bb-petrol-dark,#2E5150)}

/* === Backzeiten-Rechner – Einbettung im Artikel (global) ===
 * Die Karten-Optik des Rechners liegt im Plugin (Shadow DOM) und ist dort auf
 * dieselben Design-System-Werte gezogen wie der Sprung-Teaser .bz-cta oben:
 * Kartenfarbe, Rahmen, linke Petrol-Kante, Schatten. Hier nur das Einbetten in
 * den Artikelfluss, also die Luft um die Sektion herum wie bei H2 + Baustein. */
backzeit-rechner{display:block}
.entry-content>backzeit-rechner{margin:1.25rem 0 clamp(2.5rem,5vw,3.25rem)}
.bz-rechner-heading{margin-top:clamp(2.5rem,5vw,3.25rem)}

/* ===================================================================
 * Kommentare (core/comments im bb-Design)
 *  - Sektion nach der Autoren-Box, vor dem Newsletter-Block
 *  - natives WP-Kommentarsystem (Liste/Threads/Formular), nur gestylt
 * =================================================================== */
.bb-comments{margin-block:clamp(2.25rem,5vw,3.25rem);background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-panel);padding:clamp(1.5rem,3vw,2.5rem)}
@media(max-width:781px){.bb-comments{padding:1.5rem;border-radius:var(--bb-radius-md);box-shadow:none}}
.bb-comments__head{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--xl);color:var(--wp--preset--color--espresso);margin:0 0 1.25rem}
.bb-comments__head::after{content:"";display:block;width:2.75rem;height:.16rem;border-radius:1rem;background:var(--wp--preset--color--terrakotta);margin:.85rem 0 0}
.bb-comments__area{margin:0}
.bb-comments__count{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);color:var(--wp--preset--color--espresso);margin:0 0 1.5rem}

/* Kommentarliste */
.bb-comments ol.wp-block-comment-template{list-style:none;margin:0;padding:0}
.bb-comments ol.wp-block-comment-template li{padding:1.25rem 0;border-top:1px solid var(--bb-border-hover)}
.bb-comments ol.wp-block-comment-template>li:first-child{border-top:0;padding-top:0}
.bb-comments ol.wp-block-comment-template ol{list-style:none;margin:.5rem 0 0;padding:0 0 0 clamp(1.25rem,3.5vw,2.75rem);border-left:2px solid var(--bb-border-hover)}

/* Einzelner Kommentar */
.bb-comment{gap:1rem!important;align-items:flex-start}
.bb-comment .wp-block-avatar{flex:none;margin:0}
.bb-comment .wp-block-avatar img,.bb-comment__avatar img{width:3rem;height:3rem;border-radius:50%;display:block}
.bb-comment__body{flex:1;min-width:0;gap:.4rem!important}
.bb-comment__meta{gap:.25rem .7rem!important;align-items:baseline;margin:0}
.bb-comment__author,.bb-comment__author a{font-family:Mulish,sans-serif;font-weight:700;font-size:var(--wp--preset--font-size--m);color:var(--wp--preset--color--espresso);text-decoration:none}
.bb-comment__date,.bb-comment__date a{font-family:Mulish,sans-serif;font-size:.85rem;color:var(--bb-text-muted);text-decoration:none}
.bb-comment__date a:hover,.bb-comment__date a:focus{color:var(--wp--preset--color--kruste)}
.bb-comment__content{font-family:Mulish,sans-serif;font-size:var(--wp--preset--font-size--m);line-height:1.65;color:var(--wp--preset--color--espresso);margin:.1rem 0 0}
.bb-comment__content p{margin:0 0 .6rem}
.bb-comment__content p:last-child{margin-bottom:0}
.bb-comment__reply{margin:.25rem 0 0}
.bb-comment__reply a{font-family:Mulish,sans-serif;font-weight:700;font-size:.85rem;color:var(--wp--preset--color--kruste);text-decoration:none}
.bb-comment__reply a:hover,.bb-comment__reply a:focus{color:var(--wp--preset--color--terrakotta)}

/* Paginierung (nur falls Kommentar-Seiten aktiv) */
.bb-comments .wp-block-comments-pagination{margin-top:1.5rem}
.bb-comments .wp-block-comments-pagination a{font-family:Mulish,sans-serif;font-weight:700;font-size:.9rem;color:var(--wp--preset--color--kruste);text-decoration:none}

/* Kommentarformular (natives comment_form()-Markup) */
.bb-comments .wp-block-post-comments-form{margin-top:2.5rem;padding-top:2rem;border-top:var(--bb-border)}
.bb-comments .comment-reply-title{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:var(--wp--preset--font-size--l);color:var(--wp--preset--color--espresso);margin:0 0 .35rem}
.bb-comments .comment-notes,.bb-comments .logged-in-as{font-family:Mulish,sans-serif;font-size:.9rem;line-height:1.55;color:var(--bb-text-muted);margin:0 0 .25rem}
.bb-comments .comment-notes a,.bb-comments .logged-in-as a{color:var(--wp--preset--color--kruste)}
.bb-comments .comment-form{display:flex;flex-direction:column;gap:1rem;margin-top:1.25rem}
.bb-comments .comment-form>p{margin:0}
.bb-comments .comment-form label{display:block;font-family:Mulish,sans-serif;font-weight:700;font-size:.85rem;color:var(--wp--preset--color--espresso);margin-bottom:.4rem}
.bb-comments .comment-form input[type=text],.bb-comments .comment-form input[type=email],.bb-comments .comment-form input[type=url],.bb-comments .comment-form textarea{box-sizing:border-box;width:100%;min-height:3rem;padding:.7rem 1rem;border:var(--bb-border);border-radius:var(--bb-radius-sm);background:var(--bb-surface);color:var(--wp--preset--color--espresso);font-family:Mulish,sans-serif;font-size:1rem}
.bb-comments .comment-form textarea{min-height:8rem;line-height:1.6;resize:vertical}
.bb-comments .comment-form input::placeholder,.bb-comments .comment-form textarea::placeholder{color:var(--bb-text-placeholder)}
.bb-comments .comment-form input:focus,.bb-comments .comment-form textarea:focus{outline:none;border-color:var(--wp--preset--color--terrakotta)}
.bb-comments .comment-form-cookies-consent{display:flex;flex-direction:row;align-items:flex-start;gap:.6rem}
.bb-comments .comment-form-cookies-consent input{margin-top:.2rem;flex:none}
.bb-comments .comment-form-cookies-consent label{margin:0;font-weight:400;color:var(--bb-text-muted)}
.bb-comments .form-submit{margin:0}
/* Der Block rendert den Absende-Button als .wp-element-button (theme.json-Pille mit
   radius 9999px). Wir geben ihm exakt den globalen bb-btn-Look (Radius + Innenabstände). */
.bb-comments .wp-block-post-comments-form :is(.wp-element-button,.submit){font-family:Mulish,sans-serif;font-weight:700;line-height:1.2;font-size:var(--wp--preset--font-size--s);padding:.7em 1.6em;border:1.5px solid var(--wp--preset--color--terrakotta);border-radius:.85em;background-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);cursor:pointer;transition:background-color .15s ease,color .15s ease,border-color .15s ease}
.bb-comments .wp-block-post-comments-form :is(.wp-element-button,.submit):hover,.bb-comments .wp-block-post-comments-form :is(.wp-element-button,.submit):focus{background-color:var(--wp--preset--color--kruste);border-color:var(--wp--preset--color--kruste);color:var(--wp--preset--color--creme)}

/* Name + E-Mail nebeneinander ab Tablet */
@media(min-width:600px){
.bb-comments .comment-form{flex-flow:row wrap}
.bb-comments .comment-form-author,.bb-comments .comment-form-email{flex:1 1 calc(50% - .5rem)}
.bb-comments .comment-form-comment,.bb-comments .comment-form-url,.bb-comments .comment-notes,.bb-comments .comment-form-cookies-consent,.bb-comments .form-submit,.bb-comments .comment-reply-title,.bb-comments .logged-in-as{flex:1 1 100%}
}

/* === Über-mich: Interview-Layout (.bb-interview) – nur diese Seite === */
.bb-interview{background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-panel);padding:clamp(1.75rem,4vw,3.5rem) clamp(1.25rem,4vw,3.25rem);margin-block:clamp(2rem,4vw,2.25rem)}
/* Intro */
.bb-iv-intro{text-align:center;padding-bottom:clamp(1.25rem,3vw,2rem)}
.bb-iv-intro h1{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.1;font-size:clamp(2.2rem,1.8rem + 2vw,3.2rem);color:var(--wp--preset--color--espresso);margin:0 0 1rem}
.bb-iv-intro p{font-family:Fraunces,Georgia,serif;font-weight:500;line-height:1.5;font-size:clamp(1.15rem,1.05rem + .5vw,1.4rem);color:var(--wp--preset--color--espresso);margin:0}
/* Frage-Antwort-Block: dünne Trennlinie + Terrakotta-Akzent oben */
.bb-iv-qa{position:relative;margin-top:clamp(2.25rem,5vw,3.5rem);padding-top:clamp(2.25rem,5vw,3.5rem);border-top:1px solid var(--bb-hairline)}
.bb-iv-qa::before{content:"";position:absolute;top:-0.09375rem;left:50%;transform:translateX(-50%);width:3.5rem;height:0.1875rem;border-radius:1px;background:var(--wp--preset--color--terrakotta)}
/* Frage */
.bb-iv-q{font-family:Fraunces,Georgia,serif!important;font-weight:600;line-height:1.25;font-size:clamp(1.4rem,1.2rem + 1vw,2rem);color:var(--wp--preset--color--terrakotta)!important;margin:0 0 1rem}
/* Antworten */
.bb-iv-qa p{font-family:Mulish,sans-serif;font-size:clamp(1.05rem,1rem + .4vw,1.2rem);line-height:1.7;color:var(--wp--preset--color--espresso);margin:0 0 1rem}
.bb-iv-qa p:last-child{margin-bottom:0}
.bb-iv-qa a{color:var(--wp--preset--color--terrakotta);text-decoration:underline;text-underline-offset:.2em}
/* Text-Frage: schmälere, zentrierte Lesespalte */
.bb-iv-qa--text .bb-iv-q{text-align:center}
/* Bild-Frage: zwei Spalten, Foto als abgerundetes Rechteck */
.bb-iv-qa--img{align-items:center}
.bb-iv-media img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-md)}
@media(min-width:782px){.bb-iv-qa--img.bb-iv-qa--rev{flex-direction:row-reverse}}
/* Rezept-Kärtchen in der „erster Schritt"-Frage */
.bb-iv-cards{margin-top:1.5rem}
.bb-iv-cards h3{font-family:Fraunces,Georgia,serif;font-size:1.05rem;font-weight:600;line-height:1.3;margin:.6rem 0 0}
.bb-iv-cards h3 a{color:var(--wp--preset--color--espresso);text-decoration:none}
/* Pull-Quote (Rhythmus-Brecher) – frei stehend, ohne Kasten */
.bb-iv-quote{margin-block:clamp(2.75rem,6vw,4.5rem);background:none;border:0;padding:0 clamp(1rem,3vw,2rem);text-align:center}
.bb-iv-quote::before{content:"\201E";display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(3rem,2rem + 3vw,4.5rem);line-height:1;color:var(--wp--preset--color--terrakotta);margin-bottom:.3rem}
.bb-iv-quote p{font-family:Fraunces,Georgia,serif;font-weight:500;line-height:1.3;font-size:clamp(1.6rem,1.3rem + 1.7vw,2.45rem);color:var(--wp--preset--color--espresso);margin:0 auto;max-width:44rem}
/* Newsletter-Band */
.bb-iv-news{margin-top:clamp(2.5rem,5vw,3.5rem);background:var(--wp--preset--color--sand);border-radius:var(--bb-radius-lg);padding:clamp(1.75rem,4vw,2.75rem)}
/* Abschluss */
.bb-iv-end{margin-top:clamp(2.5rem,5vw,3.5rem);padding-top:clamp(2.25rem,5vw,3.5rem);border-top:1px solid var(--bb-hairline);text-align:center}
@media(max-width:781px){
.bb-interview{padding:1.5rem 1.15rem}
.bb-iv-media{margin-bottom:1.25rem}
}

/* === Robert-Seite: erzählte Artikel-Abschnitte mit umflossenem Bild (in .bb-interview) === */
.bb-rob-sec{position:relative;max-width:46rem;margin-inline:auto;margin-top:clamp(2.25rem,5vw,3.5rem);padding-top:clamp(2.25rem,5vw,3.5rem);border-top:1px solid var(--bb-hairline)}
.bb-rob-sec::before{content:"";position:absolute;top:-0.09375rem;left:0;width:3.5rem;height:0.1875rem;border-radius:1px;background:var(--wp--preset--color--terrakotta)}
.bb-rob-sec::after{content:"";display:block;clear:both}
.bb-rob-sec--hero{margin-top:0;padding-top:0;border-top:0}
.bb-rob-sec--hero::before{display:none}
.bb-rob-sec--hero h1{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.15;font-size:clamp(1.9rem,1.5rem + 1.8vw,2.8rem);color:var(--wp--preset--color--espresso);margin:0 0 .5rem}
.bb-rob-sec--hero h2{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.2;font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);color:var(--wp--preset--color--terrakotta);margin:0 0 .75rem}
.bb-rob-sec .bb-iv-q{margin:0 0 1rem}
.bb-rob-sec p{font-family:Mulish,sans-serif;font-size:clamp(1.05rem,1rem + .4vw,1.2rem);line-height:1.7;color:var(--wp--preset--color--espresso);margin:0 0 1rem}
.bb-rob-sec p:last-child{margin-bottom:0}
.bb-rob-media{margin:0 0 1.25rem}
.bb-rob-media img{display:block;width:100%;height:auto;filter:drop-shadow(0 0.5rem 0.85rem rgba(43,38,34,.16))}
@media(min-width:600px){
.bb-rob-media{float:right;width:14rem;margin:.3rem 0 1rem 1.75rem}
.bb-rob-sec--left .bb-rob-media{float:left;margin:.3rem 1.75rem 1rem 0}
}
/* "Robert sagt, wie's ist" – zentrierte Übergangs-Überschrift mit Anführungszeichen */
.bb-rob-says{text-align:center;margin-top:clamp(2.75rem,6vw,4.5rem)}
.bb-rob-says::before{content:"\201E";display:block;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(2.5rem,1.5rem + 2.5vw,3.5rem);line-height:1;color:var(--wp--preset--color--terrakotta);margin-bottom:.3rem}
.bb-rob-says h2{font-family:Fraunces,Georgia,serif;font-weight:600;line-height:1.15;font-size:clamp(1.8rem,1.4rem + 1.6vw,2.6rem);color:var(--wp--preset--color--espresso);margin:0}

/* ===================================================================
 * Rezept-Filter: Such-Pills (Mehl + Form) auf /rezepte/
 *  - zwei Pill-Reihen ueber dem Karten-Raster; Optik an .bb-lex-az
 *    angelehnt, aber pillenfoermig mit Label + Treffer-Zaehler
 *  - Karten nutzen die bestehende .bb-card-Optik; Raster wie .bb-blog-grid
 * =================================================================== */
.bb-rezept-filter{max-width:var(--wp--style--global--wide-size);margin-inline:auto}
/* Pill-Leiste sitzt in einer eigenen Box (wie der Rest der Seite mit .bb-panel arbeitet) */
.bb-rzf__bar{background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm);padding:clamp(1.1rem,3vw,1.5rem) clamp(1.15rem,3vw,1.6rem);margin:0 0 1.75rem}
.bb-rzf__row{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
/* zweite Reihe optisch von der ersten abgesetzt (feine Trennlinie) */
.bb-rzf__row + .bb-rzf__row{margin-top:.85rem;padding-top:.85rem;border-top:1px solid var(--bb-hairline)}
/* Label = feste, kräftige Spalte, klar als Rubrik erkennbar (kein Pill-Look) */
.bb-rzf__label{flex:0 0 7rem;font-family:Mulish,sans-serif;font-size:.72rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--wp--preset--color--espresso);margin-right:.4rem}
.bb-rzf__pill{font-family:Mulish,sans-serif;font-weight:600;font-size:.9rem;line-height:1;padding:.5rem .9rem;border:var(--bb-border);border-radius:999px;background:var(--bb-card-bg);color:var(--wp--preset--color--espresso);cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease}
/* Hover = leichter Terrakotta-Hauch, klar unterscheidbar vom gefuellten Aktiv-Zustand */
.bb-rzf__pill:hover{background:rgba(190,90,46,.1);border-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--terrakotta)}
/* Aktiv = kraeftiges Terrakotta, nur bei tatsaechlich gewaehltem Filter */
.bb-rzf__pill.is-active{background:var(--wp--preset--color--terrakotta);border-color:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme)}
/* "Alle" im Ruhezustand ruhig (sand) - signalisiert nur den Default, schreit nicht */
.bb-rzf__pill[data-term=""].is-active{background:var(--bb-sand-tint);border-color:var(--wp--preset--color--sand);color:var(--wp--preset--color--espresso)}
.bb-rzf__pill.is-empty{opacity:.32;cursor:default;pointer-events:none}
.bb-rzf__count{margin-left:.4em;font-size:.78em;font-weight:700;opacity:.7}
.bb-rzf__empty{font-family:Mulish,sans-serif;color:var(--bb-text-muted);text-align:center;padding:2.5rem 1rem;margin:0}
.bb-rezept-grid{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--bb-grid-gap);margin:0;padding:0}
.bb-rezept-grid>li{margin:0}
.bb-rezept-item[hidden]{display:none}
@media(max-width:781px){.bb-rezept-grid{grid-template-columns:1fr 1fr;gap:1rem}}
/* Schmale Screens: Label als eigene Zeile ueber die Pills (sonst blendet es zwischen ihnen unter) */
@media(max-width:600px){.bb-rzf__label{flex-basis:100%;margin:0 0 .15rem}}
.bb-rzf__selects{display:none}
.bb-rzf__srow{display:flex;align-items:center;gap:.75rem}
.bb-rzf__srow + .bb-rzf__srow{margin-top:.65rem}
.bb-rzf__slabel{flex:0 0 6.25rem;font-family:Mulish,sans-serif;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--wp--preset--color--espresso)}
.bb-rzf__select{flex:1 1 auto;min-width:0;font-family:Mulish,sans-serif;font-size:1rem;color:var(--wp--preset--color--espresso);background-color:var(--bb-card-bg);border:var(--bb-border);border-radius:.65rem;padding:.65rem 2.2rem .65rem .85rem;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%232B2622' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' d='M4 6l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;background-size:1rem}
.bb-rzf__select:focus-visible{outline:2px solid var(--wp--preset--color--terrakotta);outline-offset:1px}
@media(max-width:600px){.bb-rzf__bar{display:none}.bb-rzf__selects{display:block;background:var(--bb-card-bg);border:var(--bb-border);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm);padding:1.1rem 1.15rem;margin:0 0 1.5rem}}
@media(max-width:480px){.bb-rezept-grid{grid-template-columns:1fr}}


/* === Rezept-Box (Inline-Rezeptur in Fachartikeln) - eigener Namensraum .bb-rezept-box, unabhaengig von WPRM (.wprm-*) === */
.bb-rezept-box{background:var(--bb-surface);border:1px solid var(--bb-hairline);border-top:3px solid var(--wp--preset--color--terrakotta);border-radius:var(--bb-radius-lg);box-shadow:var(--bb-shadow-sm);padding:1.75rem 2rem;margin:2.5rem 0}
.bb-rezept-box__kicker{display:block;font-family:Mulish,sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.11em;text-transform:uppercase;color:var(--wp--preset--color--terrakotta);margin:0 0 .2rem}
.bb-rezept-box__titel{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:clamp(1.25rem,2vw + .3rem,1.5rem);color:var(--wp--preset--color--espresso);margin:0 0 1rem;padding:0}
.bb-rezept-box__label{display:block;font-family:Mulish,sans-serif;font-weight:700;font-size:.85rem;color:var(--wp--preset--color--espresso);margin:1.1rem 0 .4rem}
.bb-rezept-box ul,.bb-rezept-box ol{margin:0;padding-left:1.25rem;color:var(--wp--preset--color--espresso)}
.bb-rezept-box li{margin:.25rem 0;line-height:1.5}
.bb-rezept-box__dosierung{margin:1.1rem 0 0;padding-top:.9rem;border-top:1px solid var(--bb-hairline);color:var(--wp--preset--color--espresso)}
@media(max-width:600px){.bb-rezept-box{padding:1.25rem}}


/* --- Lernpfad-End-Navigation (bb-pathnav) --- */
.bb-pathnav{margin:2.5rem 0 0}
.bb-pathnav__eyebrow{font-family:Mulish,sans-serif;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;color:var(--bb-text-muted);font-weight:700;margin:0 0 1rem}
.bb-pathnav__row{display:flex;gap:1rem;flex-wrap:wrap}
.bb-pathnav__card{flex:1;min-width:190px;background:var(--bb-card-bg);border:1px solid var(--bb-hairline);border-radius:var(--bb-radius-md);padding:.95rem 1.1rem;text-decoration:none;display:block;transition:border-color .2s ease,box-shadow .2s ease}
.bb-pathnav__card:hover{border-color:var(--bb-border-hover);box-shadow:var(--bb-shadow-sm)}
.bb-pathnav__dir{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--wp--preset--color--petrol);display:block;margin-bottom:.35rem}
.bb-pathnav__title{font-family:Fraunces,serif;font-weight:600;font-size:1.08rem;color:var(--wp--preset--color--espresso);line-height:1.25}
@media(max-width:781px){.bb-pathnav__row{flex-direction:column}}

/* === Rezept-Kärtchen (bb-recipe-card) — globale Rezept-Brücke am Artikelende === */
.bb-recipe-card{display:flex;gap:0;background:var(--bb-card-bg);border:1px solid var(--bb-hairline);border-radius:var(--bb-radius-lg);overflow:hidden;box-shadow:var(--bb-shadow-sm);text-decoration:none;color:inherit;margin:2rem 0;transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease}
.bb-recipe-card:hover,.bb-recipe-card:focus-visible{box-shadow:var(--bb-shadow-md);border-color:var(--bb-border-hover);transform:translateY(-2px)}
.bb-recipe-card:focus-visible{outline:2px solid var(--wp--preset--color--terrakotta);outline-offset:2px}
.bb-recipe-card__media{flex:0 0 34%;max-width:220px;min-height:160px;background:var(--bb-sand-tint);overflow:hidden}
.bb-recipe-card__media img{width:100%;height:100%;object-fit:cover;display:block}
.bb-recipe-card__body{flex:1;min-width:0;padding:1.1rem 1.3rem;display:flex;flex-direction:column;gap:.35rem}
.bb-recipe-card__eyebrow{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--wp--preset--color--terrakotta)}
.bb-recipe-card__title{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.25rem;line-height:1.2;color:var(--wp--preset--color--espresso);margin:0}
.bb-recipe-card__teaser{font-family:Mulish,sans-serif;font-size:.95rem;line-height:1.5;color:var(--bb-text-muted)}
.bb-recipe-card__meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.15rem}
.bb-recipe-card__chip{font-family:Mulish,sans-serif;font-size:.72rem;font-weight:700;color:var(--bb-petrol-dark);background:var(--bb-petrol-tint);border-radius:999px;padding:.22rem .65rem}
.bb-recipe-card__cta{align-self:flex-start;margin-top:.7rem;display:inline-flex;align-items:center;gap:.4rem;font-family:Mulish,sans-serif;font-weight:700;font-size:.9rem;padding:.6rem 1.2rem;border-radius:.75rem;background:var(--wp--preset--color--terrakotta);color:var(--wp--preset--color--creme);border:1.5px solid var(--wp--preset--color--terrakotta);transition:background-color .15s ease,border-color .15s ease}
.bb-recipe-card__cta .bb-arr{transition:transform .2s ease;display:inline-block}
.bb-recipe-card:hover .bb-recipe-card__cta{background:var(--wp--preset--color--kruste);border-color:var(--wp--preset--color--kruste)}
.bb-recipe-card:hover .bb-recipe-card__cta .bb-arr{transform:translateX(.2rem)}
@media(max-width:600px){.bb-recipe-card{flex-direction:column}.bb-recipe-card__media{flex-basis:auto;max-width:none;width:100%;height:180px;min-height:0}}
/* ── Zuletzt-aktualisiert-Zeile (global, 20.07.2026) ───────────────────────
   Sitzt im Template am Ende von .bb-article-body (Fachartikel + Rezept) als
   core/post-date mit displayType "modified". Das Datum zieht sich automatisch
   aus WordPress, deshalb NICHT von Hand in Beiträge schreiben.
   Der Präfix "Zuletzt aktualisiert am " kommt hier aus dem CSS, damit im
   Beitrag nur das reine Datum steht.                                        */
.bb-article-body .bb-updated{
  margin-top:2.5rem;
  padding-top:1rem;
  border-top:1px solid var(--bb-hairline,rgba(0,0,0,.1));
  font-family:Mulish,sans-serif;
  color:var(--bb-text-muted);
}
.bb-article-body .bb-updated time::before{
  content:"Zuletzt aktualisiert am ";
}


/* bine: Affiliate-Disclaimer unter WPRM-Zubehör */
.bine-equipment-affiliate-disclaimer{
	margin-top:.75rem;
	padding:0 1.25rem;
	font-size:.8rem;
	line-height:1.4;
	opacity:.7;
}


/* bine: Hero-Aufmacher "Sauerteig?" wuchtiger, skaliert ueber den clamp (alle Groessen) */
.bb-hero-lead{
    font-size:1.3em;
    line-height:1.05;
  }


/* bine: Teilen-Leiste am Beitragsende (Rezept + Fachartikel) */
.bb-share{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin:2.25rem 0 .5rem;padding-top:1.25rem;border-top:.5px solid var(--bb-hairline,rgba(0,0,0,.12));}
.bb-share__label{font-family:Mulish,sans-serif;font-size:.85rem;letter-spacing:.05em;font-weight:700;color:var(--wp--preset--color--terrakotta,#BE5A2E);margin-right:.15rem;}
.bb-share__btn{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .9rem;border:1.5px solid var(--wp--preset--color--terrakotta,#BE5A2E);border-radius:8px;color:var(--wp--preset--color--terrakotta,#BE5A2E);background:transparent;font-family:Mulish,sans-serif;font-size:.9rem;font-weight:600;line-height:1;text-decoration:none;cursor:pointer;transition:background .15s ease,color .15s ease;}
.bb-share__btn:hover,.bb-share__btn:focus-visible{background:var(--wp--preset--color--terrakotta,#BE5A2E);color:var(--wp--preset--color--creme,#FBF7F1);}
.bb-share__btn svg{width:18px;height:18px;flex:0 0 auto;}
@media (max-width:600px){.bb-share__label{flex-basis:100%;margin-bottom:.15rem;}}


/* bine: Klick-Fokusrahmen an Karten-Links weg, Tastatur-Fokus bleibt (wie Titel-/Menue-Links) */
.wp-block-read-more:focus,.wp-block-post-featured-image a:focus{outline:none}
.wp-block-read-more:focus-visible,.wp-block-post-featured-image a:focus-visible{outline:2px solid var(--wp--preset--color--terrakotta);outline-offset:2px;border-radius:.5rem}