.knowledge-rose { --fruit-paper:#ffe1e8; }
.knowledge-lime { --fruit-paper:#e9f5c9; }
.knowledge-lilac { --fruit-paper:#ede3fb; }
.knowledge-peach { --fruit-paper:#ffe4c7; }
.knowledge-sun { --fruit-paper:#fff0b6; }
.knowledge-link { display:inline-flex; gap:22px; align-items:center; min-height:44px; margin-top:18px; font-weight:650; text-underline-offset:5px; }
.knowledge-page { max-width:1160px; }
.knowledge-page>.back-link { display:none; }
.knowledge-intro { padding:34px 0 42px; max-width:840px; }
.knowledge-intro h1 { margin:16px 0 22px; font-size:clamp(38px,6vw,70px); line-height:1.02; letter-spacing:-2.8px; }
.knowledge-intro h1 span { color:#647a3e; }
.knowledge-intro>p { max-width:640px; font-size:18px; line-height:1.7; }
.knowledge-stamps { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.knowledge-stamps span { font-size:11px; padding:9px 13px; border:1px solid var(--line); border-radius:30px; background:#f2f8e9; }
.knowledge-search { border-block:1px solid var(--line); padding:24px 0 16px; margin-bottom:30px; }
.knowledge-search label { display:block; font-size:14px; font-weight:650; margin-bottom:12px; }
.knowledge-search>div { display:flex; max-width:650px; gap:10px; }
.knowledge-search input { flex:1; width:100%; min-width:0; border:1px solid #a4b49c; border-radius:12px; background:white; padding:15px 18px; }
.knowledge-search button { border:1px solid #a4b49c; border-radius:12px; padding:12px 18px; background:#f0f6df; }
.knowledge-search p { font-size:12px; margin:12px 0 0; color:var(--muted); }
.knowledge-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.knowledge-card { display:block; border:1px solid var(--line); border-radius:20px; overflow:hidden; text-decoration:none; background:#fffef9; transition:transform .2s ease,box-shadow .2s ease; }
.knowledge-card[hidden],.knowledge-search[hidden],.knowledge-empty[hidden] { display:none; }
.knowledge-card-art { display:grid; place-items:center; height:165px; background:var(--fruit-paper); }
.knowledge-card svg { width:110px; height:110px; transition:transform .3s ease; }
.knowledge-card-name { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:21px; font-weight:700; padding:18px 18px 0; letter-spacing:-.5px; }
.knowledge-card-copy { display:block; font-size:12px; line-height:1.5; padding:9px 18px 22px; }
.knowledge-card:hover,.knowledge-card:focus-visible { transform:translateY(-4px); box-shadow:0 9px 18px #31574412; }
.knowledge-card:hover svg,.knowledge-card:focus-visible svg { transform:rotate(-7deg) scale(1.07); }
.knowledge-bottom-note,.knowledge-food-note { margin:36px 0; padding:22px 25px; background:#f2f7e8; border-radius:16px; font-size:13px; line-height:1.8; }
.knowledge-bottom-note strong,.knowledge-food-note strong { display:block; }
.knowledge-empty { padding:30px 0; }
.knowledge-teaser { margin-block:68px; padding-block:40px; display:grid; grid-template-columns:.85fr 1.15fr; align-items:center; gap:45px; border-block:1px solid var(--line); }
.knowledge-teaser h2 { font-size:clamp(30px,4vw,44px); line-height:1.05; margin:15px 0; letter-spacing:-1.3px; }
.knowledge-teaser p { max-width:360px; line-height:1.7; font-size:15px; }
.knowledge-teaser-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.knowledge-teaser .knowledge-card-name { font-size:17px; padding-inline:14px; }
.knowledge-teaser .knowledge-card-copy { padding-inline:14px; }
.knowledge-teaser .knowledge-card-art { height:135px; }
.knowledge-teaser .knowledge-card svg { width:90px; height:90px; }
.knowledge-breadcrumb { font-size:13px; display:flex; gap:10px; margin:0 0 24px; }
.knowledge-breadcrumb a { text-underline-offset:4px; }
.knowledge-hero { display:grid; grid-template-columns:1.3fr 1fr; gap:32px; align-items:center; padding:50px; border-radius:28px; background:var(--fruit-paper); }
.knowledge-hero h1 { font-size:clamp(42px,5vw,64px); line-height:1.05; letter-spacing:-2.5px; margin:16px 0; overflow-wrap:anywhere; }
.knowledge-hero p { max-width:490px; font-size:16px; line-height:1.7; }
.knowledge-hero .knowledge-headline { font-size:23px; font-weight:650; line-height:1.25; margin-bottom:15px; }
.knowledge-hero-art { position:relative; display:grid; place-items:center; min-height:270px; }
.knowledge-hero-art svg { width:230px; height:230px; animation:fruit-arrives .7s ease-out both; }
.knowledge-hero-art>span { position:absolute; right:0; bottom:0; transform:rotate(-9deg); font-size:10px; font-weight:750; letter-spacing:1.3px; line-height:1.4; padding:18px; border:1px solid currentColor; border-radius:50%; }
.knowledge-facts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:34px; margin-block:42px; }
.knowledge-step { font-size:12px; letter-spacing:1px; color:var(--muted); }
.knowledge-facts h2 { font-size:21px; line-height:1.3; margin:12px 0; }
.knowledge-facts p { font-size:15px; line-height:1.8; }
.knowledge-aha { display:grid; grid-template-columns:.8fr 1.2fr; gap:40px; padding:32px; background:#f2f7e8; border-radius:22px; align-items:start; }
.knowledge-aha h2 { font-size:30px; line-height:1.1; letter-spacing:-1px; margin:12px 0 0; }
.knowledge-aha summary { cursor:pointer; font-size:18px; font-weight:650; line-height:1.4; padding:4px; }
.knowledge-reveal { display:flex; align-items:center; justify-content:space-between; font-size:11px; font-weight:500; margin-top:12px; }
.knowledge-reveal>span:last-child { display:inline-block; font-size:23px; transition:transform .2s; }
.knowledge-aha details[open] .knowledge-reveal>span:last-child { transform:rotate(45deg); }
.knowledge-aha details>p { margin:18px 0 0; padding-top:18px; border-top:1px solid #cbd8bd; font-size:15px; line-height:1.8; }
.knowledge-recipes { margin:48px 0 32px; }
.knowledge-recipes h2 { font-size:32px; letter-spacing:-1px; margin:12px 0 22px; }
.knowledge-recipes>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.knowledge-recipes a { display:flex; gap:16px; align-items:center; padding:22px; border:1px solid var(--line); border-radius:14px; text-decoration:none; }
.knowledge-recipes a:hover { background:#f4f8e8; }
.knowledge-recipes a>span:first-child { flex:1; font-weight:650; }
.knowledge-recipes small { white-space:nowrap; color:var(--muted); font-size:11px; }
.knowledge-sources { padding:24px 0; border-top:1px solid var(--line); }
.knowledge-sources h2 { font-size:18px; }
.knowledge-sources p,.knowledge-sources li { font-size:13px; line-height:1.8; }
.knowledge-sources ul { padding-left:18px; }
.knowledge-sources a { text-underline-offset:4px; }
.knowledge-sources .knowledge-date { font-size:11px; color:var(--muted); }
.knowledge-next { display:flex; justify-content:space-between; flex-wrap:wrap; gap:15px; margin-top:26px; padding-top:24px; border-top:1px solid var(--line); }
.knowledge-next a { padding-block:10px; font-size:14px; text-underline-offset:5px; }
.recipe-knowledge { margin:28px 0; font-size:13px; }
.recipe-knowledge div { display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.recipe-knowledge a { padding:10px 14px; border:1px solid var(--line); border-radius:30px; text-decoration:none; background:#f3f8e8; }
@keyframes fruit-arrives { from { opacity:0; transform:translateY(14px) rotate(-9deg); } to { opacity:1; transform:translateY(0) rotate(0); } }
@media(max-width:1000px) { .knowledge-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .knowledge-teaser { grid-template-columns:1fr; gap:28px; } .knowledge-teaser p { max-width:570px; } .knowledge-hero { padding:35px; } .knowledge-hero-art svg { width:180px; height:180px; } }
@media(max-width:700px) { .knowledge-intro { padding-top:16px; } .knowledge-intro h1 { letter-spacing:-1.5px; } .knowledge-intro>p { font-size:16px; } .knowledge-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .knowledge-card-art { height:130px; } .knowledge-card svg { width:90px; height:90px; } .knowledge-card-name { font-size:18px; padding:14px 12px 0; overflow-wrap:anywhere; } .knowledge-card-copy { padding:8px 12px 17px; font-size:11px; } .knowledge-search>div { flex-wrap:wrap; } .knowledge-search button { font-size:12px; } .knowledge-hero { grid-template-columns:1fr; gap:6px; padding:28px; } .knowledge-hero-art { min-height:200px; order:-1; } .knowledge-hero-art svg { width:170px; height:170px; } .knowledge-hero-art>span { font-size:8px; padding:14px; } .knowledge-hero h1 { font-size:44px; letter-spacing:-1.8px; } .knowledge-facts { grid-template-columns:1fr; gap:25px; } .knowledge-facts section { border-bottom:1px solid var(--line); padding-bottom:24px; } .knowledge-aha { grid-template-columns:1fr; gap:24px; padding:25px; } .knowledge-recipes>div { grid-template-columns:1fr; } .knowledge-recipes a { padding:18px; } }
@media(max-width:430px) { .knowledge-teaser-grid { grid-template-columns:1fr; } .knowledge-teaser .knowledge-card { display:grid; grid-template-columns:92px 1fr; } .knowledge-teaser .knowledge-card-art { grid-row:1/3; height:110px; } .knowledge-teaser .knowledge-card svg { width:65px; height:65px; } .knowledge-teaser .knowledge-card-name { align-self:end; } .knowledge-teaser .knowledge-card-copy { padding-bottom:14px; } .knowledge-hero h1 { font-size:clamp(30px,9vw,39px); letter-spacing:-1px; } }
@media(prefers-reduced-motion:reduce) { .knowledge-card,.knowledge-card svg,.knowledge-reveal>span:last-child { transition:none; } .knowledge-hero-art svg { animation:none; } .knowledge-card:hover,.knowledge-card:focus-visible,.knowledge-card:hover svg,.knowledge-card:focus-visible svg { transform:none; } }
@media print { .knowledge-hero-art,.knowledge-search,.knowledge-next,.knowledge-teaser { display:none; } .knowledge-hero,.knowledge-facts,.knowledge-aha { display:block; padding:0; background:none; } .knowledge-facts section { break-inside:avoid; } .knowledge-page { max-width:none; } }
@media(max-width:700px) {
  .site-header { flex-wrap:wrap; padding-block:14px; gap:12px; }
  .site-header nav { display:flex; order:3; flex-basis:100%; margin:0; gap:24px; }
  .site-header nav a.nav-link { display:inline-flex; align-items:center; min-height:44px; font-size:12px; }
}
.knowledge-aha details[open] .knowledge-reveal-label { font-size:0; }
.knowledge-aha details[open] .knowledge-reveal-label::after { content:'Antwort zuklappen'; font-size:11px; }
@media print { .recipe-knowledge { display:none; } }