

.kwh-hero-img{display:none}

.kwh-values .kwh-vt{display:flex;flex-direction:column;gap:2px;min-width:0}
.kwh-values .kwh-vt b{display:block}
@media(max-width:820px){
  .kwh-h-mehr{display:none}
  #kwFridge .kwh-tile .kwh-days{display:none!important}
  #kwFridge .kwh-tile .kwh-frist{white-space:nowrap;font-size:11px}
  .kwh-values{grid-template-columns:1fr!important;gap:10px!important}
  .kwh-values .kwh-vt{padding:0!important;background:none!important;border:0!important}
  .kwh-values>div{flex-direction:row!important;text-align:left!important;align-items:center!important;gap:12px!important;background:rgba(255,255,255,.7);border-radius:16px;padding:10px 12px!important}
  .kwh-values-foto{display:block!important;width:52px;height:52px;border-radius:12px;object-fit:cover;margin-left:auto}
  .kw-sz-tiles a b{font-size:14px;font-weight:700}
  .kw-sz-tiles a span{font-size:12px;color:#5b7a4d;font-weight:600}
}

@media(min-width:1100px){
  :root{--kwd-radius:18px;--kwd-card:#ffffff;--kwd-line:rgba(20,30,15,.07)}
  .dark{--kwd-card:rgba(30,33,28,.86);--kwd-line:rgba(255,255,255,.1)}

  body{background:#fbfaf5}
  main#home,.kw-ansicht{max-width:1240px;margin:0 auto;padding:0 20px}
  .kw-ansicht{padding-top:6px}

  #kwHeader{position:sticky;top:0;margin:0 0 14px;border-radius:0 0 22px 22px;background:#ffffff;
    box-shadow:0 2px 16px rgba(90,110,60,.08);padding:8px 26px;min-height:72px;gap:24px}
  .dark #kwHeader{background:rgba(24,27,22,.96)}
  #kwHeader .kwh-brand-full .kwh-logo-horizontal{height:52px}
  #kwHeader .kwh-tagline-full{display:none}
  #kwHeader .kwh-links{display:flex;justify-content:center;gap:4px;overflow:visible;flex:1 1 auto}
  #kwHeader .kwh-links a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 14px 6px;border-radius:12px;
    font-size:12px;font-weight:500;color:#3a3f36;background:none;border-bottom:2px solid transparent;min-width:76px}
  #kwHeader .kwh-links a .kw-nav-i{display:flex;width:22px;height:22px;color:#4a5544}
  #kwHeader .kwh-links a .kw-nav-k{display:none}
  html #kwHeader .kwh-links a.active,html #kwHeader .kwh-links a.active:hover{color:#2c7a33;font-weight:700;background:none!important;box-shadow:none!important;border-bottom-color:#3f9a46;border-radius:12px 12px 0 0}
  #kwHeader .kwh-links a.active .kw-nav-i{color:#3f9a46}
  #kwHeader .kwh-links a:hover{background:rgba(0,0,0,.04)}
  
  #kwHeader .kwh-links a[data-ansicht-link="familie"],#kwHeader .kwh-links a[data-ansicht-link="mehr"]{display:none}
  .dark #kwHeader .kwh-links a{color:#d7ddd2}.dark #kwHeader .kwh-links a .kw-nav-i{color:#c9d1c2}
  .dark #kwHeader .kwh-links a.active{color:#a6d18f;border-bottom-color:#7fb96a}
  #kwHeader .kwh-actions{gap:8px}
  #kwHeader .kwh-actions .kwh-icon{width:40px;height:40px;border-radius:50%;background:#f1f0ea;border:0}
  .dark #kwHeader .kwh-actions .kwh-icon{background:rgba(255,255,255,.08)}
  #kwHeader .kwh-cta{display:none} 

  .kwh-hero-zeile{display:grid;grid-template-columns:1.05fr .9fr 1.05fr;gap:16px;align-items:stretch;margin:0 0 16px}
  .hero.kwh-hero{display:contents} 
  .kwh-hero .kwh-copy{background:linear-gradient(155deg,#ffffff 0%,#f3faf1 100%);border:1px solid var(--kwd-line);border-radius:var(--kwd-radius);padding:24px 24px 18px;display:flex;flex-direction:column;justify-content:center;box-shadow:0 10px 30px rgba(90,130,60,.06)}
  .kwh-hero .eyebrow{font-size:11px;letter-spacing:.14em;color:#2e6b2e;font-weight:700;margin:0 0 8px}
  .kwh-hero h1{font-size:clamp(34px,3vw,44px);line-height:1.02;letter-spacing:-.035em;margin:0 0 12px}
  .kwh-hero .lead{font-size:14.5px;line-height:1.45;max-width:none;margin:0 0 16px}
  .kwh-hero .kwh-btn{align-self:flex-start;background:linear-gradient(135deg,#2e7a35,#266b2c);color:#fff;border-radius:12px;padding:12px 22px;font-size:15px;font-weight:700;box-shadow:0 8px 20px rgba(60,140,65,.28);margin:0 0 16px;transition:transform .12s}
  .kwh-hero .kwh-btn:hover{transform:translateY(-1px)}
  .kwh-benefits{display:flex!important;gap:0!important;margin:0!important;max-width:none}
  .kwh-benefits>div{flex:1;display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;text-align:left!important;padding:6px 10px 6px 0!important;background:none!important;border:0!important;border-right:1px solid var(--kwd-line)!important;border-radius:0!important;margin-right:10px}
  .kwh-benefits>div:last-child{border-right:0!important;margin-right:0}
  .kwh-benefits>div svg{width:24px!important;height:24px!important;flex-shrink:0;color:#2f3a2b}
  .kwh-benefits>div span{font-size:10.5px!important;line-height:1.2;color:#3a3f36}
  .kwh-benefits>div svg{width:22px!important;height:22px!important}
  .kwh-script{display:none}

  .kwh-visual{min-height:380px;position:relative;border-radius:var(--kwd-radius);overflow:hidden;background:#e9eee6}
  .kwh-visual .kwh-hero-img{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
  .kwh-visual .kwh-fridge,.kwh-visual .kwh-feature{display:none}
  .kwh-visual::after{content:"Gutes Essen.\A Bessere Tage. ♥";white-space:pre;position:absolute;left:12px;bottom:14px;
    font-family:"Caveat","Segoe Script","Bradley Hand",cursive;font-size:22px;line-height:1.05;color:#1e3a1a;
    background:rgba(255,255,255,.72);padding:8px 12px;border-radius:12px;transform:rotate(-4deg)}
  
  .kw-hero-foto::before,.kw-hero-foto::after{display:none!important}

  .kwh-hero-zeile #kwFridge{margin:0;padding:18px 18px 14px;border-radius:var(--kwd-radius);background:var(--kwd-card);border:1px solid var(--kwd-line);display:flex;flex-direction:column;gap:12px;box-shadow:0 10px 30px rgba(90,110,60,.06)}
  #kwFridge .kwh-head{display:flex!important;align-items:center;justify-content:space-between;gap:8px;flex-wrap:nowrap!important;margin:0}
  #kwFridge .kwh-head h2{font-size:16px;margin:0;white-space:nowrap;display:flex;align-items:center;gap:8px}
  #kwFridge .kwh-count{font-size:11px;padding:3px 8px}
  #kwFridge .kwh-head>div{display:flex;align-items:center;gap:8px}
  #kwFridge .kwh-head .kwh-badge,#kwFridge #kwCount{font-size:11px;padding:3px 8px}
  #kwFridge .kwh-row{display:flex!important;gap:6px;flex-wrap:nowrap!important;overflow:visible!important;margin:0;flex-shrink:0}
  #kwFridge .kwh-row .kwh-pill{display:none}
  #kwFridge .kwh-row .kwh-alle-btn{display:inline-flex;background:none;border:0;padding:0;font-size:13px;font-weight:600;color:#2c7a33;box-shadow:none}
  #kwFridge .kwh-tiles{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:10px!important;overflow:visible!important}
  #kwFridge .kwh-tile{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px 7px;border-radius:14px;background:#fbfbf7;border:1px solid var(--kwd-line);min-width:0;transition:box-shadow .12s}
  #kwFridge .kwh-tile:hover{box-shadow:0 6px 16px rgba(90,130,60,.10)}
  .dark #kwFridge .kwh-tile{background:rgba(255,255,255,.05)}
  #kwFridge .kwh-tile .kwh-img{width:56px!important;height:56px!important;min-height:0!important;aspect-ratio:1!important;border-radius:12px!important;box-shadow:none!important;background:transparent!important}
  #kwFridge .kwh-tile .kwh-img img{width:100%;height:100%;object-fit:cover;border-radius:12px}
  #kwFridge .kwh-tile .kwh-days{display:none}
  #kwFridge .kwh-tile .kwh-n{font-size:12px!important;font-weight:600;color:#151713;text-align:center;line-height:1.1}
  #kwFridge .kwh-tile .kwh-frist{font-size:10.5px;color:#2c7a33;font-weight:500;white-space:nowrap}
  #kwFridge .kwh-tile .kwh-frist.kwh-due-soon,#kwFridge .kwh-tile .kwh-frist.kwh-due-now{color:#b8792b}
  #kwFridge .kwh-tile.kwh-add{border-style:dashed}
  
  #kwFridge .kwh-tile:nth-child(n+9){display:none}
  #kwFridge .kwh-tile.kwh-add:nth-child(-n+8){display:flex}
  #kwFridgeWarn{margin-top:auto}
  #kwFridgeWarn .kwh-fridge-warn{display:flex;align-items:center;gap:10px;background:#fff6e3;border:1px solid #f5e4b8;color:#946018;border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600;text-decoration:none}
  #kwFridgeWarn .kwh-fridge-warn span{margin-left:auto;color:#2e6b2e}

  .kwh-zeile2{display:grid;grid-template-columns:2.05fr 1fr;gap:16px;align-items:stretch;margin:0 0 16px}
  .kwh-zeile2 #kwHeute{margin:0!important;padding:18px 18px 16px!important;border-radius:var(--kwd-radius);background:var(--kwd-card);border:1px solid var(--kwd-line);box-shadow:0 10px 30px rgba(90,110,60,.06)}
  #kwHeute .kwh-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
  #kwHeute .kwh-head h2{font-size:18px;margin:0}
  #kwHeute .kwh-head p{display:none}
  #kwHeute .kwh-alle-link{font-size:13px;font-weight:600;color:#2c7a33;text-decoration:none;white-space:nowrap}
  #kwHeute .kwh-filters{display:none}
  .kwh-recipes{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;overflow:visible!important}
  .kwh-recipe{border-radius:14px;border:1px solid var(--kwd-line);background:#fff;overflow:hidden;box-shadow:0 6px 16px rgba(90,110,60,.05);transition:transform .12s,box-shadow .12s}
  .kwh-recipe:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(90,110,60,.12)}
  .dark .kwh-recipe{background:rgba(255,255,255,.05)}
  .kwh-recipe .kwh-photo{aspect-ratio:1.45!important;border-radius:0}
  .kwh-recipe .kwh-photo .kwh-meta{display:none!important}
  .kwh-recipe .kwh-meta2{display:flex;gap:12px;font-size:11.5px;color:#5f655b;margin-top:2px}
  .kwh-recipe .kwh-meta2 span{display:inline-flex;align-items:center;gap:4px}
  .kwh-recipe .kwh-body{padding:10px 12px 12px!important;border-top:0!important;gap:6px!important;margin:0!important}
  .kwh-recipe h3{font-size:13.5px!important;line-height:1.25;margin:0!important}
  .kwh-recipe p{display:none!important}
  .kwh-recipe h3{margin-bottom:8px!important}
  .kwh-recipe .kwh-meta2{margin-top:0!important}
  .kwh-recipe .kwh-arrow{display:none!important}
  .kwh-recipe .kwh-heart{width:30px;height:30px;font-size:15px}

  .kwh-zeile2 #kwWerkzeuge{display:block!important;margin:0!important;padding:18px!important;border-radius:var(--kwd-radius);background:var(--kwd-card);border:1px solid var(--kwd-line);box-shadow:0 10px 30px rgba(90,110,60,.06)}
  .kw-sz-hd{margin-bottom:12px}.kw-sz-hd h2{font-size:18px;margin:0}
  .kw-sz-tiles{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
  .kw-sz-tiles a{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center;gap:3px!important;padding:14px 8px!important;border-radius:14px!important;background:#eef9ec!important;border:1px solid #d9f0d3!important;box-shadow:none!important;text-decoration:none;color:#151713;min-height:88px;transition:transform .12s,box-shadow .12s}
  .kw-sz-tiles a:nth-child(2),.kw-sz-tiles a:nth-child(4){background:#fff8ea!important;border-color:#f5e9c4!important}
  .kw-sz-tiles a:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(90,130,60,.12)}
  .kw-sz-tiles a .ksi{width:auto!important;height:auto!important;background:none!important;color:#2c7a33;margin-bottom:2px}
  .kw-sz-tiles a b{font-size:13.5px;font-weight:700}
  .kw-sz-tiles a span{font-size:11.5px;color:#2e6b2e;font-weight:600}
  .dark .kw-sz-tiles a,.dark .kw-sz-tiles a:nth-child(2),.dark .kw-sz-tiles a:nth-child(4){background:rgba(255,255,255,.06)!important;border-color:rgba(255,255,255,.1)!important;color:#eee}
  .dark .kw-sz-tiles a .ksi{color:#a6d18f}

  .kwh-values{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:14px!important;margin:0 0 18px!important;background:none!important;padding:0!important;border:0!important;box-shadow:none!important}
  .kwh-values>div{display:flex!important;flex-direction:row!important;align-items:center!important;text-align:left!important;gap:12px!important;padding:12px 14px!important;background:var(--kwd-card);border:1px solid var(--kwd-line)!important;border-radius:14px;border-right:1px solid var(--kwd-line)!important;box-shadow:0 6px 18px rgba(90,110,60,.05)}
  .kwh-values .kwh-vt{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:2px!important;padding:0!important;background:none!important;border:0!important;border-radius:0!important;flex:1;min-width:0}
  .kwh-values i{width:44px;height:44px;border-radius:14px;background:#eef9ec;color:#2c7a33;flex-shrink:0;margin:0}
  .kwh-values i svg{width:22px;height:22px}
  .kwh-values b{font-size:14px}
  .kwh-values .kwh-vt span{font-size:11.5px;color:#5f655b;line-height:1.3}
  .kwh-values-foto{display:block!important;width:78px;height:60px;border-radius:12px;object-fit:cover;margin-left:auto;flex-shrink:0}

  #kwVerbrauchen{margin:0 0 18px}

  .kwh-hero-zeile>*,.kwh-zeile2>*{min-width:0}
}

@media(min-width:1100px){
  html.dark body,.dark body{background:#15181a}
  html.dark #kwHeader,.dark #kwHeader{background:rgba(24,27,22,.97)!important;box-shadow:0 2px 14px rgba(0,0,0,.4)}
  .dark #kwHeader .kwh-links a{color:#d7ddd2!important}
  .dark #kwHeader .kwh-links a .kw-nav-i{color:#c9d1c2!important}
  html.dark #kwHeader .kwh-links a.active,html.dark #kwHeader .kwh-links a:hover{color:#a6d18f!important;border-bottom-color:#7fb96a!important;background:none!important}
  .dark #kwHeader .kwh-links a.active .kw-nav-i{color:#a6d18f!important}
  .dark .kwh-hero .eyebrow{color:#a6d18f}
  .dark .kwh-benefits>div span,.dark .kwh-benefits>div svg{color:#d7ddd2!important}
  .dark .kwh-benefits>div{border-right-color:rgba(255,255,255,.12)!important}
  .dark #kwFridge .kwh-tile .kwh-n{color:#eef0ea!important}
  .dark #kwFridge .kwh-tile .kwh-frist{color:#a6d18f}
  .dark #kwFridge .kwh-tile .kwh-frist.kwh-due-soon,.dark #kwFridge .kwh-tile .kwh-frist.kwh-due-now{color:#e6b95c}
  .dark #kwFridgeWarn .kwh-fridge-warn{background:rgba(230,185,92,.14);border-color:rgba(230,185,92,.3);color:#e6b95c}
  .dark #kwFridgeWarn .kwh-fridge-warn span,.dark #kwHeute .kwh-alle-link,.dark #kwFridge .kwh-row .kwh-alle-btn{color:#a6d18f}
  .dark .kwh-recipe p{color:#a6d18f}
  .dark .kwh-recipe .kwh-meta2{color:#b4bbad}
  .dark .kwh-values i{background:rgba(166,209,143,.14);color:#a6d18f}
  .dark .kwh-values .kwh-vt span{color:#b4bbad}
  .dark .kw-sz-tiles a b{color:#eef0ea}.dark .kw-sz-tiles a span{color:#a6d18f}
  .dark .kwh-visual::after{color:#1e3a1a}
  .dark .kwh-hero .kwh-copy{background:linear-gradient(155deg,#1c211a 0%,#151913 100%);box-shadow:0 10px 30px rgba(0,0,0,.3)}
  .dark .kwh-hero h1,.dark .kwh-hero .lead{color:#eef0ea}
}

@media(min-width:1500px){
  main#home,.kw-ansicht{max-width:1360px}
  .kwh-hero h1{font-size:48px}
}
