/*
 * Einfach Haltbar – DE Mobile Foundation STAGING v1.4.0
 * Scope: 25 explizite DE-Artikel, STAGING-only, max-width 768px.
 * Profiles:
 *   protected = bestätigte Master/Artikel nur technisch absichern
 *   legacy    = ältere DE Content-Artikel gezielt mobile-polishen
 *   buying    = alte Kaufberatung nur technisch sauber halten bis Migration
 * Guardrails: kein overflow-x:hidden, keine CTA-Farbänderung, keine Buybox-Rekonstruktion.
 */

@media (max-width:768px){
  html:has(body.eh-de-mobile-foundation),
  body.eh-de-mobile-foundation{
    -webkit-text-size-adjust:100%;
    text-size-adjust:100%;
  }

  body.eh-de-mobile-foundation,
  body.eh-de-mobile-foundation :where(main,article,section,div,figure,table,thead,tbody,tr,th,td){
    box-sizing:border-box;
  }

  /* Systemweite technische Absicherung – visuell nahezu neutral. */
  body.eh-de-mobile-foundation :where(img,video,svg,canvas){
    max-width:100%;
  }
  body.eh-de-mobile-foundation :where(.entry-content,.eh-post-content,.eh-article,.eh-child-legacy-content) img{
    height:auto;
  }
  body.eh-de-mobile-foundation :where(.entry-content,.eh-post-content,.eh-article,.eh-child-legacy-content) :where(p,li,figcaption,td,th,a){
    overflow-wrap:break-word;
    word-break:normal;
    hyphens:auto;
  }
  body.eh-de-mobile-foundation :where(.entry-content,.eh-post-content,.eh-article,.eh-child-legacy-content) :where(h1,h2,h3,h4){
    overflow-wrap:normal;
    word-break:normal;
    hyphens:none;
    text-wrap:pretty;
  }
  body.eh-de-mobile-foundation :where(section[id],h2[id],h3[id],#faq,#equipment,#safety){
    scroll-margin-top:88px;
  }
  body.eh-de-mobile-foundation :where(a,button,summary):focus-visible{
    outline:3px solid #0e7b61;
    outline-offset:2px;
  }
  body.eh-de-mobile-foundation :where(.ehps-toc-mobile>summary,.toc summary,.eh-faq summary,details>summary,.eh-cluster-back__link){
    min-height:44px;
  }

  /* =========================================================
     LEGACY CONTENT – 6 Artikel
     ========================================================= */
  body.eh-dmf-profile-legacy .eh-post-content>.ehps-shell{
    width:calc(100vw - 16px)!important;
    max-width:none!important;
    margin-inline:auto!important;
    padding-inline:8px!important;
  }

  body.eh-dmf-profile-legacy :where(.eh-article,.entry-content>.eh-article){
    width:100%!important;
    max-width:760px!important;
    margin-inline:auto!important;
    padding-inline:16px!important;
  }

  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content){
    font-size:16px!important;
    line-height:1.64!important;
  }
  body.eh-dmf-profile-legacy :where(.entry-title,.eh-child-hero h1,.eh-article>h1,.eh-article h1){
    max-width:100%!important;
    font-size:clamp(32px,9.2vw,42px)!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) h2{
    margin-top:30px!important;
    margin-bottom:10px!important;
    font-size:clamp(27px,7.4vw,32px)!important;
    line-height:1.10!important;
    letter-spacing:-.018em!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) h3{
    margin-top:22px!important;
    margin-bottom:8px!important;
    font-size:clamp(20px,5.5vw,23px)!important;
    line-height:1.20!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) p{
    margin-block:.68rem!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) li{
    margin-block:.30rem!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) :where(ul,ol){
    padding-left:1.25rem!important;
  }

  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) :where(figure.wp-block-image,figure.eh-article-image,.eh-section-image){
    width:100%!important;
    max-width:100%!important;
    margin:16px 0 7px!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) :where(figure.wp-block-image img,figure.eh-article-image img,.eh-section-image img,img.eh-section-image){
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center!important;
  }
  body.eh-dmf-profile-legacy :where(.eh-child-legacy-content,.eh-article,.entry-content) figcaption{
    margin-top:5px!important;
    font-size:.84rem!important;
    line-height:1.42!important;
  }

  /* TOC / FAQ / Backlink: große Touch-Ziele, ohne Farben/Anatomie umzubauen. */
  body.eh-dmf-profile-legacy :where(.toc a,.eh-guide-nav a,.quick-jump__link,.ehps-shortcuts a){
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
  }
  body.eh-dmf-profile-legacy :where(.faq-legacy summary,.eh-faq summary,details>summary){
    min-height:48px!important;
    display:flex!important;
    align-items:center!important;
  }

  /* Responsive Content-Tabellen: nur von JS semantisch markierte Tabellen. */
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"]{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:14px 0 20px!important;
    border:0!important;
    background:transparent!important;
  }
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] thead{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] :where(tbody,tr,td){
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] tr{
    margin:0 0 11px!important;
    overflow:hidden!important;
    border:1px solid #dfe8e3!important;
    border-radius:12px!important;
    background:#fff!important;
  }
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] td{
    display:grid!important;
    grid-template-columns:minmax(108px,.82fr) minmax(0,1.28fr)!important;
    gap:8px!important;
    padding:10px 11px!important;
    border:0!important;
    border-bottom:1px solid #e6ece9!important;
    background:#fff!important;
    font-size:.92rem!important;
    line-height:1.42!important;
  }
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] td:last-child{
    border-bottom:0!important;
  }
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] td::before{
    content:attr(data-label)!important;
    display:block!important;
    min-width:0!important;
    color:#0f3f35!important;
    font-weight:800!important;
    line-height:1.30!important;
  }

  /* =========================================================
     LEGACY BUYING – 3 Artikel
     Nur Mobile-Sicherheit bis zur strukturellen Migration.
     ========================================================= */
  body.eh-dmf-profile-buying :where(.eh-article,.entry-content){
    width:100%!important;
    max-width:100%!important;
    padding-inline:16px!important;
  }
  body.eh-dmf-profile-buying :where(.eh-article,.entry-content){
    font-size:16px!important;
    line-height:1.62!important;
  }
  body.eh-dmf-profile-buying :where(.entry-title,.eh-article h1){
    max-width:100%!important;
    font-size:clamp(31px,8.8vw,40px)!important;
    line-height:1.04!important;
    letter-spacing:-.024em!important;
  }
  body.eh-dmf-profile-buying :where(.eh-article,.entry-content) h2{
    font-size:clamp(26px,7.1vw,31px)!important;
    line-height:1.12!important;
    text-wrap:pretty!important;
  }
  body.eh-dmf-profile-buying :where(.eh-article,.entry-content) h3{
    font-size:clamp(20px,5.4vw,23px)!important;
    line-height:1.20!important;
  }
  body.eh-dmf-profile-buying :where(.wp-block-table,.eh-table-wrap,.table-wrap){
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-inline:contain;
  }
  body.eh-dmf-profile-buying :where(.wp-block-table,.eh-table-wrap,.table-wrap)>table{
    max-width:none!important;
  }
  body.eh-dmf-profile-buying table:not([data-eh-dmf-table="1"]){
    max-width:100%!important;
  }
  body.eh-dmf-profile-buying :where(.eh-buy-grid,.ferment-product-grid,.product-grid,.affiliate-grid,.comparison-grid){
    grid-template-columns:minmax(0,1fr)!important;
    gap:12px!important;
  }
  body.eh-dmf-profile-buying :where(.eh-buy-card,.affiliate-card,.product-card,.comparison-card){
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body.eh-dmf-profile-buying :where(.eh-buy-card,.affiliate-card,.product-card,.comparison-card) img{
    max-width:100%!important;
    height:auto!important;
    object-fit:contain!important;
  }
  body.eh-dmf-profile-buying :where(.eh-buy-button,.affiliate-cta,.eh-commercial-cta){
    min-height:44px!important;
  }
}

