/*
Theme Name: Landfleischerei Klaus
Theme URI: https://www.die-landfleischerei.de
Author: Basti (für Martin Klaus, Landfleischerei Klaus)
Description: Eigenständiges, schlankes Theme für die Landfleischerei Klaus (Hofladen Versmold/Bockhorst). Design 1:1 aus dem finalen HTML/CSS-Entwurf übernommen.
Version: 1.1.6
Requires PHP: 7.4
Text Domain: landfleischerei-klaus
*/

@font-face{
  font-family:'Boecklins Universe';
  src:url('assets/fonts/boecklins-universe.woff2') format('woff2'),
      url('assets/fonts/boecklins-universe.ttf') format('truetype');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}

:root{
    --kohle:#211c17;
    --papier:#f3ead9;
    --papier-dunkel:#e9dcc4;
    --rauchbraun:#4a342a;
    --messing:#a8763e;
    --ochsenblut:#448e29;
    --ochsenblut-dunkel:#386f22;
    --waldgruen:#445635;
    --weiss:#fffaf1;
  }

*{box-sizing:border-box;}

html{scroll-behavior:smooth;}

body{
    margin:0;
    background:var(--papier);
    color:var(--kohle);
    font-family:'Work Sans', sans-serif;
    font-size:17px;
    line-height:1.6;
  }

h1,h2,h3,h4{
    font-family:'Bitter', serif;
    margin:0 0 .4em 0;
    line-height:1.15;
    color:var(--kohle);
  }

a{color:inherit;}

img{max-width:100%;display:block;}

.eyebrow{
    font-family:'Space Mono', monospace;
    text-transform:uppercase;
    letter-spacing:.14em;
    font-size:.78rem;
    color:var(--messing);
    font-weight:700;
    margin-bottom:.6em;
  }

.wrap{max-width:1180px;margin:0 auto;padding:0 28px;}

/* Topbar */
  .topbar{
    background:var(--kohle);
    color:var(--papier);
    font-size:.85rem;
  }

.topbar .wrap{
    display:flex;flex-wrap:wrap;gap:10px 24px;
    justify-content:space-between;align-items:center;
    padding-top:9px;padding-bottom:9px;
  }

.topbar a{text-decoration:none;color:var(--papier);}

.topbar .hours{opacity:.75;}

/* Header */
  header.site{
    background:var(--papier);
    border-bottom:3px solid var(--kohle);
    position:sticky;top:0;z-index:50;
  }

header.site .wrap{
    display:flex;align-items:center;justify-content:space-between;
    padding-top:16px;padding-bottom:16px;gap:24px;
    max-width:1360px;
  }

.brand{display:flex;align-items:center;gap:14px;text-decoration:none;flex-shrink:0;}

.brand-mark{
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
  }

.brand-mark img{
    height:82px;width:auto;display:block;
  }

.brand-text{font-family:'Boecklins Universe','UnifrakturCook',serif;font-weight:400;font-size:1.9rem;line-height:1;color:var(--kohle);}

.brand-text span{display:block;font-family:'Space Mono';font-weight:400;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase;color:var(--rauchbraun);margin-top:6px;}

nav.main{background:var(--papier-dunkel);padding:9px 22px;border-radius:10px;margin:0 auto;}

nav.main ul{list-style:none;display:flex;row-gap:6px;column-gap:24px;margin:0;padding:0;flex-wrap:wrap;align-items:center;}

nav.main a{
    text-decoration:none;font-weight:600;font-size:.95rem;
    padding-bottom:4px;border-bottom:2px solid transparent;
  }

nav.main a:hover{border-bottom-color:var(--messing);}

.btn{
    display:inline-block;background:var(--ochsenblut);color:var(--weiss);
    font-weight:600;font-size:.9rem;text-decoration:none;
    padding:12px 22px;border-radius:2px;border:1px solid var(--ochsenblut);
    transition:background .15s;
  }

.btn:hover{background:var(--ochsenblut-dunkel);}

.btn.outline{background:transparent;color:var(--kohle);border-color:var(--kohle);}

.btn.outline:hover{background:var(--kohle);color:var(--papier);}

.btn-cta{
    display:inline-flex;align-items:center;gap:11px;
    white-space:nowrap;flex-shrink:0;
    padding:13px 26px 13px 20px;
  }

