
.art h2,.art h3{color:var(--color-text)}
.art .tw-rezept-bild img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.art .tw-rezept-info{padding:20px;border:1px solid var(--color-border);border-radius:16px;margin:24px 0}
.art .tw-rezept-info p:last-child{margin-bottom:0}
.art .tw-rezept-schritte>li{margin-bottom:24px}
.art .tw-rezept-schritte h3{margin:0 0 8px}
.art [id^="rezept-"]{scroll-margin-top:140px}
.art .tw-rezept-spruenge{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 32px}
.art .tw-rezept-sprung{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-text);font:700 15px/1.3 var(--font-body);text-decoration:none;transition:background var(--transition-fast),transform var(--transition-fast);box-sizing:border-box}
.art .tw-rezept-sprung svg{width:20px;height:20px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2}
.art .tw-rezept-sprung--primaer{background:var(--color-cta);color:var(--color-cta-ink);border-color:var(--color-cta)}
.art .tw-rezept-sprung:hover{background:var(--color-surface-2);color:var(--color-text);transform:translateY(-1px);text-decoration:none}
.art .tw-rezept-sprung--primaer:hover{background:var(--color-cta-hover);color:var(--color-cta-ink)}
.art .tw-rezept-sprung:focus-visible{outline:none;box-shadow:var(--focus-ring)}
@media(max-width:480px){.art .tw-rezept-sprung{flex:1 1 auto;padding-inline:16px}}
@media(prefers-reduced-motion:reduce){.art .tw-rezept-sprung{transition:none}.art .tw-rezept-sprung:hover{transform:none}}

