*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --cream:#FDF7EE; --cream-2:#F0E8DA; --green:#3B6B4A; --green-l:#6EA87D; --green-xl:#DCF0E3;
      --terra:#D9622A; --terra-l:#FBF0EA; --text:#251E14; --text-m:#5C5040; --text-l:#9A8F82;
      --white:#FFFFFF; --shadow:0 2px 16px rgba(37,30,20,0.07); --shadow-h:0 8px 40px rgba(37,30,20,0.13); --r:16px;
    }
    html { scroll-behavior: smooth; }
    body { font-family:'DM Sans',sans-serif; background:var(--cream); color:var(--text); line-height:1.65; -webkit-font-smoothing:antialiased; }

    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(20px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .anim { opacity: 0; transform: translateY(25px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
    .anim.visible { opacity: 1; transform: translateY(0); }

    .page-layout { display:grid; grid-template-columns:1fr 300px; gap:2rem; max-width:1120px; margin:0 auto; padding:0 clamp(1rem,4vw,2rem) 3rem; align-items:start; }
    .main-col { min-width:0; }
    .side-col { position:sticky; top:72px; display:flex; flex-direction:column; gap:1.2rem; }

    nav { position:sticky; top:0; z-index:100; background:rgba(253,247,238,0.93); backdrop-filter:blur(14px); border-bottom:1px solid var(--cream-2); display:flex; align-items:center; justify-content:space-between; padding:0 clamp(1rem,5vw,3rem); height:60px; }
    .nav-brand { font-family:'Playfair Display',serif; font-size:1.2rem; font-weight:800; color:var(--green); text-decoration:none; }
    .nav-right { display:flex; align-items:center; gap:10px; }
    .nav-cta { background:var(--green); color:var(--white); border:none; border-radius:99px; padding:8px 20px; font-size:0.82rem; font-family:'DM Sans',sans-serif; font-weight:500; cursor:pointer; text-decoration:none; transition:background 0.2s,transform 0.15s; }
    .nav-cta:hover { background:#2d5239; transform:translateY(-1px); }

    .hero { position:relative; overflow:hidden; padding:clamp(2.5rem,6vw,4rem) clamp(1rem,4vw,2rem) clamp(1.5rem,4vw,2.5rem); text-align:center; background-image:linear-gradient(rgba(253,247,238,0.76),rgba(253,247,238,0.80)),url('/og/hero-bg.webp'); background-size:cover; background-position:center; }
    .hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 55% 60% at 10% 110%,rgba(110,168,125,0.16) 0%,transparent 65%),radial-gradient(ellipse 45% 55% at 92% -5%,rgba(217,98,42,0.09) 0%,transparent 60%); pointer-events:none; }
    .hero-tag { display:inline-flex; align-items:center; gap:6px; background:var(--green-xl); color:var(--green); font-size:0.73rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; border-radius:99px; padding:5px 14px; margin-bottom:1rem; animation:fadeUp 0.5s ease both; }
    .hero h1 { font-family:'Playfair Display',serif; font-size:clamp(1.9rem,4.5vw,3rem); font-weight:800; line-height:1.2; max-width:640px; margin:0 auto 0.9rem; animation:fadeUp 0.5s 0.1s ease both; }
    .hero h1 em { font-style:italic; color:var(--green); }
    .hero-sub { font-size:clamp(0.9rem,1.8vw,1.05rem); color:var(--text-m); max-width:500px; margin:0 auto 1.6rem; animation:fadeUp 0.5s 0.2s ease both; }
    .trust-pills { display:flex; flex-wrap:wrap; justify-content:center; gap:7px; animation:fadeUp 0.5s 0.3s ease both; }
    .trust-pill { background:var(--white); border:1px solid var(--cream-2); border-radius:99px; padding:5px 11px; font-size:0.7rem; color:var(--text-m); font-weight:500; box-shadow:0 1px 4px rgba(0,0,0,0.05); }
    .hero-method { font-size:0.75rem; color:var(--text-l); max-width:580px; margin:1.1rem auto 0; line-height:1.6; animation:fadeUp 0.5s 0.4s ease both; }
    .hero-method strong { color:var(--text-m); font-weight:600; }

    /* AUTHOR BOX */
    .author-box { display:flex; gap:1.2rem; background:var(--white); border-radius:var(--r); box-shadow:var(--shadow); padding:1.3rem; margin-top:2rem; align-items:flex-start; }
    .author-avatar { width:64px; height:64px; flex-shrink:0; border-radius:50%; background:linear-gradient(135deg,var(--green) 0%,var(--green-l) 100%); display:flex; align-items:center; justify-content:center; font-size:1.9rem; box-shadow:0 3px 12px rgba(59,107,74,0.25); }
    .author-label { font-size:0.66rem; font-weight:600; letter-spacing:0.07em; text-transform:uppercase; color:var(--terra); margin-bottom:0.3rem; }
    .author-body h3 { font-family:'Playfair Display',serif; font-size:1.05rem; font-weight:800; margin-bottom:0.4rem; }
    .author-body p { font-size:0.83rem; color:var(--text-m); line-height:1.65; margin-bottom:0.5rem; }
    .author-link { display:inline-flex; align-items:center; gap:5px; font-size:0.78rem; color:var(--green); font-weight:500; text-decoration:none; }
    .author-link:hover { text-decoration:underline; }
    @media (max-width:500px) { .author-box { flex-direction:column; align-items:center; text-align:center; } }

    .filter-bar { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; padding:clamp(2rem,4vw,3rem) clamp(1rem,4vw,2rem) clamp(1.75rem,3vw,2.25rem); animation:fadeUp 0.5s 0.35s ease both; }
    .filter-btn { background:var(--white); border:1.5px solid var(--cream-2); border-radius:99px; padding:6px 15px; font-size:0.8rem; font-family:'DM Sans',sans-serif; color:var(--text-m); font-weight:500; cursor:pointer; transition:all 0.2s; }
    .filter-btn:hover { border-color:var(--green-l); color:var(--green); }
    .filter-btn.active { background:var(--green); color:var(--white); border-color:var(--green); }

    /* ALTERS-EINSTIEGE */
    .age-tiles { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:2rem; }
    .age-tile { background:var(--white); border:1.5px solid var(--cream-2); border-radius:var(--r); padding:1rem 1.1rem; cursor:pointer; text-align:left; font-family:'DM Sans',sans-serif; transition:border-color 0.2s, transform 0.2s, background 0.2s; box-shadow:var(--shadow); }
    .age-tile:hover { border-color:var(--green-l); transform:translateY(-2px); }
    .age-tile.active { border-color:var(--green); background:var(--green-xl); }
    .age-tile .age-emoji { font-size:1.5rem; display:block; margin-bottom:0.4rem; }
    .age-tile strong { font-size:0.9rem; display:block; margin-bottom:0.15rem; color:var(--text); }
    .age-tile span { font-size:0.72rem; color:var(--text-m); line-height:1.45; display:block; }
    @media (max-width:600px) { .age-tiles { grid-template-columns:1fr; gap:8px; } .age-tile { display:flex; align-items:center; gap:12px; padding:0.8rem 1rem; } .age-tile .age-emoji { margin-bottom:0; } }

    .section-label { font-size:0.7rem; font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--terra); margin-bottom:0.7rem; display:flex; align-items:center; gap:8px; }
    .section-label::before { content:''; display:block; width:18px; height:2px; background:var(--terra); border-radius:2px; }

    .featured-card { display:grid; grid-template-columns:1fr 1.1fr; background:var(--white); border-radius:20px; box-shadow:var(--shadow-h); overflow:hidden; text-decoration:none; color:inherit; transition:transform 0.3s,box-shadow 0.3s; margin-bottom:2rem; }
    .featured-card:hover { transform:translateY(-4px); box-shadow:0 14px 52px rgba(37,30,20,0.14); }
    .featured-img { background:linear-gradient(135deg,#3B6B4A 0%,#6EA87D 55%,#A8D4B0 100%); min-height:220px; display:flex; align-items:center; justify-content:center; font-size:4rem; }

    .featured-img-real { width: 100%; height: 100%; object-fit: cover; min-height: 220px; }
    .card-thumb-img { height: 105px; width: 100%; object-fit: cover; display: block; border-bottom: 1px solid var(--cream-2); }

    .featured-body { padding:clamp(1.2rem,2.5vw,1.8rem); display:flex; flex-direction:column; justify-content:center; }
    .featured-cat { display:inline-block; background:var(--green-xl); color:var(--green); font-size:0.68rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; border-radius:99px; padding:3px 10px; margin-bottom:0.7rem; width:fit-content; }
    .featured-body h2 { font-family:'Playfair Display',serif; font-size:clamp(1.15rem,2vw,1.45rem); font-weight:800; line-height:1.25; margin-bottom:0.6rem; }
    .featured-body p { color:var(--text-m); font-size:0.87rem; margin-bottom:1rem; }
    .featured-meta { font-size:0.73rem; color:var(--text-l); display:flex; gap:12px; }
    .read-btn { display:inline-flex; align-items:center; gap:6px; background:var(--green); color:var(--white); border-radius:99px; padding:8px 18px; font-size:0.83rem; font-weight:500; text-decoration:none; transition:background 0.2s,transform 0.15s; margin-top:1rem; width:fit-content; }
    .read-btn:hover { background:#2d5239; transform:translateY(-2px); }

    /* AFFILIATE STRIP */
    .affiliate-strip { background:var(--white); border-radius:18px; box-shadow:var(--shadow); overflow:hidden; margin-bottom:2rem; }
    .aff-strip-head { display:flex; align-items:center; justify-content:space-between; padding:0.9rem 1.2rem 0.6rem; border-bottom:1px solid #F5EEE4; }
    .aff-strip-title { font-size:0.7rem; font-weight:600; letter-spacing:0.07em; text-transform:uppercase; color:var(--text-m); display:flex; align-items:center; gap:5px; }
    .aff-strip-title::before { content:'★'; color:var(--terra); font-size:0.65rem; }
    .aff-disclaimer { font-size:0.6rem; color:var(--text-l); }
    .aff-products { display:grid; grid-template-columns:repeat(4,1fr); }
    .aff-product { padding:1rem 0.9rem; display:flex; flex-direction:column; align-items:center; text-align:center; gap:0.5rem; text-decoration:none; color:inherit; border-right:1px solid #F5EEE4; transition:background 0.2s; }
    .aff-product:last-child { border-right:none; }
    .aff-product:hover { background:var(--cream); }
    .aff-icon { width:48px; height:48px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
    .aff-g { background:var(--green-xl); } .aff-b { background:#E3EEF9; } .aff-o { background:var(--terra-l); } .aff-p { background:#F0EAF8; }
    .aff-product span.name { font-size:0.72rem; font-weight:500; color:var(--text); line-height:1.3; }
    .aff-product small { font-size:0.65rem; color:var(--text-l); }
    .aff-cta { font-size:0.67rem; color:var(--green); font-weight:500; margin-top:auto; }

    /* ARTICLE GRID */
    .grid-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
    .grid-title { font-size:0.7rem; font-weight:600; letter-spacing:0.07em; text-transform:uppercase; color:var(--text-l); }
    .articles-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; }
    .article-card { background:var(--white); border-radius:var(--r); box-shadow:var(--shadow); text-decoration:none; color:inherit; overflow:hidden; display:flex; flex-direction:column; transition:transform 0.25s,box-shadow 0.25s; position:relative; }
    .article-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-h); }
    .card-thumb { height:105px; display:flex; align-items:center; justify-content:center; font-size:2.4rem; }
    .tg { background:linear-gradient(135deg,#E4F5EA,#BFE0CB); } .tb { background:linear-gradient(135deg,#E3EEF9,#BFCFE8); } .to { background:linear-gradient(135deg,#FDF0E6,#F5D3B4); } .tp { background:linear-gradient(135deg,#F0EAF8,#DDD0F0); } .tt { background:linear-gradient(135deg,#FBF0EA,#EDCFC0); } .tr { background:linear-gradient(135deg,#FDEAEA,#F5C0C0); } .tc { background:linear-gradient(135deg,#E3F5F3,#B8E5E0); } .ty { background:linear-gradient(135deg,#FDFBEA,#EEE8B4); }
    .card-thumb-img { height: 105px; width: 100%; object-fit: cover; display: block; border-bottom: 1px solid var(--cream-2); }
    .card-body { padding:0.95rem; flex:1; display:flex; flex-direction:column; }
    .card-cat { font-size:0.66rem; font-weight:600; letter-spacing:0.06em; text-transform:uppercase; color:var(--green); margin-bottom:0.35rem; }
    .card-body h3 { font-family:'Playfair Display',serif; font-size:0.95rem; font-weight:600; line-height:1.35; margin-bottom:0.4rem; }
    .card-body p { font-size:0.79rem; color:var(--text-m); flex:1; }
    .card-footer { display:flex; align-items:center; justify-content:space-between; padding:0.7rem 0.95rem; border-top:1px solid #F5EEE4; font-size:0.7rem; color:var(--text-l); }
    .card-arrow { width:24px; height:24px; border-radius:50%; background:var(--green-xl); color:var(--green); display:flex; align-items:center; justify-content:center; font-size:0.8rem; transition:background 0.2s,transform 0.2s; }
    .article-card:hover .card-arrow { background:var(--green); color:var(--white); transform:translateX(3px); }
    .card-soon { opacity:0.58; pointer-events:none; }
    .soon-badge { position:absolute; top:8px; right:8px; background:rgba(37,30,20,0.5); color:var(--white); font-size:0.6rem; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; border-radius:99px; padding:2px 7px; backdrop-filter:blur(4px); }
    .new-badge { position:absolute; top:8px; right:8px; background:var(--terra); color:var(--white); font-size:0.6rem; font-weight:600; letter-spacing:0.04em; text-transform:uppercase; border-radius:99px; padding:2px 8px; box-shadow:0 2px 8px rgba(217,98,42,0.35); animation:pulse 2s ease-in-out infinite; }
    @keyframes pulse { 0%,100%{opacity:1;} 50%{opacity:0.7;} }

    /* PILLAR GUIDE HERO */
    .pillar-hero { background:linear-gradient(135deg,#2d5239 0%,var(--green) 40%,#4d8a60 100%); border-radius:20px; overflow:hidden; margin-bottom:2rem; box-shadow:var(--shadow-h); position:relative; }
    .pillar-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 50% 60% at 80% 20%, rgba(255,255,255,0.08) 0%, transparent 60%); pointer-events:none; }
    .pillar-inner { padding:clamp(1.5rem,3vw,2.2rem); position:relative; z-index:1; }
    .pillar-badge { display:inline-flex; align-items:center; gap:5px; background:rgba(255,255,255,0.15); border:1px solid rgba(255,255,255,0.25); backdrop-filter:blur(8px); color:var(--white); font-size:0.65rem; font-weight:600; letter-spacing:0.07em; text-transform:uppercase; border-radius:99px; padding:4px 12px; margin-bottom:0.8rem; width:fit-content; }
    .pillar-inner h2 { font-family:'Playfair Display',serif; font-size:clamp(1.3rem,2.5vw,1.7rem); font-weight:800; line-height:1.25; color:var(--white); margin-bottom:0.6rem; }
    .pillar-inner p { color:rgba(255,255,255,0.8); font-size:0.88rem; margin-bottom:1.2rem; line-height:1.55; max-width:580px; }
    .pillar-meta { display:flex; gap:12px; font-size:0.7rem; color:rgba(255,255,255,0.55); margin-bottom:1rem; }
    .pillar-btn { display:inline-flex; align-items:center; gap:6px; background:var(--terra); color:var(--white); border-radius:99px; padding:10px 22px; font-size:0.88rem; font-weight:600; text-decoration:none; transition:background 0.2s,transform 0.15s; width:fit-content; box-shadow:0 4px 15px rgba(217,98,42,0.35); }
    .pillar-btn:hover { background:#c0571f; transform:translateY(-2px); }
    .pillar-topics { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:1rem; }
    .pillar-topic { background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.18); border-radius:99px; padding:3px 10px; font-size:0.68rem; color:rgba(255,255,255,0.85); font-weight:500; }

    /* SIDEBAR */
    .sidebar-newsletter { background:linear-gradient(135deg,#2d5239 0%,var(--green) 100%); border-radius:var(--r); padding:1.3rem; color:var(--white); }
    .sidebar-newsletter h4 { font-family:'Playfair Display',serif; font-size:0.95rem; margin-bottom:0.4rem; }
    .sidebar-newsletter p { font-size:0.75rem; color:rgba(255,255,255,0.72); margin-bottom:0.9rem; }

    .s-input { width:100%; background:rgba(255,255,255,0.15); border:1.5px solid rgba(255,255,255,0.3); border-radius:10px; padding:8px 12px; font-size:0.83rem; color:var(--white); font-family:'DM Sans',sans-serif; margin-bottom:7px; }
    .s-input::placeholder { color:rgba(255,255,255,0.5); }
    .s-input:focus { outline:none; border-color:rgba(255,255,255,0.7); }
    .s-input:disabled { opacity: 0.6; cursor: not-allowed; }

    .s-btn { width:100%; background:var(--terra); color:var(--white); border:none; border-radius:10px; padding:8px; font-size:0.83rem; font-weight:600; font-family:'DM Sans',sans-serif; cursor:pointer; transition:background 0.2s; }
    .s-btn:hover:not(:disabled) { background:#c0571f; }
    .s-btn:disabled { opacity: 0.6; cursor: not-allowed; background: rgba(255,255,255,0.2); color: rgba(255,255,255,0.7); }

    .sidebar-newsletter small { font-size:0.6rem; color:rgba(255,255,255,0.42); display:block; margin-top:5px; }

    .sidebar-app { background:var(--terra-l); border:1.5px dashed rgba(217,98,42,0.3); border-radius:var(--r); padding:1.3rem; text-align:center; }
    .sidebar-app h4 { font-family:'Playfair Display',serif; font-size:0.92rem; margin-bottom:0.35rem; }
    .sidebar-app p { font-size:0.75rem; color:var(--text-m); margin-bottom:0.9rem; }
    .sa-btn { display:block; background:var(--terra); color:var(--white); border-radius:99px; padding:8px 16px; font-size:0.8rem; font-weight:600; text-decoration:none; transition:background 0.2s; }
    .sa-btn:hover { background:#c0571f; }
    .sidebar-app small { font-size:0.65rem; color:var(--text-l); display:block; margin-top:4px; }

    .sidebar-aff { background:var(--white); border-radius:var(--r); box-shadow:var(--shadow); overflow:hidden; }
    .sidebar-aff-head { background:linear-gradient(120deg,var(--green) 0%,#4d8a60 100%); padding:0.9rem 1.1rem; }
    .sidebar-aff-head h4 { font-family:'Playfair Display',serif; color:var(--white); font-size:0.9rem; margin-bottom:0.15rem; }
    .sidebar-aff-head p { color:rgba(255,255,255,0.7); font-size:0.72rem; }
    .s-product { display:flex; gap:11px; align-items:center; padding:0.8rem 1rem; border-bottom:1px solid var(--cream); text-decoration:none; color:inherit; transition:background 0.2s; }
    .s-product:last-of-type { border-bottom:none; }
    .s-product:hover { background:var(--cream); }
    .s-icon { width:38px; height:38px; flex-shrink:0; border-radius:9px; display:flex; align-items:center; justify-content:center; font-size:1.3rem; }
    .s-prod-body { flex:1; min-width:0; }
    .s-prod-body strong { font-size:0.79rem; display:block; line-height:1.3; }
    .s-prod-body span { font-size:0.68rem; color:var(--text-l); }
    .s-arr { font-size:0.7rem; color:var(--green-l); flex-shrink:0; }
    .sidebar-aff-footer { padding:0.55rem 1rem; font-size:0.58rem; color:var(--text-l); border-top:1px solid var(--cream); background:var(--cream); }

    /* FAQ */
    .faq-section { margin:2rem 0; }
    .faq-section h2 { font-family:'Playfair Display',serif; font-size:clamp(1.25rem,2.5vw,1.6rem); margin-bottom:1.1rem; }
    .faq-item { background:var(--white); border-radius:12px; margin-bottom:7px; box-shadow:var(--shadow); overflow:hidden; }
    .faq-q { width:100%; text-align:left; background:none; border:none; padding:0.95rem 1.1rem; display:flex; align-items:center; justify-content:space-between; font-family:'DM Sans',sans-serif; font-size:0.88rem; font-weight:600; color:var(--text); cursor:pointer; gap:1rem; }
    .faq-icon { width:23px; height:23px; flex-shrink:0; background:var(--green-xl); color:var(--green); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.85rem; transition:transform 0.3s,background 0.2s; }
    .faq-item.open .faq-icon { transform:rotate(45deg); background:var(--green); color:var(--white); }
    .faq-a { max-height:0; overflow:hidden; transition:max-height 0.4s cubic-bezier(0.4,0,0.2,1),padding 0.3s; padding:0 1.1rem; font-size:0.85rem; color:var(--text-m); line-height:1.7; }
    .faq-item.open .faq-a { max-height:400px; padding-bottom:1rem; }
    .faq-a a { color:var(--green); text-underline-offset:3px; }

    .disclaimer { background:var(--cream-2); border-radius:var(--r); padding:1rem 1.2rem; font-size:0.76rem; color:var(--text-m); line-height:1.6; margin-top:1.5rem; }

    footer { border-top:1px solid var(--cream-2); padding:1.4rem clamp(1rem,5vw,3rem); display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:1rem 1.5rem; font-size:0.74rem; color:var(--text-l); margin-top:1rem; }
    footer a { color:var(--text-l); text-decoration:none; }
    footer a:hover { color:var(--green); }

    @media (max-width:860px) {
      .page-layout { grid-template-columns:1fr; }
      .side-col { position:static; flex-direction:row; flex-wrap:wrap; }
      .side-col > * { flex:1; min-width:260px; }
      .aff-products { grid-template-columns:repeat(2,1fr); }
      .featured-card { grid-template-columns:1fr; }
      .featured-img { min-height:130px; }
    }
    @media (max-width:500px) {
      .side-col > * { min-width:100%; }
    }
      .article-card-guide { border:2px solid var(--green); }
    .guide-badge { position:absolute; top:8px; right:8px; background:var(--green); color:#fff; font-size:0.62rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; border-radius:99px; padding:3px 9px; box-shadow:0 2px 8px rgba(59,107,74,0.35); }
    .sidebar-guide { display:block; background:linear-gradient(135deg,#2d5239 0%,var(--green) 100%); border-radius:var(--r); padding:1.3rem; color:#fff; text-decoration:none; }
    .sidebar-guide .sg-badge { display:inline-block; background:rgba(255,255,255,0.16); border:1px solid rgba(255,255,255,0.28); color:#fff; font-size:0.6rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; border-radius:99px; padding:3px 10px; margin-bottom:0.6rem; }
    .sidebar-guide h4 { font-family:'Playfair Display',serif; font-size:1rem; margin-bottom:0.35rem; color:#fff; }
    .sidebar-guide p { font-size:0.75rem; color:rgba(255,255,255,0.82); margin-bottom:0.8rem; line-height:1.5; }
    .sidebar-guide .sg-cta { font-size:0.82rem; font-weight:600; color:#fff; }
    .sidebar-guide:hover .sg-cta { text-decoration:underline; }