@media (max-width:480px){
  body.eh-dmf-profile-legacy table[data-eh-dmf-table="1"] td{
    grid-template-columns:minmax(0,1fr)!important;
    gap:3px!important;
  }
}


/* =========================================================
   v1.1 REAL-STAGING DELTA
   Basis: belastbarer 25/25-Run mit QA Runner v1.2.0.
   Nur echte Laufzeitprobleme:
   - CTA/Buttons auf 48px Touch-Höhe
   - zwei versetzte New-World-Shells sauber im Viewport zentrieren
   - Einkochen-Pillar-Tabelle bei 360px auf Parent-Breite begrenzen
   - Dörrautomat-Vergleich bei sehr schmalen 360px mit Mindest-Lesegutter
   KEINE H1-Neugestaltung der protected/New-World-Master.
   ========================================================= */

@media (max-width:768px){
  body.eh-de-mobile-foundation :where(
    .ehps-toc-mobile>summary,
    .toc summary,
    .eh-faq summary,
    details>summary,
    .eh-cluster-back__link
  ){
    min-height:48px!important;
  }

  /* QA v1.2: auf diesen beiden freigegebenen Pillars lag die 352/382/422/760px
     Shell noch im gepaddeten Parent (x=18/23) und endete 10–15px rechts außerhalb.
     Full-bleed wird nur horizontal neu zentriert; Breite/Anatomie bleiben gleich. */
  body.eh-dmf-slug-obst-gemuese-richtig-doerren .ehps-shell.eh-child-ending-chain,
  body.eh-dmf-slug-einlegen-fuer-anfaenger .ehps-shell.eh-child-ending-chain{
    width:calc(100vw - 8px)!important;
    max-width:calc(100vw - 8px)!important;
    margin-left:calc(50% - 50vw + 4px)!important;
    margin-right:calc(50% - 50vw + 4px)!important;
  }

  /* Editorialbild bleibt innerhalb der korrigierten Einlegen-Shell. */
  body.eh-dmf-slug-einlegen-fuer-anfaenger img.eh-pillar-editorial-img{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
  }
}