.btn-cta svg{flex-shrink:0;}

.nav-toggle{display:none;}

/* Hero */
  .hero{position:relative;color:var(--weiss);}

.hero-img{
    height:78vh;min-height:480px;max-height:700px;
    background-size:cover;background-position:center 65%;
    display:flex;align-items:flex-end;
    background-image:linear-gradient(0deg, rgba(15,11,8,.86) 0%, rgba(15,11,8,.25) 55%, rgba(15,11,8,.1) 100%),
      url('https://www.die-landfleischerei.de/wp-content/uploads/2018/06/Laden1-scaled.jpg');
  }

.hero-content{padding:0 0 60px 0;max-width:640px;}

.hero-ctas{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap;}

.hero-ctas .btn.outline{color:var(--weiss);border-color:var(--weiss);}

.hero-ctas .btn.outline:hover{background:var(--weiss);color:var(--kohle);}

/* USP strip */
  .usp{background:var(--rauchbraun);color:var(--papier);}

.usp .wrap{
    display:grid;grid-template-columns:repeat(4,1fr);gap:0;
  }

.usp-item{padding:26px 24px;border-left:1px solid rgba(255,255,255,.15);}

.usp-item:first-child{border-left:none;}

.usp-item h4{color:var(--papier);font-size:1rem;margin-bottom:.3em;}

.usp-item p{margin:0;font-size:.88rem;opacity:.8;}

section{padding:76px 0;}

.section-head{max-width:640px;margin-bottom:44px;}

.section-head p{color:var(--rauchbraun);}

/* Automat */
  .automat{background:var(--kohle);color:var(--papier);}

.automat .grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}

.automat img{border:3px solid var(--messing);}

.automat .eyebrow{color:var(--messing);}

.automat h2{color:var(--papier);}

.automat p{opacity:.85;}

.automat .tag-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}

.tag{
    font-family:'Space Mono';font-size:.74rem;letter-spacing:.05em;
    border:1px solid var(--messing);color:var(--messing);
    padding:5px 11px;border-radius:20px;text-transform:uppercase;
  }

/* Allstars grid */
  .allstars-grid{
    display:grid;grid-template-columns:repeat(auto-fill, minmax(240px,1fr));
    gap:26px;
  }

.product-card{
    background:var(--weiss);border:1px solid var(--papier-dunkel);
    text-decoration:none;color:var(--kohle);
    display:flex;flex-direction:column;overflow:hidden;
  }

.product-card img{height:170px;object-fit:cover;}

.product-card .pc-body{padding:16px 18px 20px;}

.product-card h4{font-size:1.02rem;margin-bottom:.35em;}

.product-card p{font-size:.86rem;color:var(--rauchbraun);margin:0;}

.product-card .read{
    margin-top:12px;font-family:'Space Mono';font-size:.72rem;
    text-transform:uppercase;letter-spacing:.06em;color:var(--messing);font-weight:700;
  }

.allstars-more{text-align:center;margin-top:40px;}

/* Vorbestellung */
  .vorbestellung{background:var(--papier-dunkel);}

.vorbestellung .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}

.vorbestellung img{border-radius:50%;width:220px;height:220px;object-fit:cover;border:3px solid var(--messing);margin:0 auto;}

.vorbestellung blockquote{
    font-family:'Bitter';font-size:1.3rem;font-weight:600;margin:0 0 20px;
    border-left:4px solid var(--ochsenblut);padding-left:20px;
  }

/* Chalkboard markets */
  .maerkte{background:var(--waldgruen);color:var(--papier);}

.maerkte .section-head p{color:var(--papier);opacity:.85;}

.chalkboard{
    background:#2b2f27;
    border:14px solid #6b4a30;
    border-radius:4px;
    padding:38px 40px;
    box-shadow:0 18px 40px rgba(0,0,0,.35);
  }

.chalkboard h3{
    font-family:'Caveat', cursive;font-size:2.4rem;color:#f4efe4;
    font-weight:700;margin-bottom:.5em;
  }

.market-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 40px;}

.market-list li{
    font-family:'Caveat', cursive;font-size:1.5rem;color:#f4efe4;
    border-bottom:1px dashed rgba(244,239,228,.35);padding-bottom:10px;
    display:flex;justify-content:space-between;gap:12px;
  }