/* Rezeptbausteine: dieselben Tokens, Icon-Kacheln und Schritte wie die Wissensartikel. */
.art .tw-rezept-info{padding:24px;border-radius:var(--radius-lg);background:var(--color-surface-2);border:1px solid var(--color-border)}
.art .tw-rezept-info h2{margin:0 0 20px}
.art .tw-rezept-fakten{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 20px}
.art .tw-rezept-fakten div{border-left:2px solid var(--color-cta);padding-left:12px}
.art .tw-rezept-fakten dt{font-size:12px;font-weight:700;color:var(--color-text-muted);margin-bottom:4px}
.art .tw-rezept-fakten dd{font-size:18px;font-weight:800;color:var(--color-text);margin:0}
.art .tw-rezept-werkzeug{display:flex;align-items:start;gap:12px;border-top:1px solid var(--color-border);padding-top:16px}
.art .tw-rezept-werkzeug svg,.art .tw-rezept-quellen summary svg{width:20px;height:20px;flex:none;margin-top:3px;stroke:currentColor;fill:none;stroke-width:2}
.art .tw-rezept-werkzeug strong{color:var(--color-text)}
.art .tw-rezept-zutaten{padding:0;margin:16px 0 24px;list-style:none;border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}
.art .tw-rezept-zutaten li+li{border-top:1px solid var(--color-border)}
.art .tw-rezept-zutaten label{display:flex;align-items:start;gap:10px;min-height:44px;padding:10px 14px;margin:0;cursor:pointer;font:400 14.5px/1.55 var(--font-body);color:var(--color-text-muted);background:var(--color-surface);box-sizing:border-box}
.art .tw-rezept-zutaten label:hover{background:var(--color-surface-2)}
.art .tw-rezept-zutaten input{position:static;opacity:1;appearance:auto;flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--color-link);cursor:pointer}
.art .tw-rezept-zutaten input:checked+span{text-decoration:line-through;color:var(--color-text-muted)}
.art .tw-rezept-zutaten input:focus-visible{outline:2px solid var(--color-link);outline-offset:4px}
.art .tw-rezept-werkleiste{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:8px 0}
.art .tw-rezept-werkleiste [hidden],.art .tw-rezept-schritte [hidden]{display:none!important}
.art .tw-rezept-status{font:400 12.5px/1.5 var(--font-body);color:var(--color-text-muted)}
.art .tw-rezept-aktion{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border:1px solid var(--color-border);border-radius:var(--radius-pill);font:700 13px/1.4 var(--font-body);background:var(--color-surface);color:var(--color-text);cursor:pointer}
.art .tw-rezept-aktion:hover{background:var(--color-surface-2)}
/* Reset bleibt leicht gewichtet; die Trefferfläche bleibt für Touch erhalten. */
.art .tw-rezept-werkleiste .tw-rezept-aktion{padding:8px 10px;border-color:transparent;background:transparent;font-size:12.5px;font-weight:500;color:var(--color-text-muted)}
.art .tw-rezept-werkleiste .tw-rezept-aktion:hover{color:var(--color-text);text-decoration:underline;text-underline-offset:3px}
.art .tw-rezept-aktion:focus-visible,.art .tw-rezept-quellen summary:focus-visible,.art .tw-rezept-faq summary:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.art .tw-rezept-aktion[aria-pressed="true"]{background:var(--color-cta);color:var(--color-cta-ink);border-color:var(--color-cta)}
.art .tw-rezept-schritte{counter-reset:rezept-schritt;padding:0;list-style:none;margin:20px 0 32px}
.art .tw-rezept-schritte>li{position:relative;padding:0 0 24px 68px;margin:0 0 24px;border-bottom:1px dashed var(--color-border);counter-increment:rezept-schritt}
.art .tw-rezept-schritte>li:before{content:counter(rezept-schritt,decimal-leading-zero);position:absolute;left:0;top:0;display:grid;place-items:center;width:48px;height:48px;border-radius:var(--radius-pill);background:var(--color-cta);color:var(--color-cta-ink);font:800 18px/1 var(--font-body)}
.art .tw-rezept-schritte>li:last-child{border-bottom:0;margin-bottom:0}
.art .tw-rezept-schritte h3{padding-top:8px;margin-bottom:12px}
.art .tw-rezept-schritte p{margin-bottom:16px}
.art .tw-rezept-schritte>li.is-done:before{content:'\2713'}
.art .tw-rezept-produkt{display:grid;grid-template-columns:144px minmax(0,1fr);gap:24px;align-items:center;padding:20px;margin:24px 0 40px;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg)}
.art .tw-rezept-produkt img{display:block;width:144px;height:144px;object-fit:contain;background:var(--product-stage);border-radius:var(--radius-md)}
.art .tw-rezept-produkt .tw-rezept-eyebrow{display:block;font:400 21px/1.2 var(--font-accent);color:var(--color-link);margin-bottom:6px}
.art .tw-rezept-produkt h3{margin:0 0 8px;font-size:20px;color:var(--color-text)}
.art .tw-rezept-produkt p{margin:0 0 12px;font-size:14px}
.art .tw-rezept-produkt .tw-rezept-sprung{padding:12px 18px}
.art .tw-rezept-faq{border-bottom:1px solid var(--color-border)}
.art .tw-rezept-faq summary{padding:18px 4px;cursor:pointer;color:var(--color-text)}
.art .tw-rezept-faq summary h3{display:inline;margin:0;font-size:16px}
.art .tw-rezept-faq p{padding:0 4px 12px}
.art .tw-rezept-quellen{margin:32px 0 24px;padding:0 20px;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md)}
.art .tw-rezept-quellen summary{display:flex;align-items:center;gap:12px;min-height:60px;cursor:pointer;font:700 15px/1.4 var(--font-body);color:var(--color-text)}
.art .tw-rezept-quellen summary:after{content:'+';margin-left:auto;font-size:24px;font-weight:400}
.art .tw-rezept-quellen[open] summary:after{content:'\2212'}
.art .tw-rezept-quellen summary::-webkit-details-marker{display:none}
.art .tw-rezept-quellen p,.art .tw-rezept-quellen li{font-size:13px;line-height:1.65}
.art .tw-rezept-quellen ul{padding-left:18px}
.art .tw-rezept-quellen a{overflow-wrap:anywhere}
.art .tw-rezept-quellen li{margin-bottom:8px}
.art .tw-rezept-quellen a{display:inline-block;padding:4px 0}
.art .tw-rezept-schluss{margin-top:24px}
@media(max-width:600px){
 .art .tw-rezept-info{padding:20px 16px}
 .art .tw-rezept-fakten{grid-template-columns:1fr 1fr;gap:20px 12px}
 .art .tw-rezept-fakten dd{font-size:17px}
 .art .tw-rezept-schritte>li{padding-left:52px}
 .art .tw-rezept-schritte>li:before{width:36px;height:36px;font-size:15px}
 .art .tw-rezept-schritte h3{padding-top:4px}
 .art .tw-rezept-produkt{grid-template-columns:88px minmax(0,1fr);gap:16px;padding:16px}
 .art .tw-rezept-produkt img{width:88px;height:112px}
 .art .tw-rezept-produkt h3{font-size:17px}
 .art .tw-rezept-produkt .tw-rezept-sprung{font-size:13px;padding:12px}
}

/* Hochformate behalten den ganzen Anschnitt statt eines erzwungenen Querformat-Crops. */
.art .tw-rezept-bild--original{max-width:560px;margin:32px auto}
.art .tw-rezept-bild--original img{aspect-ratio:auto;object-fit:contain}
.art .tw-rezept-schritte .tw-rezept-bild--original{max-width:480px;margin:20px 0}

/* Zutatenfoto und Abhakliste bilden auf breiten Artikeln eine ruhige Einheit. */
.art .tw-rezept-vorbereitung{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;margin:20px 0 24px;align-items:start}
.art .tw-rezept-vorbereitung>div{min-width:0}
.art .tw-rezept-zutatenfoto .tw-rezept-bild{max-width:560px;margin:0 auto}
.art .tw-rezept-zutatenliste>p{margin:0 0 8px;font-size:14px}
.art .tw-rezept-zutatenliste .tw-rezept-zutaten{margin-bottom:0}
.art .tw-rezept-bildlink{position:relative;display:block;border-radius:var(--radius-md);overflow:hidden;cursor:zoom-in}
.art .tw-rezept-bildlink:focus-visible{outline:2px solid var(--color-link);outline-offset:4px}
.art .tw-rezept-zoom{position:absolute;right:12px;bottom:12px;display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface);color:var(--color-text);pointer-events:none}
.art .tw-rezept-zoom svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}
@media(min-width:1100px){.art .tw-rezept-vorbereitung{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:24px}.art .tw-rezept-zutatenfoto{position:sticky;top:170px}}
@media(prefers-reduced-motion:reduce){.art .tw-rezept-bildlink{scroll-behavior:auto}}