/* QA v1.2: Einkochen-Pillar war nur bei 360px 11px zu breit (367px).
   Ab 390px bereits sauber. Daher bewusst ausschließlich schmaler Phone-Bereich. */
@media (max-width:380px){
  body.eh-dmf-slug-einkochen-fuer-anfaenger table.eh-einkochen-pillar-table-master{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
  }
  body.eh-dmf-slug-einkochen-fuer-anfaenger table.eh-einkochen-pillar-table-master :where(th,td){
    min-width:0!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:normal!important;
  }
}



/* =========================================================
   v1.2 FINAL FOUNDATION DELTA
   QA v1.2 after Foundation v1.1:
   25 pages · 3 PASS · 22 WARN · 0 FAIL · 0 ERROR
   The remaining actionable warnings on NON-PROTECTED pages are
   genuine CTA links whose inline formatting prevents min-height
   from changing their rendered hit box.

   Scope is deliberately limited to:
   - legacy profile (6 editorial Old-World pages)
   - buying profile (3 interim Old-World buying guides)
   Protected/frozen pages are NOT touched by this CTA delta.
   ========================================================= */
@media (max-width:768px){
  body.eh-dmf-profile-legacy :where(
    a.wp-block-button__link,
    a.wp-element-button,
    a.eh-commercial-cta,
    a.affiliate-cta,
    a.eh-buy-button,
    a.eh-cta-internal
  ),
  body.eh-dmf-profile-buying :where(
    a.wp-block-button__link,
    a.wp-element-button,
    a.eh-commercial-cta,
    a.affiliate-cta,
    a.eh-buy-button
  ){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:48px!important;
    box-sizing:border-box!important;
    vertical-align:middle!important;
  }

  /* Existing width contracts stay authoritative.
     Where a card CTA is already width:100%, inline-flex respects it. */
  body.eh-dmf-profile-legacy :where(
    a.eh-commercial-cta,
    a.affiliate-cta,
    a.eh-buy-button
  ),
  body.eh-dmf-profile-buying :where(
    a.eh-commercial-cta,
    a.affiliate-cta,
    a.eh-buy-button
  ){
    text-align:center!important;
  }
}