.market-list li span:last-child{color:#d8c9a3;}

/* Herkunft / Stempel */
  .herkunft .grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;}

.stempel{
    width:150px;height:150px;border-radius:50%;
    border:4px double var(--ochsenblut);color:var(--ochsenblut);
    display:flex;align-items:center;justify-content:center;text-align:center;
    font-family:'Bitter';font-weight:700;font-size:.82rem;text-transform:uppercase;
    letter-spacing:.04em;line-height:1.35;transform:rotate(-8deg);
    margin-bottom:22px;
  }

/* CTA band */
  .cta-band{background:var(--ochsenblut);color:var(--weiss);text-align:center;}

.cta-band h2{color:var(--weiss);}

.cta-band .btn.outline{border-color:var(--weiss);color:var(--weiss);}

.cta-band .btn.outline:hover{background:var(--weiss);color:var(--ochsenblut);}

/* Footer */
  footer{background:var(--kohle);color:var(--papier);padding:60px 0 26px;}

footer .grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px;margin-bottom:40px;}

footer h4{color:var(--messing);font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;font-family:'Space Mono';margin-bottom:14px;}

footer p, footer a{font-size:.9rem;opacity:.85;text-decoration:none;line-height:1.8;}

footer ul{list-style:none;margin:0;padding:0;}

.legal-bar{
    border-top:1px solid rgba(255,255,255,.14);padding-top:22px;
    display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
    font-size:.78rem;opacity:.6;
  }

.legal-bar a{color:var(--papier);text-decoration:underline;}

.ai-note{font-size:.76rem;opacity:.55;margin-top:10px;}

@media (max-width:900px){
    nav.main{display:none;}
    .usp .wrap{grid-template-columns:1fr 1fr;}
    .automat .grid, .vorbestellung .grid, .herkunft .grid{grid-template-columns:1fr;}
    .market-list{grid-template-columns:1fr;}
    footer .grid{grid-template-columns:1fr;}

    /* Sicherheitsnetz gegen horizontales Scrollen auf schmalen Bildschirmen.
       Ändert nichts am Layout selbst, verhindert nur, dass irgendein
       Element die Seite über die Bildschirmbreite hinaus aufreißt. */
    html, body{max-width:100%;overflow-x:hidden;}

    /* Hamburger-Menü: Desktop-Navigation bleibt oben unverändert, das
       hier greift ausschließlich unterhalb von 900px. */
    header.site .wrap{position:relative;flex-wrap:nowrap;gap:10px;padding-left:16px;padding-right:16px;}

    /* Der Header selbst war die eigentliche Ursache der Überbreite: Logo-
       Schriftzug und der "Kontakt & Bestellung"-Button waren fest breit
       (kein Umbruch, kein Schrumpfen) und haben die Seite dadurch breiter
       als den Bildschirm gemacht. Beides wird hier ausschließlich für
       mobile Ansichten kompakter gemacht, das Desktop-Design bleibt exakt
       wie es war. */
    .brand-mark img{height:46px;}
    .brand-text{font-size:1.15rem;max-width:132px;white-space:normal;line-height:1.05;}
    .brand-text span{font-size:.5rem;}

    .btn-cta{padding:10px;gap:0;}
    .btn-cta span{display:none;}

    .nav-toggle{
        display:flex;flex-direction:column;justify-content:center;align-items:center;
        gap:5px;width:38px;height:34px;padding:0;border:none;background:transparent;
        cursor:pointer;flex-shrink:0;
      }

    .nav-toggle span{display:block;height:3px;width:26px;background:var(--kohle);border-radius:2px;}

    body.lfk-nav-open nav.main{
        display:block;position:absolute;left:0;right:0;top:100%;z-index:60;
        background:var(--papier);border-top:1px solid var(--papier-dunkel);
        border-radius:0;margin:0;padding:16px 22px 20px;
        box-shadow:0 10px 18px rgba(0,0,0,.14);
      }

    body.lfk-nav-open nav.main ul{flex-direction:column;align-items:flex-start;gap:2px;}

    body.lfk-nav-open nav.main a{display:block;width:100%;padding:11px 0;}
  }

/* Page header band, used on all subpages */
  .page-head{background:var(--kohle);color:var(--papier);padding:56px 0 50px;}

