:root { --bg-color:#fcf1eb; --text-main:#2f3a3b; --text-muted:#7b8889; --primary:#244b4e; --accent:#c47c50; --card-bg:#ffffff; --border:#e8e6e1; }
body { font-family:'Nunito',sans-serif; background-color:var(--bg-color); color:var(--text-main); margin:0; padding:0; line-height:1.7; }
header { background-color:var(--card-bg); padding:15px 20px; box-shadow:0 2px 10px rgba(0,0,0,0.05); position:sticky; top:0; z-index:100; display:flex; justify-content:space-between; align-items:center; }
.logo-link { text-decoration:none; color:var(--primary); font-weight:900; font-size:1.3rem; display:flex; align-items:center; gap:8px; }
.back-btn { background:var(--bg-color); color:var(--accent); text-decoration:none; padding:8px 16px; border-radius:20px; font-weight:700; font-size:0.9rem; }
article { max-width:720px; margin:40px auto; padding:0 20px; }
.article-header { text-align:center; margin-bottom:40px; }
.category-tag { display:inline-block; background:#fff3ec; color:var(--accent); padding:4px 12px; border-radius:20px; font-size:0.85rem; font-weight:800; text-transform:uppercase; letter-spacing:0.05em; margin-bottom:15px; border:1px solid #f5cdb2; }
h1 { font-size:2.2rem; color:var(--primary); line-height:1.3; margin-bottom:15px; font-weight:900; }
.author-info { display:flex; align-items:center; justify-content:center; gap:10px; font-size:0.95rem; color:var(--text-muted); font-weight:600; flex-wrap:wrap; }
.author-pic { width:40px; height:40px; background-color:var(--accent); color:white; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.content h2 { font-size:1.6rem; color:var(--primary); margin-top:45px; margin-bottom:15px; font-weight:800; }
.content h3 { font-size:1.3rem; color:var(--accent); margin-top:30px; margin-bottom:10px; }
.content p { margin-bottom:20px; font-size:1.05rem; }
.content ul,.content ol { margin-bottom:25px; padding-left:20px; }
.content li { margin-bottom:12px; font-size:1.05rem; }
.highlight-box { background-color:#eaf1f1; border-left:4px solid var(--primary); padding:20px; border-radius:0 12px 12px 0; margin:30px 0; color:var(--primary); }
.warning-box { background-color:#ffebee; border-left:4px solid #c62828; padding:20px; border-radius:0 12px 12px 0; margin:30px 0; }
.science-box { background-color:#fff3ec; border:1px solid #f5cdb2; padding:25px; border-radius:12px; margin:30px 0; }
.science-box h3 { margin-top:0; display:flex; align-items:center; gap:8px; color:#a6653f; }
.ampel-grid { display:grid; grid-template-columns:1fr; gap:14px; margin:25px 0; }
.ampel-item { padding:16px 18px; border-radius:12px; display:flex; align-items:flex-start; gap:14px; }
.ampel-item.red { background:#ffebee; border:1px solid #f5c0c0; }
.ampel-item.yellow { background:#fff8f0; border:1px solid #f5cdb2; }
.ampel-item.green { background:#eaf1f1; border:1px solid #d3e1df; }
.ampel-icon { font-size:1.6rem; flex-shrink:0; line-height:1.4; }
.ampel-label { font-weight:800; display:block; margin-bottom:3px; }
.sources-section { background-color:#f7f9f9; padding:20px 25px; border-radius:12px; margin-top:40px; font-size:0.9rem; color:var(--text-muted); border:1px solid #e8e6e1; }
.sources-section h4 { margin-top:0; color:var(--primary); font-size:1.1rem; margin-bottom:10px; }
.sources-section ol { padding-left:20px; margin:0; }
.sources-section li { margin-bottom:8px; font-size:0.85rem; }
.sources-section a { color: var(--primary); text-decoration: underline; }
.cta-box { background:linear-gradient(135deg,var(--primary),#3a6b6f); color:white; padding:40px 30px; border-radius:20px; text-align:center; margin-top:50px; box-shadow:0 10px 30px rgba(36,75,78,0.2); }
.cta-box h2 { color:white; margin-top:0; font-size:1.8rem; }
.cta-box p { color:#eaf1f1; font-size:1.1rem; margin-bottom:25px; }
.cta-btn { display:inline-block; background-color:var(--accent); color:white; padding:16px 32px; border-radius:30px; font-size:1.1rem; font-weight:800; text-decoration:none; box-shadow:0 4px 15px rgba(196,124,80,0.4); transition:transform 0.2s; }
.cta-btn:hover { transform: translateY(-2px); }
.share-buttons { display:flex; gap:10px; flex-wrap:wrap; margin-top:50px; padding-top:20px; border-top:1px solid var(--border); }
.share-buttons strong { width:100%; font-size:0.95rem; color:var(--text-muted); margin-bottom:5px; }
.share-btn { color:white; text-decoration:none; padding:10px 16px; border-radius:20px; font-weight:700; font-size:0.9rem; display:inline-flex; align-items:center; gap:6px; border:none; cursor:pointer; font-family:inherit; transition:transform 0.2s; }
.share-btn:hover { transform: translateY(-2px); }
.share-wa { background:#25D366; }
.share-pi { background:#E60023; }
.share-copy { background:#e8e6e1; color:var(--text-main); }
.related-articles { margin-top:40px; margin-bottom:20px; }
.related-articles h3 { color:var(--primary); font-size:1.4rem; border-bottom:2px solid var(--bg-color); padding-bottom:8px; margin-bottom:20px; margin-top:0; }
.related-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; }
.related-card { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:16px; text-decoration:none; color:var(--text-main); display:flex; flex-direction:column; transition:transform 0.2s, box-shadow 0.2s; }
.related-card:hover { transform:translateY(-3px); box-shadow:0 6px 20px rgba(0,0,0,0.05); border-color:var(--primary); }
.related-tag { font-size:0.75rem; font-weight:800; color:var(--accent); text-transform:uppercase; margin-bottom:8px; }
.related-title { font-size:1.1rem; font-weight:800; color:var(--primary); margin:0 0 10px; line-height:1.3; }
.related-readmore { font-size:0.85rem; font-weight:800; color:var(--accent); margin-top:auto; }
.disclaimer-box { background:#f9f8f6; border-left:4px solid #d3d0c9; padding:16px 18px; border-radius:0 10px 10px 0; margin-top:30px; font-size:0.85rem; color:var(--text-muted); line-height:1.6; }
.deep-dive { display:flex; align-items:center; gap:14px; background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:14px 18px; margin:20px 0; text-decoration:none; color:var(--text-main); transition:transform 0.2s, box-shadow 0.2s; }
.deep-dive:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.05); border-color:var(--accent); }
.deep-dive-icon { font-size:1.8rem; flex-shrink:0; }
.deep-dive-text { flex:1; }
.deep-dive-title { font-weight:800; color:var(--primary); font-size:0.95rem; display:block; margin-bottom:2px; }
.deep-dive-desc { font-size:0.85rem; color:var(--text-muted); }
.deep-dive-arrow { color:var(--accent); font-weight:800; font-size:1.2rem; }
.food-table { width:100%; border-collapse:collapse; margin:25px 0; background:var(--card-bg); border-radius:12px; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,0.04); font-size:0.95rem; }
.food-table th { background:var(--primary); color:white; text-align:left; padding:12px 14px; font-size:0.9rem; }
.food-table td { padding:12px 14px; border-bottom:1px solid var(--border); vertical-align:top; }
.food-table tr:last-child td { border-bottom:none; }
.header-nav { display:flex; align-items:center; gap:10px; }
.nav-link { color:var(--primary); text-decoration:none; font-weight:700; font-size:0.9rem; padding:8px 10px; }
.nav-cta { background:var(--primary); color:#fff; text-decoration:none; padding:8px 18px; border-radius:20px; font-weight:800; font-size:0.9rem; transition:transform 0.2s; }
.nav-cta:hover { transform:translateY(-1px); }
.page-layout { display:grid; grid-template-columns:minmax(0,720px) 300px; gap:2.5rem; max-width:1100px; margin:0 auto; padding:0 20px; align-items:start; justify-content:center; }
.page-layout article { margin:40px 0; padding:0; max-width:none; min-width:0; }
.side-col { position:sticky; top:80px; display:flex; flex-direction:column; gap:1.2rem; margin-top:40px; }
.sidebar-box { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:18px; }
.sidebar-box h4 { margin:0 0 6px; color:var(--primary); font-size:1.05rem; }
.sidebar-box > p { margin:0 0 12px; font-size:0.85rem; color:var(--text-muted); }
.sidebar-app { background:linear-gradient(135deg,var(--primary),#3a6b6f); border:none; text-align:center; }
.sidebar-app h4 { color:#fff; }
.sidebar-app > p { color:#dcebe9; }
.sa-btn { display:block; background:var(--accent); color:#fff; text-decoration:none; font-weight:800; border-radius:20px; padding:10px 16px; font-size:0.95rem; margin-bottom:8px; }
.sidebar-app small { color:#c5dbd9; font-size:0.72rem; }
.s-product { display:flex; align-items:center; gap:10px; padding:9px 0; text-decoration:none; color:var(--text-main); border-bottom:1px solid var(--border); }
.s-product:last-of-type { border-bottom:none; }
.s-icon { width:34px; height:34px; border-radius:8px; background:var(--bg-color); display:flex; align-items:center; justify-content:center; font-size:1.1rem; flex-shrink:0; }
.s-prod-body { display:flex; flex-direction:column; min-width:0; }
.s-prod-body strong { font-size:0.82rem; line-height:1.3; }
.s-prod-body span { font-size:0.72rem; color:var(--text-muted); }
.s-arr { margin-left:auto; color:var(--accent); font-weight:800; }
.aff-note { font-size:0.68rem; color:var(--text-muted); margin-top:10px; line-height:1.4; }
.side-related a { display:block; padding:9px 0; border-bottom:1px solid var(--border); text-decoration:none; }
.side-related a:last-of-type { border-bottom:none; }
.side-rel-tag { display:block; font-size:0.68rem; font-weight:800; color:var(--accent); text-transform:uppercase; letter-spacing:0.04em; }
.side-rel-title { font-size:0.88rem; font-weight:800; color:var(--primary); line-height:1.35; }
.article-hero-img { width: 100%; max-width: 720px; margin: 0 auto 30px; display: block; border-radius: 16px; overflow: hidden; }
.article-hero-img img { width: 100%; height: auto; display: block; }
.sidebar-guide { display:block;background:linear-gradient(135deg,#2d5239 0%,#3B6B4A 100%);border-radius:12px;padding:18px;color:#fff;text-decoration:none }
.sidebar-guide .sg-badge { display:inline-block;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);color:#fff;font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:99px;padding:3px 10px;margin-bottom:.6rem }
.sidebar-guide h4 { font-size:1rem;margin:0 0 .35rem;color:#fff }
.sidebar-guide p { font-size:.78rem;color:rgba(255,255,255,.82);margin:0 0 .8rem;line-height:1.5 }
.sidebar-guide .sg-cta { font-size:.82rem;font-weight:700;color:#fff }
.sidebar-guide:hover .sg-cta { text-decoration:underline }
.breadcrumb { font-size:0.85rem;color:var(--text-muted);margin-bottom:14px;line-height:1.5; }
.breadcrumb a { color:var(--accent);text-decoration:none;font-weight:700; }
.breadcrumb a:hover { text-decoration:underline; }
.breadcrumb span { color:var(--text-muted); }
.step-box { background:var(--card-bg); border:1px solid var(--border); border-radius:12px; padding:18px 20px; margin:12px 0; display:flex; align-items:flex-start; gap:14px; }
.step-num { background:var(--primary); color:white; width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:0.9rem; flex-shrink:0; }
.recipe-box { background:var(--card-bg); border:2px solid var(--border); border-radius:14px; padding:20px; margin:16px 0; }
.recipe-box h4 { color:var(--primary); margin:0 0 8px; font-size:1.05rem; }
.recipe-box p { font-size:0.92rem; margin-bottom:8px; }
.recipe-meta { font-size:0.8rem; color:var(--text-muted); margin-bottom:10px; }
.back-btn:hover { background: #f5cdb2; }
.content ul, .content ol { margin-bottom: 25px; padding-left: 20px; }
.checklist { list-style: none; padding-left: 0; }
.checklist li { padding: 12px 16px; margin-bottom: 8px; border-radius: 10px; display: flex; align-items: flex-start; gap: 12px; font-size: 1.05rem; }
.checklist li.true-sign { background: #eaf1f1; border: 1px solid #d3e1df; }
.checklist li.false-sign { background: #fff8f6; border: 1px solid #f5cdb2; }
.check-icon { font-size: 1.3rem; flex-shrink: 0; line-height: 1.4; }
.sources-section a:hover { color: var(--accent); text-decoration-color: var(--accent); }
footer { text-align: center; padding: 40px 20px; color: var(--text-muted); font-size: 0.9rem; border-top: 1px solid #e8e6e1; margin-top: 60px; }
.article-hero-img svg { width: 100%; height: auto; display: block; }
.infographic { width: 100%; margin: 30px auto; border-radius: 16px; overflow: hidden; border: 1px solid var(--border); }
.infographic svg { width: 100%; height: auto; display: block; }
.content ul { margin-bottom: 25px; padding-left: 20px; }
.article-image { width: 100%;
            height: auto;
            border-radius: 12px;
            margin: 30px 0;
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
            border: 1px solid var(--border, #e8e6e1); }
.seed-card { background:var(--card-bg); border:2px solid var(--border); border-radius:14px; padding:22px; margin:18px 0; }
.seed-card h3 { margin-top:0; display:flex; align-items:center; gap:10px; font-size:1.25rem; color:var(--primary); }
.seed-meta { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px; }
.seed-badge { font-size:0.75rem; font-weight:800; padding:3px 10px; border-radius:12px; }
.seed-badge.green { background:#eaf1f1; color:var(--primary); }
.seed-badge.yellow { background:#fff8f0; color:#a6653f; }
.seed-badge.red { background:#ffebee; color:#c62828; }
.danger-card { background:var(--card-bg); border:1px solid var(--border); border-radius:14px; padding:20px; margin:16px 0; display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:start; }
.danger-icon { font-size:2.2rem; }
.danger-title { font-weight:800; color:#c62828; font-size:1.05rem; margin-bottom:4px; }
.danger-why { font-size:0.92rem; color:var(--text-main); margin-bottom:8px; }
.danger-safe { font-size:0.9rem; color:var(--primary); background:#eaf1f1; padding:8px 12px; border-radius:8px; display:inline-block; }
.danger-safe strong { color:var(--primary); }
.inline-app-link { background: #fff3ec;
            color: var(--accent);
            padding: 6px 14px;
            border-radius: 20px;
            font-weight: 800;
            font-size: 0.9rem;
            text-decoration: none;
            display: inline-block;
            border: 1px solid #f5cdb2;
            transition: transform 0.2s, background 0.2s;
            margin-top: 8px; }
.inline-app-link:hover { background: #f5cdb2;
            transform: translateY(-1px); }
.drink-table { width: 100%; border-collapse: collapse; margin: 25px 0; font-size: 0.95rem; border-radius: 12px; overflow: hidden; border: 1px solid var(--border); }
.drink-table th { background: var(--primary); color: white; padding: 12px 14px; text-align: left; font-weight: 700; font-size: 0.85rem; letter-spacing: 0.03em; }
.drink-table td { padding: 11px 14px; border-bottom: 1px solid var(--border); vertical-align: top; }
.drink-table tr:last-child td { border-bottom: none; }
.drink-table tr:nth-child(even) { background: #f9f8f6; }
.badge-ok { background: #eaf1f1; color: var(--primary); padding: 2px 8px; border-radius: 10px; font-size: 0.75rem; font-weight: 700; }
.badge-warn { background: #fff3ec; color: #a6653f; padding: 2px 8px; border-radius: 10px; font-size: 0.75rem; font-weight: 700; }
.badge-no { background: #ffebee; color: #c62828; padding: 2px 8px; border-radius: 10px; font-size: 0.75rem; font-weight: 700; }
.science-box h2, .science-box h3 { margin-top: 0; display: flex; align-items: center; gap: 8px; color: #a6653f; font-size: 1.4rem; margin-bottom: 12px; }
.disclaimer { max-width: 700px; margin: 0 auto 25px; background: rgba(123, 136, 137, 0.08); padding: 15px; border-radius: 8px; font-size: 0.75rem; line-height: 1.5; color: #7b8889; text-align: justify; }
.alert-box { background-color: #ffebee; border-left: 4px solid #c62828; padding: 20px; border-radius: 0 12px 12px 0; margin: 30px 0; color: #c62828; }
.snack-card { background:var(--card-bg); border:1px solid var(--border); border-radius:14px; padding:18px 20px; margin:14px 0; display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:start; }
.snack-icon { font-size:2rem; }
.snack-name { font-weight:800; color:var(--primary); font-size:1.05rem; margin-bottom:3px; }
.snack-age { font-size:0.78rem; color:var(--accent); font-weight:700; margin-bottom:6px; }
.snack-desc { font-size:0.92rem; color:var(--text-main); margin-bottom:6px; }
.snack-why { font-size:0.85rem; color:var(--text-muted); font-style:italic; }
.toc { background: var(--card-bg); border: 1px solid var(--border); border-radius: 16px; padding: 25px 30px; margin: 30px 0 40px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); }
.toc h3 { margin-top: 0; color: var(--primary); font-size: 1.2rem; margin-bottom: 15px; }
.toc ol { padding-left: 20px; margin: 0; counter-reset: toc; }
.toc li { margin-bottom: 8px; font-size: 1rem; font-weight: 600; }
.toc a { color: var(--accent); text-decoration: none; transition: color 0.2s; }
.toc a:hover { color: var(--primary); text-decoration: underline; }

@media(max-width:600px) { h1{font-size:1.8rem;} .content h2{font-size:1.4rem;} .cta-box{padding:30px 20px;} .food-table{font-size:0.85rem;} .food-table th,.food-table td{padding:9px 10px;} }
@media(max-width:980px){ .page-layout{ grid-template-columns:1fr; } .side-col{ position:static; margin-top:0; } }
@media(max-width:600px){ .nav-link{ display:none; } }
@media(max-width:600px) { h1{font-size:1.8rem;} .content h2{font-size:1.4rem;} .cta-box{padding:30px 20px;} }
@media(max-width:600px) { h1{font-size:1.7rem;} .content h2{font-size:1.4rem;} .cta-box{padding:30px 20px;} }
@media (max-width: 600px) { h1 { font-size: 1.8rem; } .content h2 { font-size: 1.4rem; } .cta-box { padding: 30px 20px; } }
@media(max-width:600px) { h1{font-size:1.8rem;} .content h2{font-size:1.4rem;} .cta-box{padding:30px 20px;} .danger-card{grid-template-columns:1fr;} }
@media (max-width: 600px) { h1 { font-size: 1.8rem; } .content h2 { font-size: 1.4rem; } .cta-box { padding: 30px 20px; } .drink-table { font-size: 0.82rem; } .drink-table th, .drink-table td { padding: 8px 10px; } }
@media(max-width:600px) { h1{font-size:1.8rem;} .content h2{font-size:1.4rem;} .cta-box{padding:30px 20px;} .snack-card{grid-template-columns:1fr;} }
@media (max-width: 600px) { h1 { font-size: 1.8rem; } .content h2 { font-size: 1.4rem; } .cta-box { padding: 30px 20px; } .deep-dive { flex-direction: column; align-items: flex-start; gap: 8px; } }

/* === Affiliate-Box im Hauptseiten-Design (2026-07-08) === */
.sidebar-aff { background:#ffffff; border:1px solid var(--border); border-radius:12px; overflow:hidden; }
.sidebar-aff-head { background:linear-gradient(120deg,#3B6B4A 0%,#4d8a60 100%); padding:14px 16px; }
.sidebar-aff-head h4 { color:#fff; font-size:1.05rem; margin:0 0 2px; }
.sidebar-aff-head p { color:rgba(255,255,255,0.82); font-size:0.78rem; margin:0; }
.sidebar-aff .s-product { padding-left:14px; padding-right:14px; }
.sidebar-aff-footer { padding:10px 14px; font-size:0.68rem; color:var(--text-muted); border-top:1px solid var(--border); background:#faf9f7; line-height:1.4; }
.s-icon.aff-g { background:#DCF0E3; }
.s-icon.aff-b { background:#E3EEF9; }
.s-icon.aff-o { background:#FBF0EA; }
.s-icon.aff-p { background:#F0EAF8; }
