/* Vorschau Stil B (v2) – "technisches Datenblatt". Aktiv nur mit ?stil=b (Klasse html.stil-b).
   Flächen-System: 1) Weiß = Seite  2) Hellgrau = Produktbild-Flächen + EIN Akzentband je Seite  3) Blau = Kontakt/Footer
   Linien statt Schatten, 4–6 px Ecken, normale Schriftbreite, keine Deko-Elemente. */
html.stil-b{
  --r:6px;--r-lg:6px;--shadow:none;--shadow-h:none;
  --paper:#ffffff;--creme:#f4f3f0;--line:#e2ded7;--line-d:#cfc9bf;--grau:#f4f3f0;
}
html.stil-b body{background:#fff}

/* ---------- Kopf: weiß, Linie; oranger Streifen oben + blaue Seitenleiste bleiben (Markenelemente) ---------- */
html.stil-b header.site{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:1px solid var(--line)}
html.stil-b nav.main a{border-radius:0;padding:9px 11px}
html.stil-b nav.main a:hover{background:none;color:var(--blau);box-shadow:inset 0 -2px 0 var(--line-d)}
html.stil-b nav.main a.active{background:none;color:var(--blau);box-shadow:inset 0 -2px 0 var(--orange)}
html.stil-b nav.main a.navcta{border-radius:4px;box-shadow:none;padding:10px 16px}
html.stil-b nav.main a.navcta:hover{box-shadow:none;color:#fff}
html.stil-b .pop{border-radius:4px;border:1px solid var(--line);box-shadow:0 10px 24px -14px rgba(0,0,0,.3)}
html.stil-b nav.main .pop a{border-radius:0}

/* ---------- Typografie ---------- */
html.stil-b h1,html.stil-b h2,html.stil-b h3{font-stretch:100%!important;letter-spacing:-.015em}
html.stil-b h1,html.stil-b h2{font-weight:700}
html.stil-b h3{font-weight:700!important}
html.stil-b .eyebrow{text-transform:none;letter-spacing:0;font-size:.92rem;font-weight:600;color:var(--muted)}
html.stil-b .pill-eyebrow,html.stil-b .phead .num{background:none;padding:0;border-radius:0;color:var(--muted);font-weight:600;letter-spacing:0;text-transform:none;font-size:.95rem}
html.stil-b .pill-eyebrow b,html.stil-b .phead .num::before{display:none}

/* ---------- Seitenkopf Unterseiten: weiß, fließt in die Seite ---------- */
html.stil-b .pagehead{background:#fff;border-bottom:0;padding-bottom:0}
html.stil-b .phead{padding-bottom:28px;border-bottom:1px solid var(--line)}
html.stil-b .phead h1{font-size:clamp(2rem,4.4vw,3rem)}

/* ---------- Knöpfe, Links ---------- */
html.stil-b .btn{border-radius:4px;box-shadow:none!important;transform:none!important}
html.stil-b .labbox a,html.stil-b .katbtn{border-radius:4px}
html.stil-b .arr{display:none}
html.stil-b .themlink{background:none;padding:0;border-radius:0;text-decoration:underline;text-underline-offset:3px}

/* ---------- Karten: weiß + Linie, Bildfläche hellgrau ---------- */
html.stil-b .area,html.stil-b .art,html.stil-b .artcard,html.stil-b .cutcard,html.stil-b .werkstoffe,html.stil-b .stepsbox,html.stil-b .postcard,html.stil-b .galerie figure,html.stil-b .grp,html.stil-b .card{background:#fff!important;border:1px solid var(--line);box-shadow:none!important;border-radius:6px!important;transform:none!important}
html.stil-b .artcard:hover,html.stil-b .area:hover,html.stil-b a.cutcard:hover,html.stil-b .postcard:hover{border-color:var(--blau)}
html.stil-b .artcard .aimg,html.stil-b .area .ph,html.stil-b .fimg,html.stil-b .galerie img,html.stil-b .grp .ph,html.stil-b .card .ph{background:var(--grau)!important;border-bottom:0}
html.stil-b .artcard .aimg{border-radius:5px 5px 0 0}
html.stil-b .area:hover .ph img{transform:none}
html.stil-b .area .n,html.stil-b .grp .kap{text-transform:none!important;letter-spacing:0!important;font-size:.9rem!important;color:var(--muted)!important}

/* Etiketten nur als Text */
html.stil-b .badge{background:none!important;padding:0;border-radius:0;text-transform:none;letter-spacing:0;font-size:.85rem;font-weight:600}
html.stil-b .badge.eigen{color:var(--gruen)}
html.stil-b .badge.spez{color:var(--muted)}
html.stil-b .seccount{background:none;padding:0;color:var(--muted);text-transform:none;letter-spacing:0;font-size:.9rem;font-weight:600}
html.stil-b .werkstoffe ul{display:block}
html.stil-b .werkstoffe li{display:inline;background:none;padding:0;border-radius:0}
html.stil-b .werkstoffe li:not(:last-child)::after{content:" · ";color:var(--muted)}

/* Entfernt: Vorteils-Band, Formeln, Kennzahlen ohne Zahl, schwebende Etiketten, 01/02/03 */
html.stil-b .kband,html.stil-b .claimband,html.stil-b .facts,html.stil-b .chip,html.stil-b .shead p,html.stil-b .wi,html.stil-b .cnum{display:none!important}
html.stil-b section:has(> .wrap > .kband){display:none}

/* ---------- Abschnittsköpfe: Linie oben = Datenblatt-Raster ---------- */
html.stil-b .shead{border-top:1px solid var(--line);padding-top:22px;margin-bottom:22px}
html.stil-b .shead h2,html.stil-b .secname{font-size:clamp(1.5rem,2.6vw,1.9rem)!important}
html.stil-b .secblock{border-top:1px solid var(--line);padding-top:26px;margin-top:30px}

/* ---------- Startseite ---------- */
html.stil-b .hero{background:#fff}
html.stil-b .hgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:48px!important;padding-block:40px 48px!important;align-items:center}
html.stil-b .hero h1{font-size:clamp(2.1rem,4.2vw,3.4rem)!important;line-height:1.05}
html.stil-b .hero h1 em{color:inherit}
html.stil-b .stage{border-radius:6px;background:var(--grau);box-shadow:none;aspect-ratio:4/3}
html.stil-b .slide{inset:6% 8% 12% 8%}
html.stil-b .slide img{animation:none}
html.stil-b .dot::before{background:var(--line-d)}
/* Akzentband: Kapitel-Teaser */
html.stil-b .chapbox{background:var(--grau);border:0;border-radius:6px}
html.stil-b .checks svg circle,html.stil-b .usplist li svg circle{fill:none;stroke:var(--gruen);stroke-width:1.6}
html.stil-b .checks svg path,html.stil-b .usplist li svg path{stroke:var(--gruen)}
/* Warum pbs: drei Spalten mit oranger Kopflinie */
html.stil-b .why{gap:28px}
html.stil-b .why>div{background:none!important;border:0!important;border-top:2px solid var(--orange)!important;border-radius:0!important;padding:18px 0 0!important}
html.stil-b .ctabox{border-radius:6px}
html.stil-b .ctabox .im{-webkit-mask-image:none;mask-image:none}
html.stil-b footer.site{border-radius:0;margin-top:56px}

/* ---------- Kapitelseite: Intro als ein Akzentband ---------- */
html.stil-b .usplist{padding-top:30px}
html.stil-b .uspbox{background:var(--grau);border:0;border-radius:6px}
html.stil-b .usplist li{background:none!important;box-shadow:none!important;border-radius:0;padding:0}
html.stil-b .labbox{border-radius:6px;box-shadow:none;background:var(--blau)}
/* Schnittarten als Tabellenraster (geteilte Linien) */
html.stil-b .cutgrid{gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
html.stil-b .cutcard{border:0!important;border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)!important;border-radius:0!important}
html.stil-b a.cutcard:hover{background:var(--grau)!important}

@media(max-width:860px){html.stil-b .hgrid{grid-template-columns:1fr!important}.why{gap:20px}}
@media(max-width:560px){html.stil-b .hero h1{font-size:1.9rem!important;hyphens:auto}}

/* ---------- Service-Karten: Bild oben, vollständig sichtbar ---------- */
html.stil-b .sv-block{grid-template-columns:1fr!important;border:1px solid var(--line);border-radius:6px!important}
html.stil-b .sv-block .ph{aspect-ratio:auto!important;height:260px;background:var(--grau)!important;padding:14px;border-bottom:1px solid var(--line)}
html.stil-b .sv-block .ph img{width:100%!important;height:100%!important;object-fit:contain!important}
html.stil-b .sv-gal img{object-fit:contain!important;background:var(--grau)}

/* Vorschau-Schalter (nicht mehr verwendet) */
html.stil-b .sv-block{align-content:start!important;grid-template-rows:auto 1fr}
html.stil-b .sv-block .ph{height:300px!important}
html.stil-b .sv-block .bd{justify-content:flex-start!important}
html.stil-b .sv-block .kap,html.stil-b .ml-sec .kap{text-transform:none!important;letter-spacing:0!important;font-size:.9rem!important;color:var(--muted)!important}