.page-head .eyebrow{color:var(--messing);}

.page-head h1{color:var(--papier);font-size:clamp(2rem,4vw,2.8rem);}

.page-head p{opacity:.8;max-width:600px;margin:.4em 0 0;}

.page-head .ai-note-inline{opacity:.65;font-size:.82rem;max-width:600px;margin-top:14px;}

/* Hours card */
  .hours-wrap{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start;}

.hours-card{
    background:var(--weiss);border:1px solid var(--papier-dunkel);
    padding:34px 36px;
  }

.hours-card table{width:100%;border-collapse:collapse;}

.hours-card td{padding:11px 0;border-bottom:1px solid var(--papier-dunkel);font-size:1.02rem;}

.hours-card td.day{font-family:'Bitter';font-weight:700;color:var(--kohle);width:40%;}

.hours-card td.time{color:var(--rauchbraun);}

.hours-card tr.closed td.time{color:var(--ochsenblut);font-weight:600;}

.notice-box{
    background:var(--papier-dunkel);border-left:4px solid var(--ochsenblut);
    padding:20px 24px;margin-top:26px;
  }

.notice-box h4{margin-bottom:.3em;font-size:1rem;}

.notice-box p{margin:0;font-size:.92rem;color:var(--rauchbraun);}

.phone-note{
    background:var(--waldgruen);color:var(--papier);
    padding:28px 32px;
  }

.phone-note h4{color:var(--papier);font-family:'Space Mono';text-transform:uppercase;font-size:.8rem;letter-spacing:.08em;margin-bottom:.6em;}

.phone-note p{opacity:.9;margin:0 0 .6em;}

.phone-note a{color:var(--papier);font-weight:700;text-decoration:underline;}

/* Timeline */
  .timeline{position:relative;max-width:820px;margin:0 auto;}

.timeline::before{
    content:"";position:absolute;left:110px;top:0;bottom:0;width:2px;
    background:var(--papier-dunkel);
  }

@media (max-width:700px){.timeline::before{left:20px;}}

.tl-item{position:relative;padding-left:150px;margin-bottom:44px;}

@media (max-width:700px){.tl-item{padding-left:56px;}}

.tl-date{
    position:absolute;left:0;top:2px;width:95px;text-align:right;
    font-family:'Space Mono';font-size:.78rem;font-weight:700;color:var(--messing);
  }

@media (max-width:700px){.tl-date{position:static;display:block;text-align:left;margin-bottom:6px;width:auto;}}

.tl-dot{
    position:absolute;left:106px;top:4px;width:10px;height:10px;border-radius:50%;
    background:var(--ochsenblut);border:2px solid var(--papier);box-shadow:0 0 0 2px var(--ochsenblut);
  }

@media (max-width:700px){.tl-dot{left:16px;}}

.tl-item h3{font-size:1.15rem;margin-bottom:.3em;}

.tl-item p{margin:0;color:var(--rauchbraun);font-size:.95rem;}

.tl-item img{margin-top:14px;max-width:220px;border:1px solid var(--papier-dunkel);}

/* Team grid */
  .team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:32px;}

.team-card{background:var(--weiss);border:1px solid var(--papier-dunkel);text-align:center;padding-bottom:24px;}

.team-card img{width:100%;height:280px;object-fit:cover;object-position:top center;margin-bottom:18px;}

.team-card h3{font-size:1.15rem;margin-bottom:.2em;}

.team-card .role{font-family:'Space Mono';font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--messing);font-weight:700;display:block;margin-bottom:10px;}

.team-card p.bio{font-size:.88rem;color:var(--rauchbraun);padding:0 20px;margin:0;}

/* Contact page */
  .contact-wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;}

.contact-form{display:flex;flex-direction:column;gap:16px;}

.contact-form label{font-family:'Space Mono';font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--rauchbraun);margin-bottom:4px;display:block;}

.contact-form input, .contact-form textarea{
    width:100%;padding:12px 14px;border:1px solid var(--papier-dunkel);
    background:var(--weiss);font-family:'Work Sans';font-size:.95rem;color:var(--kohle);
  }

.contact-form textarea{min-height:140px;resize:vertical;}

.contact-form .btn{align-self:flex-start;border:none;cursor:pointer;font-family:'Work Sans';}