/* =========================================================
   v1.3 CASCADE-CORRECTION DELTA
   Real-STAGING QA Runner v1.3 proved:
   - Foundation v1.2 stylesheet IS loaded
   - v1.2 selectors DO match (display:inline-flex is applied)
   - but existing more-specific !important rules win for
     height/min-height (computed 38/40/42px)
   - no zoom/transform scaling is involved

   Scope remains STRICTLY NON-PROTECTED:
   - legacy
   - buying
   Protected/frozen masters are untouched.
   ========================================================= */
@media (max-width:768px){

  /* Gutenberg / generic buttons on Legacy */
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.wp-block-button__link.wp-element-button,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.wp-block-button__link,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.wp-element-button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:auto!important;
    min-height:48px!important;
    max-height:none!important;
    box-sizing:border-box!important;
    vertical-align:middle!important;
  }

  /* Legacy commercial CTAs: existing card rules currently compute
     38/40px. Override only geometry, never color/text/link/width. */
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.eh-commercial-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.eh-commercial-cta.eh-cta-affiliate,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.affiliate-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.eh-buy-button,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy
  a.eh-cta-internal{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:auto!important;
    min-height:48px!important;
    max-height:none!important;
    box-sizing:border-box!important;
    text-align:center!important;
    vertical-align:middle!important;
  }

  /* Interim Old-World Buying Guides */
  body.eh-de-mobile-foundation.eh-dmf-profile-buying
  a.wp-block-button__link.wp-element-button,
  body.eh-de-mobile-foundation.eh-dmf-profile-buying
  a.wp-block-button__link,
  body.eh-de-mobile-foundation.eh-dmf-profile-buying
  a.wp-element-button,
  body.eh-de-mobile-foundation.eh-dmf-profile-buying
  a.eh-commercial-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-buying
  a.affiliate-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-buying
  a.eh-buy-button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:auto!important;
    min-height:48px!important;
    max-height:none!important;
    box-sizing:border-box!important;
    text-align:center!important;
    vertical-align:middle!important;
  }
}


/* =========================================================
   v1.4 LAST-MILE SLUG DELTA
   Real STAGING v1.3 QA: only three NON-PROTECTED pages still
   have actionable <44px CTA warnings.

   Scope:
   - Zucchini dörren
   - Pilze dörren
   - Fermentiergläser Vergleich

   Protected/frozen masters remain untouched.
   ========================================================= */
@media (max-width:768px){
  /* Two legacy Dörren pages still receive later article-specific
     40px commercial CTA rules. Repeated class selectors deliberately
     raise specificity without touching width/color/content/link. */
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy.eh-dmf-slug-zucchini-doerren
  a.eh-commercial-cta.eh-commercial-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy.eh-dmf-slug-zucchini-doerren
  a.eh-commercial-cta.eh-cta-affiliate.eh-commercial-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy.eh-dmf-slug-pilze-doerren
  a.eh-commercial-cta.eh-commercial-cta,
  body.eh-de-mobile-foundation.eh-dmf-profile-legacy.eh-dmf-slug-pilze-doerren
  a.eh-commercial-cta.eh-cta-affiliate.eh-commercial-cta{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    box-sizing:border-box!important;
  }

  /* Interim old-world comparison page: only its Gutenberg CTA(s)
     remain at 42px. Slug scope prevents spillover into other guides. */
  body.eh-de-mobile-foundation.eh-dmf-profile-buying.eh-dmf-slug-fermentierglaeser-kaufen
  a.wp-element-button.wp-element-button,
  body.eh-de-mobile-foundation.eh-dmf-profile-buying.eh-dmf-slug-fermentierglaeser-kaufen
  a.wp-block-button__link.wp-element-button.wp-element-button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:48px!important;
    min-height:48px!important;
    max-height:48px!important;
    box-sizing:border-box!important;
  }
}