/* Bewertungen unter dem Rezept (blog/tw-rezept-bewertung.tpl). Kartenoptik
   identisch zur Produktseite - siehe .rcard/.stars/.rtxt/.rmeta/.avat in
   startseite.css und .rstars in produktdetail.css, beide seit 23.10.2026
   auch an Newsdetail gebunden (layout/header.tpl). Nur die Eyebrow-Variante
   ist hier dupliziert: .tw-pdp .eyebrow (produktdetail.css) ist an die
   Produktseite gescoped und greift in .tw-artikel nicht. */
.art .tw-rb{margin:48px 0 0;padding-top:32px;border-top:1px solid var(--color-border)}
.art .tw-rb .eyebrow{font-family:var(--font-body);font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#8a97a9;opacity:1}
[data-theme="dark"] .art .tw-rb .eyebrow{color:#8fa3c0}
.art .tw-rb-formular{margin-top:32px;padding:24px;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface-2)}
.art .tw-rb-formular h3{margin:0 0 16px}
.art .tw-rb-meldung{padding:12px 16px;border-radius:var(--radius-md);background:var(--color-success-surface);color:var(--color-success);font-weight:700}
.art .tw-rb-fehler{margin:0 0 16px;padding:12px 16px 12px 32px;border-radius:var(--radius-md);background:var(--color-error-surface);color:var(--color-error);font-weight:600}
.art .tw-rb-falle{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.art .tw-rb-wahl{border:0;margin:0 0 16px;padding:0}
.art .tw-rb-wahl legend{font:700 14px/1.4 var(--font-body);color:var(--color-text);padding:0;margin:0 0 6px;border:0;width:auto;float:none}
.art .tw-rb-wahlreihe{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end}
.art .tw-rb-wahlreihe input{position:absolute;opacity:0;width:1px;height:1px}
.art .tw-rb-wahlreihe label{cursor:pointer;display:grid;place-items:center;min-width:44px;min-height:44px;color:var(--color-text-muted);margin:0}
.art .tw-rb-wahlreihe label svg{width:28px;height:28px}
.art .tw-rb-wahlreihe .an{display:none}
.art .tw-rb-wahlreihe input:checked~label .an,.art .tw-rb-wahlreihe label:hover .an,.art .tw-rb-wahlreihe label:hover~label .an{display:block}
.art .tw-rb-wahlreihe input:checked~label .aus,.art .tw-rb-wahlreihe label:hover .aus,.art .tw-rb-wahlreihe label:hover~label .aus{display:none}
.art .tw-rb-wahlreihe input:checked~label,.art .tw-rb-wahlreihe label:hover,.art .tw-rb-wahlreihe label:hover~label{color:var(--color-gold)}
.art .tw-rb-wahlreihe input:focus-visible+label{outline:2px solid var(--color-link);outline-offset:-2px;border-radius:8px}
.art .tw-rb-feld{display:block;margin:0 0 16px;font:700 14px/1.4 var(--font-body);color:var(--color-text)}
.art .tw-rb-feld input,.art .tw-rb-feld textarea{display:block;width:100%;box-sizing:border-box;margin-top:6px;padding:12px 14px;border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);color:var(--color-text);font:400 15px/1.5 var(--font-body)}
.art .tw-rb-feld input:focus,.art .tw-rb-feld textarea:focus{outline:none;border-color:var(--color-cta);box-shadow:var(--focus-ring)}
.art .tw-rb-haken{display:flex;align-items:start;gap:10px;min-height:44px;margin:0 0 12px;font:400 14.5px/1.5 var(--font-body);color:var(--color-text);cursor:pointer}
.art .tw-rb-haken input{position:static;opacity:1;appearance:auto;flex:none;width:18px;height:18px;margin:3px 0 0;accent-color:var(--color-link)}
.art .tw-rb-hinweis{font:400 13px/1.55 var(--font-body);color:var(--color-text-muted);margin:0 0 16px}

/* Naehrwerte je Portion (blog/tw-rezept-naehrwerte.tpl). */
.art .tw-nw{margin:40px 0 0}
.art .tw-nw h2{margin:0 0 16px}
.art .tw-nw-liste{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:0 0 12px}
.art .tw-nw-liste div{border-left:2px solid var(--color-cta);padding-left:12px}
.art .tw-nw-liste dt{font-size:12px;font-weight:700;color:var(--color-text-muted);margin-bottom:4px}
.art .tw-nw-liste dd{font-size:18px;font-weight:800;color:var(--color-text);margin:0}
.art .tw-nw-hinweis{font:400 13px/1.55 var(--font-body);color:var(--color-text-muted);margin:0}
@media(max-width:640px){.art .tw-nw-liste{grid-template-columns:repeat(2,minmax(0,1fr))}}