.contact-info-card{background:var(--kohle);color:var(--papier);padding:34px 36px;}

.contact-info-card h4{color:var(--messing);font-family:'Space Mono';font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}

.contact-info-card p{opacity:.88;margin:0 0 22px;line-height:1.8;}

.contact-info-card a{color:var(--papier);}

.form-note{font-size:.82rem;color:var(--rauchbraun);margin-top:-4px;}

.legal-content{max-width:800px;}

.legal-content h2{font-size:1.35rem;margin:2em 0 .5em;}

.legal-content h2:first-child{margin-top:0;}

.legal-content h3{font-size:1.08rem;margin:1.4em 0 .4em;}

.legal-content p{margin:0 0 1em;color:var(--kohle);}

.legal-content ul{margin:0 0 1em;padding-left:22px;color:var(--kohle);}

.legal-content li{margin-bottom:.4em;}

.legal-content a{color:var(--ochsenblut);text-decoration:underline;}

.legal-content .stand{
    font-family:'Space Mono';font-size:.78rem;color:var(--messing);
    text-transform:uppercase;letter-spacing:.04em;margin-bottom:2em;
  }

.legal-content .subtle-box{
    background:var(--papier-dunkel);padding:22px 26px;margin:1.6em 0;
  }

.legal-content .subtle-box p:last-child{margin-bottom:0;}

.legal-nav{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px;}

.legal-nav a{
    font-family:'Space Mono';font-size:.76rem;text-transform:uppercase;letter-spacing:.03em;
    color:var(--rauchbraun);background:var(--papier-dunkel);padding:8px 16px;text-decoration:none;
  }

.legal-nav a.active{background:var(--waldgruen);color:var(--weiss);}

.hero-content .eyebrow{
    color:#f0c878;
    text-shadow:0 1px 3px rgba(0,0,0,.7),0 1px 8px rgba(0,0,0,.5);
  }

.hero-content h1{font-size:clamp(2.2rem,5vw,3.4rem);color:var(--weiss);text-shadow:0 2px 10px rgba(0,0,0,.45);}

.hero-content p{font-size:1.08rem;opacity:.92;max-width:520px;text-shadow:0 1px 6px rgba(0,0,0,.5);}

.hero-tagline{
    font-family:'Bitter';font-weight:700;font-size:1.3rem;
    color:#f0c878;opacity:1;margin:.2em 0 .6em;
    text-shadow:0 1px 3px rgba(0,0,0,.7),0 1px 8px rgba(0,0,0,.5);
  }

.product-card .pc-img-wrap{position:relative;overflow:hidden;}

.product-card .ai-badge{
    position:absolute;right:0;bottom:0;width:46px;height:46px;overflow:hidden;
    pointer-events:none;
  }

.product-card .ai-badge::before{
    content:"";position:absolute;right:0;bottom:0;width:0;height:0;
    border-style:solid;border-width:0 0 46px 46px;
    border-color:transparent transparent rgba(33,28,23,.62) transparent;
  }

.product-card .ai-badge span{
    position:absolute;right:6px;bottom:14px;
    color:#fff;font-family:'Space Mono';font-size:.5rem;font-weight:700;
    letter-spacing:0;transform:rotate(-45deg);transform-origin:right bottom;
    white-space:nowrap;
  }

.ai-note-inline{font-size:.8rem;color:var(--rauchbraun);margin-top:8px;}

.compendium-intro{max-width:760px;margin-bottom:10px;}

.compendium-intro p{color:var(--rauchbraun);}

.cut-category{margin-top:64px;}

.cut-category:first-of-type{margin-top:0;}

.cat-head{background:var(--papier-dunkel);padding:26px 30px;margin-bottom:26px;}

.cat-head h2{font-size:1.5rem;margin-bottom:.3em;}

.cat-head p{max-width:720px;color:var(--rauchbraun);margin:0;}

.cow-diagram{margin:40px 0 56px;text-align:center;}

.cow-diagram img{max-width:100%;width:920px;height:auto;margin:0 auto;}

.cow-diagram .cap{font-family:'Space Mono';font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--messing);margin-top:10px;}

.cut-list{border-top:1px solid var(--papier-dunkel);}

details.cut{
    border-bottom:1px solid var(--papier-dunkel);
  }

