/* ============================================================
   landing.css – Stile der Landingpage-Sektionen
   Verwendet in: template-parts/landing.php
   (Hero, Stats, Haus, Erkennen, Leistungen, Für wen, Partner,
   Warum, Gesundheit, Über uns, Ablauf, Fälle)

   Hinweis: Dies ist das originale, klassenbasierte Stylesheet aus
   dem Claude-Design-Export. Globale Tokens/Reset/A11y liegen bereits
   in tokens.css/base.css; doppelte Definitionen sind wertgleich.
   Wird VOR den Element-Modulen geladen, damit deren Feinschliff greift.
   ============================================================ */

:root{
    --orange:#F97316; --orange-2:#FB923C; --orange-press:#EA580C;
    --bg0:#18181a; --bg1:#1e1e21; --surface:#26262a;
    --light:#FFFFFF; --gray:#F5F5F5;
    --ink:#0A0A0A; --ink-2:#1a1a1a;
    --muted-dark:#9A9A9F; --muted-light:#5b5b62;
    --line-dark:rgba(255,255,255,.10); --line-light:rgba(10,10,10,.10);
    --wpat-line:rgba(10,10,10,.02); --wpat-line-d:rgba(255,255,255,.03);
    --font:'Roboto',-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
    --font-head:'Roboto Condensed','Roboto',-apple-system,"Segoe UI",Helvetica,Arial,sans-serif;
  }
  *{box-sizing:border-box;font-weight:400!important;font-style:normal!important}
  h1,h2,h3,.h1,.wordmark{font-family:var(--font-head);text-wrap:balance}
  p{text-wrap:pretty}
  html{scroll-behavior:smooth}
  body{margin:0;background:var(--bg0);font-family:var(--font);font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
  ::selection{background:var(--orange);color:#fff}

  /* ===== Accessibility (WCAG 2.2 AA) ===== */
  :root{ --orange-text:#A23A0E; --focus-ring:#1D1D1D; }
  .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .skip-link{position:absolute;left:-624.9375rem;top:0;background:#1D1D1D;color:#fff;padding:.75rem 1rem;z-index:1000;font-weight:600;text-decoration:none}
  .skip-link:focus{left:1rem;top:0.75rem}
  a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,[tabindex]:focus-visible,.hotspot:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px;border-radius:0.125rem}
  /* light ring on dark / orange surfaces so focus stays visible */
  .on-dark a:focus-visible,.on-dark button:focus-visible,.on-dark input:focus-visible,.on-dark textarea:focus-visible,.on-dark .hotspot:focus-visible,[style*="background: var(--orange)"]:focus-visible{outline:3px solid #fff;outline-offset:2px;box-shadow:0 0 0 5px #1D1D1D}
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  }
  .container{max-width:75rem;margin:0 auto;padding:0 2rem;position:relative}
  .narrow{max-width:42.5rem}
  .hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:3.5rem;align-items:center}
  .two-col{display:grid;grid-template-columns:1fr 1fr;gap:4.5rem;align-items:center}
  .expert-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:3.25rem;align-items:center}
  .services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
  .erkennen-cta{grid-column:1/-1;margin-top:1.5rem!important}
  .gesundheit-cta{grid-column:1/-1;margin-top:1.5rem!important}
  .faelle-grid{grid-template-rows:auto auto auto auto}
  .faelle-grid>.fcard{grid-row:span 4;display:grid;grid-template-rows:subgrid;gap:0}
  .usp-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2.5rem}
  .faq-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:4.5rem}
  .process-timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;position:relative}
  .footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:3rem}
  .contact-card{display:grid;grid-template-columns:1.12fr .88fr;background:#fff;border:1px solid var(--line-light);border-radius:0;overflow:hidden;box-shadow:0 30px 70px rgba(10,10,10,.10)}
  .contact-meta{display:grid;grid-template-columns:1.05fr .95fr;gap:1.5rem;margin-top:1.5rem}
  .choice-card:hover{border-color:var(--orange)}
  .choice-card.is-sel{border-color:var(--orange);background:rgba(249,115,22,.06)}
  .choice-card .cc-check{opacity:0;transition:opacity .15s ease}
  .choice-card.is-sel .cc-check{opacity:1}
  .ms-ind.is-active .ms-num,.ms-ind.is-done .ms-num{background:var(--orange)!important;color:#fff!important;border-color:var(--orange)!important}
  .ms-ind.is-active .ms-lbl{color:#0a0a0a!important}
  .choice-card{display:flex;align-items:center;gap:1rem;width:100%;text-align:left;background:#fff;border:1.5px solid var(--line-light);border-radius:0;padding:1.125rem 1.25rem;cursor:pointer;font-family:var(--font);transition:border-color .18s ease,background .18s ease,transform .12s ease}
  .choice-card:hover{border-color:var(--orange);background:#fffaf5}
  .choice-card[data-active="1"]{border-color:var(--orange);background:#fff6ee;box-shadow:0 0 0 3px rgba(249,115,22,.12)}
  .bento-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:auto 200px 200px auto;grid-template-areas:"intro intro intro orange" "sanierung region messung messung" "sanierung probe messung messung" "partner partner partner partner";gap:1.25rem}
  .b-intro{grid-area:intro}.b-orange{grid-area:orange}.b-sanierung{grid-area:sanierung}.b-region{grid-area:region}.b-probe{grid-area:probe}.b-messung{grid-area:messung}.b-partner{grid-area:partner}
  .bento-tile{position:relative;border-radius:0;overflow:hidden}
  .hero-stats{display:grid;grid-template-columns:repeat(3,auto);gap:4rem;justify-content:start}
  .mobile-stats{display:none}

  /* keyframes */
  @keyframes gridMove{from{background-position:0 0,0 0}to{background-position:64px 64px,64px 64px}}
  @keyframes floatA{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(60px,-40px) scale(1.12)}}
  @keyframes floatB{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-50px,50px) scale(.9)}}
  @keyframes scanY{0%,100%{transform:translateY(0)}50%{transform:translateY(168px)}}
  @keyframes pulseDot{0%{transform:scale(.6);opacity:.9}70%{transform:scale(2.4);opacity:0}100%{opacity:0}}
  @keyframes scanMove{0%{top:0}50%{top:calc(100% - 2.75rem)}100%{top:0}}
  @keyframes svcDot{0%{left:2%;top:33.5%;opacity:0}10%{opacity:1}45%{left:41.6%;top:59%}85%{left:86%;top:80%;opacity:1}100%{left:99%;top:80.5%;opacity:0}}
  @keyframes hotPulse{0%{transform:translate(-50%,-50%) scale(.6);opacity:.8}70%{transform:translate(-50%,-50%) scale(2.7);opacity:0}100%{opacity:0}}
  .haus-hot .haus-tip{opacity:0;visibility:hidden;transform:translateY(5px);transition:opacity .18s ease,transform .18s ease;pointer-events:none}
  .haus-hot[aria-expanded="true"] .haus-tip,.haus-hot:hover .haus-tip,.haus-hot:focus-visible .haus-tip{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
  .haus-hot:hover{z-index:12}
  .haus-hot[aria-expanded="true"]{z-index:12}
  .haus-hot .haus-dot{transition:transform .18s cubic-bezier(.2,.7,.2,1)}
  .haus-hot:hover .haus-dot,.haus-hot[aria-expanded="true"] .haus-dot{transform:translate(-50%,-50%) scale(1.18)}
  .svc-chart{clip-path:inset(0 100% 0 0);transition:clip-path 1.15s cubic-bezier(.2,.7,.2,1)}
  .svc-chart.is-live{clip-path:inset(0 0 0 0)}
  .svc-el{opacity:0;transform:translateY(8px);transition:opacity .55s ease,transform .55s ease}
  .svc-el.is-live{opacity:1;transform:none}
  .svc-pop{opacity:0;transform:translate(-50%,-50%) scale(.3);transition:opacity .4s ease,transform .45s cubic-bezier(.2,1.5,.4,1)}
  .svc-pop.is-live{opacity:1;transform:translate(-50%,-50%) scale(1)}
  .svc-popc{opacity:0;transform:scale(.3);transition:opacity .4s ease,transform .45s cubic-bezier(.2,1.5,.4,1)}
  .svc-popc.is-live{opacity:1;transform:scale(1)}
  .svc-bar{transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
  .svc-bar.is-live{transform:scaleX(1)}
  .fw-panel{display:none}
  .fw-panel.is-active{display:block;animation:fwIn .45s cubic-bezier(.2,.7,.2,1)}
  @keyframes fwIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  .fw-tab{display:inline-flex;align-items:center;gap:0.5625rem;padding:0.5625rem 1.125rem 0.5625rem 0.5625rem;background:#fff;border:1.5px solid rgba(10,10,10,.14);color:#0a0a0a;font-family:inherit;font-size:0.90625rem;font-weight:600;cursor:pointer;border-radius:0;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .12s ease}
  .fw-tab:hover{border-color:var(--orange)}
  .fw-tab.is-active{background:var(--orange);border-color:var(--orange);color:#fff}
  .fw-tab:active{transform:translateY(1px)}
  .fw-ic{flex:none;width:2.125rem;height:2.125rem;display:flex;align-items:center;justify-content:center}
  .fw-tab.is-active .fw-ic{background:#fff;width:2rem;height:2rem}
  .fw-tab.is-active .fw-ic img{width:82%;height:82%}
  .fw-ic img{width:100%;height:100%;object-fit:contain}
  .wpat{background-color:#fff;background-image:linear-gradient(var(--wpat-line) 1px,transparent 1px),linear-gradient(90deg,var(--wpat-line) 1px,transparent 1px);background-size:46px 46px}
  .wpat-d{position:absolute;inset:0;background-image:linear-gradient(var(--wpat-line-d) 1px,transparent 1px),linear-gradient(90deg,var(--wpat-line-d) 1px,transparent 1px);background-size:46px 46px;pointer-events:none;z-index:1}
  @keyframes scrollDot{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(34px);opacity:0}}
  @keyframes spinSlow{to{transform:rotate(360deg)}}
  @keyframes hintPulse{0%{box-shadow:0 0 0 0 rgba(249,115,22,.5)}70%{box-shadow:0 0 0 10px rgba(249,115,22,0)}100%{box-shadow:0 0 0 0 rgba(249,115,22,0)}}
  .fuerwen-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}

  /* hover/pseudo that inline can't express */
  .service-card{position:relative;overflow:hidden}
  .service-card::after{content:"";position:absolute;left:0;bottom:0;height:0.1875rem;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
  .service-card:hover::after{transform:scaleX(1)}
  .service-card:hover{transform:translateY(-4px)}
  .service-card .arrow{transition:transform .3s cubic-bezier(.2,.7,.2,1)}
  .service-card:hover .arrow{transform:translateX(6px)}
  .process-step .pcircle{transition:background .35s ease,border-color .35s ease}
  .process-step .picon{transition:stroke .35s ease,color .35s ease}
  .process-step:hover .pcircle{background:var(--orange);border-color:var(--orange)}
  .process-step:hover .picon{color:#fff}
  .usp-tile{transition:background .3s ease,transform .3s ease}
  .usp-tile:hover{background:var(--gray);transform:translateY(-2px)}
  .navlink{position:relative}
  .navlink::after{content:"";position:absolute;left:0;bottom:-0.25rem;height:0.125rem;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .3s ease}
  .navlink:hover::after{transform:scaleX(1)}
  .faq-q{transition:color .2s ease}
  .faq-q:hover{color:var(--orange)}
  footer .footer-grid a:not([aria-label]){transition:color .2s ease}
  footer .footer-grid a:not([aria-label]):hover{color:var(--orange)}
  footer .foot-bottom a{transition:color .2s ease}
  footer .foot-bottom a:hover{color:var(--orange)}

  /* ===== HERO (image + expert + floating cards) ===== */
  [data-darklink]{color:#1A1A1A!important}
  [data-darklink]:hover{color:var(--orange)!important}
  .hero-expert{position:absolute;right:4%;bottom:0;height:85%;width:auto;z-index:6;object-fit:contain;object-position:bottom;pointer-events:none;filter:drop-shadow(-18px 24px 40px rgba(0,0,0,.45))}
  .float-card{background:rgba(255,255,255,.12);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);border-radius:0;padding:0.75rem 1rem;display:flex;align-items:center;gap:0.75rem;box-shadow:0 10px 34px rgba(0,0,0,.22);animation:heroFloat 4s ease-in-out infinite;z-index:11}
  .float-card-2{animation-delay:1.3s}
  .float-card-3{animation-delay:2.6s}
  @keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
  @keyframes heroDot{0%{transform:scale(1);opacity:1}70%{transform:scale(1.6);opacity:0}100%{opacity:0}}
  /* Gestapeltes Hero-Visual (nur ≤1200px sichtbar) */
  .hero-visual-m{display:none}
  .hero-expert-m{display:block;width:auto;height:auto;max-width:min(20rem,78%);margin:0 auto;-webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,#000 80%,transparent 100%)}
  .hero-points-m{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.625rem;width:100%;max-width:22rem}
  .hero-points-m li{display:flex;align-items:center;gap:0.75rem;background:rgba(255,255,255,.12);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);padding:0.75rem 1rem;text-align:left}
  .hpm-ic{flex:none;width:1.625rem;height:1.625rem;background:var(--orange);display:flex;align-items:center;justify-content:center}
  .hero-points-m b{display:block;font-size:0.875rem;color:#fff;line-height:1.2}
  .hero-points-m i{display:block;font-size:0.75rem;color:rgba(255,255,255,.7);font-style:normal;margin-top:0.125rem}
  .eb-short{display:none}
  /* HERO 2-Spalten enger (1201–1366): Lesbarkeit – Verlauf dunkler, Text begrenzt, Foto kleiner, Float-Cards aus */
  @media(min-width:1201px) and (max-width:1366px){
    .hero-shade{background:linear-gradient(to right,rgba(10,10,10,.92) 0%,rgba(10,10,10,.88) 50%,rgba(10,10,10,.62) 100%)!important}
    .hero-expert{height:78%;right:1%}
    .float-card{display:none!important}
    .hero-text{max-width:38rem}
  }
  /* HERO gestapelt (≤1200): Text zentriert, Foto + 3 Punkte darunter */
  @media(max-width:1200px){
    #top{min-height:0!important;padding:7rem 0 3.5rem!important;align-items:flex-start!important}
    .hero-card{inset:5.5rem 0 1rem 0!important;border-radius:0}
    .hero-shade{background:linear-gradient(to bottom,rgba(10,10,10,.86) 0%,rgba(10,10,10,.8) 100%)!important}
    .hero-expert{display:none!important}
    .float-card{display:none!important}
    #top>a[data-scroll]{display:none!important}
    .hero-grid{grid-template-columns:1fr!important;gap:2.25rem!important}
    .hero-text{max-width:40rem;margin:0 auto;text-align:center}
    .hero-text>div:first-child{justify-content:center}
    .hero-text p{margin-left:auto!important;margin-right:auto!important}
    .hero-cta{justify-content:center}
    .hero-visual-m{display:flex!important;flex-direction:column;align-items:center;gap:0;width:100%}
    .hero-points-m{margin-top:-9rem;position:relative;z-index:2}
  }
  .stats-band{background-color:#fff;padding:0.875rem 0 4rem}
  /* Siegel-Leiste: 3 gleiche Spalten über die volle Containerbreite, fluid skaliert (nie umbrechen) */
  .stats-band-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(0.5rem,2.5vw,4.5rem);align-items:center}
  .stats-band-grid>div{gap:clamp(0.5rem,1.4vw,1rem)!important}
  .stats-band-grid img{width:clamp(2.75rem,5vw,4.25rem)!important;height:auto!important}
  .stats-band .num{font-size:clamp(1.0625rem,2.1vw,1.5rem)!important}
  .stats-band-grid>div>div>div:last-child{font-size:clamp(0.6875rem,1.3vw,0.8125rem)!important;max-width:none!important}
  /* Mobil (≤600): Siegel untereinander, Block zentriert, Icons auf einer Linie */
  @media(max-width:600px){
    .stats-band-grid{grid-template-columns:max-content;justify-content:center;gap:1.75rem}
    .stats-band-grid>div{justify-content:flex-start!important;gap:1rem!important}
    .stats-band-grid img{width:3.5rem!important}
    .stats-band .num{font-size:1.375rem!important}
    .stats-band-grid>div>div>div:last-child{font-size:0.875rem!important}
  }

  /* ===== HAUS Section ===== */
  .haus-progress{position:fixed;top:0;left:0;height:0.1875rem;background:var(--orange);width:0;z-index:200}
  .haus-scroll{position:relative;height:440vh}
  .haus-sticky{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem}
  /* Hohe Viewports (iPad hoch, Widescreen): Überschrift oben, Button unten, Haus mittig -> kaum Leerraum oben/unten */
  @media(min-height:880px){
    .haus-sticky{justify-content:space-between;padding-top:5rem;padding-bottom:1.5rem}
  }
  .haus-fig{position:relative;width:min(35rem,46vw);aspect-ratio:1083/888;overflow:visible}
  /* Widescreen: Haus höhenabhängig größer -> füllt die 100vh-Sektion, kaum noch Leerraum drumherum */
  @media(min-width:1400px) and (min-height:900px){
    .haus-fig{width:min(48vw,70vh)}
  }
  .haus-fig .floor{position:absolute;top:0;left:0;width:100%;height:auto;opacity:0;transform:translateY(80px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);will-change:opacity,transform}
  .haus-fig .floor.in{opacity:1;transform:translateY(0)}
  /* Scroll-Hinweis in der noch leeren Haus-Fläche (verschwindet, sobald gescrollt wird) */
  .haus-hint{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:0.625rem;color:#8a8a90;opacity:1;transition:opacity .45s ease;pointer-events:none;z-index:4}
  .haus-hint.is-hidden{opacity:0}
  .haus-hint__txt{font-size:0.6875rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600}
  .haus-hint svg{color:var(--orange);animation:hausHintBounce 1.6s ease-in-out infinite}
  @keyframes hausHintBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
  .hp{position:absolute;inset:0;pointer-events:none}
  .hp-dot{position:absolute;left:var(--x);top:var(--y);width:1.75rem;height:1.75rem;padding:0;border:none;background:transparent;-webkit-appearance:none;appearance:none;transform:translate(-50%,-50%) scale(0);transition:transform .5s cubic-bezier(.34,1.56,.64,1);z-index:5;pointer-events:auto;cursor:pointer;visibility:hidden}
  .hp-dot::before{content:"";position:absolute;left:50%;top:50%;width:0.875rem;height:0.875rem;transform:translate(-50%,-50%);background:var(--orange);border:2px solid #fff;box-shadow:0 1px 5px rgba(0,0,0,.35)}
  .hp.on .hp-dot{transform:translate(-50%,-50%) scale(1);visibility:visible}
  .hp-pulse{position:absolute;left:var(--x);top:var(--y);width:1.875rem;height:1.875rem;border-radius:0;background:rgba(249,115,22,.25);transform:translate(-50%,-50%) scale(1);opacity:0;pointer-events:none;z-index:3}
  .hp.on .hp-pulse{animation:hausPulse 2.5s ease-out infinite .6s}
  @keyframes hausPulse{0%{transform:translate(-50%,-50%) scale(1);opacity:.6}100%{transform:translate(-50%,-50%) scale(1.9);opacity:0}}
  .hp-line{position:absolute;top:var(--y);height:0.09375rem;background:var(--orange);transform:scaleX(0);transition:transform .45s ease .15s}
  .hp.left .hp-line{left:-1.375rem;right:calc(100% - var(--x));transform-origin:right}
  .hp.right .hp-line{left:var(--x);right:-1.375rem;transform-origin:left}
  .hp.on .hp-line{transform:scaleX(1)}
  .hp-label{position:absolute;top:var(--y);width:11.5rem;opacity:0;transition:opacity .35s ease .5s;pointer-events:auto;cursor:default}
  .hp.left .hp-label{left:-1.375rem;transform:translate(-100%,-50%);text-align:right}
  .hp.right .hp-label{left:100%;transform:translate(22px,-50%);text-align:left}
  .hp.on .hp-label{opacity:1}
  .hp-t{display:block;font-size:0.90625rem;color:#1A1A1A;line-height:1.2}
  .hp-n,.hp-arrow{color:var(--orange)}
  .hp-s{display:block;font-size:0.8125rem;color:#6b6b70;line-height:1.3;margin-top:0.1875rem}
  .hp-tip{position:absolute;top:calc(var(--y) + 0.875rem);width:13.25rem;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:0;box-shadow:0 16px 44px rgba(0,0,0,.18);padding:0.75rem 0.875rem;opacity:0;visibility:hidden;transition:opacity .2s ease;pointer-events:none;z-index:30;text-align:left}
  .hp.left .hp-tip{left:-1.375rem;transform:translateX(-100%)}
  .hp.right .hp-tip{right:-1.375rem;transform:translateX(100%)}
  .hp-label:hover ~ .hp-tip,.hp.open .hp-tip{opacity:1;visibility:visible}
  .hp-tip-b{font-size:0.75rem;line-height:1.5;color:#555;margin:0}
  @media(max-width:1080px){
    .haus-fig{width:min(27.5rem,40vw)}
    .hp-label{width:9.375rem}
    .hp-t{font-size:0.8125rem}
    .hp-s{font-size:0.75rem}
  }
  @media(max-width:768px){
    /* Haus-Diagramm mit seitlichen Hotspot-Labels ist auf Phone-Breite nicht darstellbar (Overflow) → mobil komplett ausblenden. Ab 769px (iPad Air etc.) sichtbar. */
    #haus{display:none}
    .haus-progress{display:none}
  }

  /* ===== RESPONSIVE: Tablet (bis 1024px) ===== */
  @media(max-width:1024px){
    [data-root]{overflow-x:clip}
    img{max-width:100%}
    .container{padding:0 1.5rem}
    .desk-nav{display:none!important}
    .hamb{display:flex!important}
    .services-grid{grid-template-columns:1fr 1fr}
    /* Schluss-Text + Button als 4. Karte in der Grid-Lücke (iPad bis iPhone) */
    .erkennen-cta{grid-column:auto!important;max-width:none!important;margin:0!important;text-align:left!important;background:#fff;border:1px solid rgba(10,10,10,.1);border-top:0.25rem solid var(--orange);box-shadow:0 2px 14px rgba(10,10,10,.05);padding:2.125rem 2rem}
    /* Gesundheit: Creme-Textblock als 4. Zelle in der Grid-Lücke (behält Creme-Look) */
    .gesundheit-cta{grid-column:auto!important;max-width:none!important;margin:0!important}
    /* Leistungen: letzte Karte füllt die Lücke über die volle Breite (iPad-2-Spalten) */
    #leistungen .service-card:last-child{grid-column:1/-1}
    /* Fälle: letzte Karte (Fall 03) füllt die Lücke über die volle Breite (iPad) */
    #faelle .service-card:last-child{grid-column:1/-1}
    /* Für-wen-Tabs: Deko-Linie weg (passt nur in einer Reihe), Tabs als 2-Spalten-Raster, letzter voll breit */
    .fw-rail{display:none}
    .fw-tabs{display:grid!important;grid-template-columns:1fr 1fr;gap:0.75rem}
    .fw-tabs .fw-tab{justify-content:center;padding-left:1.125rem}
    .fw-tabs .fw-tab:last-child{grid-column:1/-1}
    .faelle-grid>.fcard{grid-row:auto;display:flex;flex-direction:column}
    .usp-grid{grid-template-columns:1fr 1fr;gap:2rem}
    .fuerwen-grid{grid-template-columns:1fr 1fr}
    .process-timeline{grid-template-columns:1fr 1fr;gap:2.25rem}
    .footer-grid{grid-template-columns:1fr 1fr;gap:2.25rem}
    .two-col{grid-template-columns:1fr;gap:2.5rem}
    .expert-grid{grid-template-columns:1fr;gap:2.25rem}
    .contact-card{grid-template-columns:1fr}
    .contact-meta{grid-template-columns:1fr}
    .form-row{grid-template-columns:1fr!important}
    .sec-pad{padding:6rem 0!important}
  }

  /* ===== BENTO responsive ===== */
  @media(max-width:1024px){
    /* Kacheln dürfen schrumpfen (kein Grid-Blowout / horizontaler Overflow) */
    .bento-grid>*{min-width:0}
    /* Orange-Kreis-Kachel einfangen (kein Overflow) – iPad-Halbspalte wie Phone-Vollbreite */
    .b-messung{aspect-ratio:4/5;min-height:0!important;overflow:hidden!important;align-self:start}
    .b-messung img{height:100%!important}
  }
  @media(min-width:769px) and (max-width:1024px){
    /* iPad: echtes 2-Spalten-Bento statt einer Spalte */
    .bento-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:none;grid-auto-rows:auto;grid-template-areas:"intro intro" "orange region" "sanierung messung" "probe probe" "partner partner";gap:1.25rem}
    .b-sanierung,.b-probe{min-height:18.75rem}
  }
  @media(max-width:768px){
    /* Phone: eine Spalte */
    .bento-grid{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:auto;grid-template-areas:"intro" "orange" "sanierung" "region" "probe" "messung" "partner"}
    .b-sanierung,.b-probe{min-height:18.75rem}
    /* Kreis-Kachel auf dem Phone niedriger (quadratisch statt 4/5) */
    .b-messung{aspect-ratio:1}
    /* Partner-Chips einspaltig, voll breit, Text einzeilig (kein Umbruch) */
    .b-partner>div:last-child{display:grid!important;grid-template-columns:1fr;gap:0.75rem}
    .b-partner>div:last-child>span{justify-content:center;text-align:center}
  }

  /* ===== WARUM: Textblock ab iPad mittig zentrieren ===== */
  @media(max-width:1024px){
    #warum .two-col>div:last-child{text-align:center}
    #warum .two-col>div:last-child>p{margin-left:auto!important;margin-right:auto!important}
    #warum .two-col>div:last-child>div:last-child{max-width:34rem;margin-left:auto;margin-right:auto;text-align:left}
  }
  @media(max-width:600px){
    /* Warum-Eyebrow einzeilig (etwas enger als die globale Mobil-Regel) */
    #warum [style*="letter-spacing:.18em"]{letter-spacing:.04em!important}
  }

  /* ===== ÜBER UNS: Porträt begrenzen (sonst zu hoch) + Punkte auf iPad 2-spaltig ===== */
  @media(max-width:1024px){
    .expert-portrait{max-width:22rem;justify-self:center;margin-left:auto;margin-right:auto}
    .expert-cta{display:flex!important;width:fit-content;margin-left:auto;margin-right:auto}
  }
  @media(min-width:601px) and (max-width:1024px){
    .expert-checks{grid-template-columns:1fr 1fr!important}
  }

  /* ===== RESPONSIVE: Smartphone (bis 600px) ===== */
  @media(max-width:600px){
    .container{padding:0 1.25rem}
    .services-grid{grid-template-columns:1fr}
    .usp-grid{grid-template-columns:1fr}
    .process-timeline{grid-template-columns:1fr;gap:2.25rem}
    .faq-grid{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}
    .fuerwen-grid{grid-template-columns:1fr}
    .hero-cta{flex-direction:column}
    .hero-cta>a{width:100%;justify-content:center}
    .h1{font-size:clamp(2.25rem,11vw,3rem)!important}
    .sec-pad{padding:4.5rem 0!important}
    .stats-band{padding:3.5rem 0 3rem!important}
    /* Eyebrows (Orange-Kicker) auf Phone enger + minimal kleiner → mittellange einzeilig, lange brechen ausbalanciert */
    [style*="letter-spacing:.18em"]{letter-spacing:.08em!important;font-size:0.6875rem!important;text-wrap:balance}
    /* Hero-Eyebrow: volle Zeile aus, Kurzform an */
    .eb-full{display:none}
    .eb-short{display:inline}
    /* Für-wen-Tabs: auf dem Phone einspaltig */
    .fw-tabs{grid-template-columns:1fr!important}
  }