details.cut summary{
    cursor:pointer;list-style:none;
    padding:18px 4px;
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    font-family:'Bitter';font-weight:700;font-size:1.08rem;color:var(--kohle);
  }

details.cut summary::-webkit-details-marker{display:none;}

details.cut summary .plus{
    font-family:'Space Mono';color:var(--messing);font-size:1.3rem;font-weight:700;
    flex-shrink:0;transition:transform .15s;
  }

details.cut[open] summary .plus{transform:rotate(45deg);}

details.cut summary .aka{
    font-family:'Work Sans';font-weight:400;font-size:.85rem;color:var(--rauchbraun);
    display:block;margin-top:2px;
  }

.cut-body{padding:0 4px 26px;}
details.cut[open] .cut-body{display:grid;grid-template-columns:repeat(2,1fr);gap:20px 32px;}

@media (max-width:700px){details.cut[open] .cut-body{grid-template-columns:1fr;}}

.cut-illustration{
    grid-column:1 / -1;background:var(--papier-dunkel);
    display:flex;align-items:center;justify-content:center;
    padding:20px;border:1px solid var(--papier-dunkel);
  }

.cut-illustration img{max-height:220px;width:auto;max-width:100%;object-fit:contain;mix-blend-mode:multiply;}

.cut-field{grid-column:span 1;}

.cut-field.full{grid-column:1 / -1;}

.cut-field h4{
    font-family:'Space Mono';font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;
    color:var(--messing);margin-bottom:.4em;font-weight:700;
  }

.cut-field p{margin:0;font-size:.92rem;color:var(--kohle);line-height:1.55;}

.cut-field ul{margin:0;padding-left:18px;font-size:.92rem;color:var(--kohle);line-height:1.6;}

.cut-field ul li{margin-bottom:2px;}

.overview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px;margin-top:24px;}

.overview-card{background:var(--weiss);border:1px solid var(--papier-dunkel);padding:22px 24px;}

.overview-card h3{font-size:.98rem;margin-bottom:.6em;}

.overview-card ul{margin:0;padding-left:18px;font-size:.88rem;color:var(--rauchbraun);line-height:1.7;}

.avail-note{background:var(--papier-dunkel);border-left:4px solid var(--waldgruen);padding:24px 28px;margin-top:50px;}

.avail-note h3{font-size:1.05rem;margin-bottom:.4em;}

.avail-note p{margin:0 0 .6em;color:var(--rauchbraun);font-size:.92rem;}

.avail-note p:last-child{margin-bottom:0;}

.cut-category h2{font-size:1.5rem;margin-bottom:.3em;}

.cut-category > p{max-width:720px;color:var(--rauchbraun);margin-bottom:26px;}

.product-photo{grid-column:1 / -1;overflow:hidden;margin-bottom:4px;}

.product-photo img{width:100%;height:260px;object-fit:cover;display:block;}

@media (max-width:700px){.product-photo img{height:200px;}}

/* Product grid (Sortiment) */
  .product-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(250px,1fr));gap:28px;}

details.product-card{
    background:var(--weiss);border:1px solid var(--papier-dunkel);
    overflow:hidden;
  }

details.product-card summary{list-style:none;cursor:pointer;display:block;}

details.product-card summary::-webkit-details-marker{display:none;}

details.product-card .pc-img-wrap{position:relative;overflow:hidden;}

details.product-card .pc-img{width:100%;height:180px;object-fit:cover;display:block;}

details.product-card .ai-badge{
    position:absolute;right:0;bottom:0;width:46px;height:46px;overflow:hidden;
    pointer-events:none;
  }

details.product-card .ai-badge::before{
    content:"";position:absolute;right:0;bottom:0;width:0;height:0;
    border-style:solid;border-width:0 0 46px 46px;
    border-color:transparent transparent rgba(33,28,23,.62) transparent;
  }

details.product-card .ai-badge span{
    position:absolute;right:6px;bottom:14px;
    color:#fff;font-family:'Space Mono';font-size:.5rem;font-weight:700;
    letter-spacing:0;transform:rotate(-45deg);transform-origin:right bottom;
    white-space:nowrap;
  }

details.product-card .pc-body{padding:16px 18px 18px;}

details.product-card h3{font-size:1.05rem;margin-bottom:.35em;}

details.product-card .teaser{font-size:.88rem;color:var(--rauchbraun);margin:0;}

details.product-card .read-more{
    margin-top:12px;font-family:'Space Mono';font-size:.72rem;
    text-transform:uppercase;letter-spacing:.06em;color:var(--messing);font-weight:700;
    display:flex;align-items:center;gap:5px;
  }

details.product-card .read-more .arrow{display:inline-block;transition:transform .15s;}

details.product-card[open] .read-more .arrow{transform:rotate(90deg);}

details.product-card .full-text{padding:0 18px 22px;font-size:.92rem;color:var(--kohle);line-height:1.65;}

details.product-card .full-text p{margin:0 0 .8em;}

details.product-card .full-text p:last-child{margin-bottom:0;}

.ticker-list{max-width:760px;margin:0 auto;}

.ticker-item{
    background:var(--weiss);border:1px solid var(--papier-dunkel);
    padding:28px 32px;margin-bottom:22px;
  }

.ticker-item .ticker-date{
    font-family:'Space Mono';font-size:.74rem;text-transform:uppercase;
    letter-spacing:.05em;color:var(--messing);font-weight:700;margin-bottom:.5em;
  }

.ticker-item h3{font-size:1.2rem;margin-bottom:.5em;}

.ticker-item p{margin:0 0 .8em;color:var(--kohle);font-size:.95rem;}

.ticker-item p:last-of-type{margin-bottom:0;}

.ticker-item.current{border-left:4px solid var(--ochsenblut);}

.ticker-images{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap;}

.ticker-images img{width:170px;height:115px;object-fit:cover;border:1px solid var(--papier-dunkel);}

.konserven-intro{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center;margin-bottom:70px;}

.konserven-intro img{width:100%;height:340px;object-fit:cover;border:1px solid var(--papier-dunkel);}

.konserven-intro h2{font-size:1.5rem;margin-bottom:.5em;}

.konserven-intro p{color:var(--rauchbraun);}

@media (max-width:800px){.konserven-intro{grid-template-columns:1fr;}}

.konserve-row{
    display:grid;grid-template-columns:260px 1fr;gap:36px;
    align-items:start;margin-bottom:52px;
    padding-bottom:52px;border-bottom:1px solid var(--papier-dunkel);
  }

.konserve-row:last-of-type{border-bottom:none;}

.konserve-row img{width:100%;height:210px;object-fit:cover;border:1px solid var(--papier-dunkel);}

.konserve-row h3{font-size:1.2rem;margin-bottom:.5em;}

.konserve-row p{margin:0;color:var(--kohle);font-size:.96rem;}

@media (max-width:700px){.konserve-row{grid-template-columns:1fr;}}

.konserven-closing{
    background:var(--papier-dunkel);padding:32px 36px;margin-top:10px;
  }

.konserven-closing p{margin:0;color:var(--rauchbraun);}
/* ---------------------------------------------------------------------
   404-Seite: Ladenschild links, Text mittig, Hofladen-Theke rechts.
   ------------------------------------------------------------------ */
.error-page{padding:64px 0;background:#f0e4d5;overflow:hidden;}

.error-page-inner{
    display:flex;align-items:stretch;gap:36px;min-height:520px;
  }

.error-side{flex:0 0 260px;max-width:260px;border-radius:4px;overflow:hidden;}

.error-side img{width:100%;height:100%;object-fit:cover;display:block;}

.error-content{
    flex:1 1 auto;min-width:0;text-align:center;padding:20px 12px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
  }

.error-code{
    font-family:'Bitter',serif;font-weight:700;line-height:1;
    font-size:clamp(4.5rem,9vw,7rem);color:var(--kohle);
  }

.error-divider{display:flex;align-items:center;gap:12px;margin:16px 0 22px;}

.error-divider span{width:64px;height:1px;background:var(--messing);display:block;}

.error-content h1{
    font-family:'Bitter',serif;font-weight:700;
    font-size:clamp(1.4rem,3vw,1.9rem);margin:0 0 12px;color:var(--kohle);
  }

.error-content p{max-width:420px;margin:0 auto 26px;color:var(--rauchbraun);}

.error-content .btn{display:inline-flex;align-items:center;}

@media (max-width:900px){
  .error-side{display:none;}
  .error-page{padding:44px 0;}
  .error-page-inner{min-height:0;}
}
