/*
Theme Name: Bauunternehmen MS Core
Theme URI: https://www.bauunternehmen-ms.de/
Template: gewerkstark-core
Author: Sven Rother
Description: Child theme of gewerkstark-core for Bauunternehmen MS. Inherits the shared engine plumbing (contact form, consent, tokens, image pipeline) and overrides the homepage design with the bespoke "Bauakte" documentary layout. All copy is data-driven from customers/bauunternehmen-ms/content.json.
Version: 0.1.0
Requires PHP: 8.1
Text Domain: bauunternehmen-ms
*/

/* ============================================================
   DESIGNSYSTEM v3 – ruhig, warm, dokumentarisch („Bauakte")
   Palette bestätigt (Kontraste geprüft: Fließtext ~10:1,
   Muted ~5,5:1, CTA weiß auf Ziegel-dark ~6:1)
   ============================================================ */
:root{
  --graphit:#1F2428;
  --graphit-soft:#343A40;
  --text:#343A40;
  --muted:#565C61;
  --offwhite:#F6F1E8;
  --greige:#DDD4C5;
  --greige-soft:#EAE3D6;
  --stahlblau:#243F56;
  --stahlblau-soft:#365D78;
  --ziegel:#B85F3D;
  --ziegel-dark:#984B30;
  --oliv:#68715A;
  --oliv-dark:#535B47;
  --linie:#D6CABB;
  --weiss:#FFFFFF;

  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --serif:"Iowan Old Style",Palatino,"Palatino Linotype","Book Antiqua",Georgia,serif;

  --radius:14px;
  --radius-s:9px;
  --schatten:0 1px 2px rgba(31,36,40,.05),0 14px 34px -18px rgba(31,36,40,.22);
  --uebergang:.22s ease;
  --container:1160px;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none!important;transition:none!important;}
}
body{
  margin:0;
  font-family:var(--font);
  font-size:1.0625rem;
  line-height:1.65;
  color:var(--text);
  background:var(--offwhite);
  -webkit-font-smoothing:antialiased;
}
img,svg{display:block;max-width:100%;}
figure{margin:0;}
a{color:var(--ziegel-dark);text-underline-offset:3px;}
a:hover{color:var(--ziegel);}
:focus-visible{outline:3px solid var(--stahlblau-soft);outline-offset:2px;border-radius:4px;}
::selection{background:var(--ziegel);color:var(--weiss);}

h1,h2,h3,h4{color:var(--graphit);line-height:1.15;margin:0 0 .6em;font-weight:750;letter-spacing:-.018em;}
h1{font-size:clamp(1.9rem,3.5vw,2.7rem);text-wrap:balance;}
h2{font-size:clamp(1.7rem,3.1vw,2.35rem);text-wrap:balance;}
h3{font-size:1.17rem;line-height:1.35;}
p{margin:0 0 1em;max-width:64ch;}
p:last-child{margin-bottom:0;}
small{color:var(--muted);}

.container{max-width:var(--container);margin-inline:auto;padding-inline:clamp(1.1rem,4vw,2rem);}
.sektion{padding-block:clamp(4rem,8vw,6.5rem);}
.sektion--greige{background:var(--greige-soft);border-block:1px solid var(--linie);}
.sektion--dunkel{background:var(--stahlblau);color:#DCE5EC;}
.sektion--dunkel h2,.sektion--dunkel h3{color:var(--weiss);}
.sektion--dunkel .kicker{color:#9FB6C8;}
.sektion--dunkel .lead{color:#C4D2DD;}

.kicker{
  display:block;font-size:.8rem;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--stahlblau-soft);margin-bottom:.9rem;
}
.lead{font-size:1.16rem;color:var(--muted);max-width:60ch;}
.sec-kopf{max-width:780px;margin-bottom:clamp(2.2rem,4.5vw,3.2rem);}
.zentriert{margin-inline:auto;text-align:center;}
.zentriert .lead{margin-inline:auto;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--font);font-size:1rem;font-weight:650;line-height:1.2;
  padding:.95rem 1.5rem;border-radius:999px;border:1.5px solid transparent;
  cursor:pointer;text-decoration:none;transition:background var(--uebergang),color var(--uebergang),border-color var(--uebergang),transform var(--uebergang);
}
.btn:active{transform:translateY(1px);}
.btn .pfeil{transition:transform var(--uebergang);}
.btn:hover .pfeil{transform:translateX(3px);}
.btn-primary{background:var(--ziegel-dark);color:var(--weiss);}
.btn-primary:hover{background:var(--ziegel);color:var(--weiss);}
.btn-outline{background:transparent;color:var(--graphit);border-color:var(--graphit-soft);}
.btn-outline:hover{background:var(--graphit);color:var(--offwhite);}
.btn-hell{background:var(--offwhite);color:var(--stahlblau);}
.btn-hell:hover{background:var(--weiss);color:var(--stahlblau);}
.cta-reihe{display:flex;flex-wrap:wrap;gap:.9rem;}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(246,241,232,.92);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid transparent;
  transition:border-color var(--uebergang),box-shadow var(--uebergang);
}
.site-header.ist-gescrollt{border-bottom-color:var(--linie);box-shadow:0 6px 18px -14px rgba(31,36,40,.28);}
.header-inner{display:flex;align-items:center;gap:1.3rem;min-height:66px;}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;margin-right:auto;}
.brand-name{font-weight:800;font-size:1.04rem;letter-spacing:.015em;color:var(--graphit);line-height:1.1;display:block;white-space:nowrap;}
.brand-name b{color:var(--ziegel-dark);}
.brand-sub{display:block;font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-top:.15rem;}
.hauptnav ul{display:flex;gap:1.2rem;list-style:none;margin:0;padding:0;}
.hauptnav a{font-size:.94rem;font-weight:600;color:var(--graphit-soft);text-decoration:none;padding-block:.4rem;white-space:nowrap;}
.hauptnav a:hover{color:var(--ziegel-dark);}
.header-cta.im-menue{display:none;}
.nav-toggle{display:none;background:none;border:0;padding:.6rem;margin-right:-.6rem;cursor:pointer;}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--graphit);margin:5px 0;border-radius:2px;transition:transform var(--uebergang),opacity var(--uebergang);}

/* ---------- Mobile Sticky-Kontaktleiste (Kanäle via JS aus data-Attributen) ---------- */
.mobil-leiste{
  position:fixed;inset-inline:0;bottom:0;z-index:70;
  display:none;gap:1px;background:var(--linie);
  border-top:1px solid var(--linie);
  padding-bottom:env(safe-area-inset-bottom,0);
}
.mobil-leiste a{
  flex:1;display:flex;align-items:center;justify-content:center;gap:.45rem;
  background:var(--weiss);color:var(--graphit);text-decoration:none;
  font-size:.92rem;font-weight:650;padding:.95rem .5rem;min-height:52px;
}
.mobil-leiste a.ist-primaer{background:var(--ziegel-dark);color:var(--weiss);}

/* ---------- Bildflächen (Platzhalter für echte Fotografie) ---------- */
.bild{
  position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--linie);box-shadow:var(--schatten);
  background-color:var(--greige);
}
.bild::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    repeating-linear-gradient(0deg,rgba(31,36,40,.028) 0 1px,transparent 1px 3px),
    repeating-linear-gradient(90deg,rgba(246,241,232,.035) 0 1px,transparent 1px 3px);
}
.bild-chip{
  position:absolute;left:.9rem;bottom:.9rem;z-index:2;
  background:rgba(246,241,232,.92);border:1px solid var(--linie);
  color:var(--muted);font-size:.72rem;font-weight:600;letter-spacing:.03em;
  padding:.32rem .75rem;border-radius:999px;white-space:nowrap;
}
.bild--hero{aspect-ratio:4/3;background-image:
  linear-gradient(to top,rgba(31,36,40,.82) 0,rgba(31,36,40,.5) 11%,rgba(31,36,40,0) 32%),
  linear-gradient(104deg,rgba(255,250,240,0) 44%,rgba(255,250,240,.5) 50% 60%,rgba(255,250,240,0) 66%),
  linear-gradient(160deg,#EAE1D2 0%,#CFC1AB 46%,#9E927E 100%);
}
.bild--portraet{aspect-ratio:4/5;background-image:
  linear-gradient(to top,rgba(31,36,40,.28),rgba(31,36,40,0) 40%),
  radial-gradient(120% 95% at 50% 18%,#F0E9DC 0%,#D8CDBB 55%,#AFA28D 100%);
}
.bild--akte{aspect-ratio:4/3;background-image:
  linear-gradient(145deg,#EFE8DA 0%,#DAD0BE 58%,#C6B9A3 100%);
}
.bild--innen{aspect-ratio:4/3;background-image:
  linear-gradient(to top,rgba(24,27,30,.78),rgba(24,27,30,0) 30%),
  radial-gradient(58% 46% at 66% 38%,rgba(246,238,224,.5),rgba(246,238,224,0) 72%),
  linear-gradient(#F6EFE2 0 0),
  linear-gradient(180deg,#7A6F5E 0%,#4C4840 100%);
  background-repeat:no-repeat;
  background-size:auto,auto,24% 58%,auto;
  background-position:0 0,0 0,64% 16%,0 0;
}
.bild--rohbau{aspect-ratio:4/3;background-image:
  linear-gradient(to top,rgba(31,36,40,.62),rgba(31,36,40,0) 24%),
  linear-gradient(to bottom,#E9E4D8 0 18%,rgba(0,0,0,0) 18%),
  repeating-linear-gradient(90deg,transparent 0 84px,rgba(246,241,232,.55) 84px 88px),
  repeating-linear-gradient(180deg,#CBC0AC 0 30px,#BDB19C 30px 33px);
}
.bild--split{aspect-ratio:16/8;background:
  linear-gradient(97deg,#6E675C 0 49.5%,#F1EBDF 50.5% 100%);}
.bild--split::before{
  content:"";position:absolute;inset:0 50% 0 0;
  background:
    repeating-linear-gradient(12deg,rgba(31,36,40,.09) 0 3px,transparent 3px 11px),
    linear-gradient(to top,rgba(31,36,40,.35),transparent 55%);
}
.split-label{
  position:absolute;top:.9rem;z-index:2;font-size:.74rem;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;padding:.3rem .7rem;border-radius:999px;
}
.split-label.ist-vorher{left:.9rem;background:rgba(31,36,40,.55);color:#F6F1E8;}
.split-label.ist-nachher{right:.9rem;background:rgba(246,241,232,.9);color:var(--graphit-soft);border:1px solid var(--linie);}

/* ---------- Hero (kompakt, alles Wichtige im ersten Viewport) ---------- */
.hero{padding-block:clamp(1.4rem,3vw,2.4rem) clamp(2.2rem,4vw,3.2rem);}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:clamp(1.8rem,4vw,3.6rem);align-items:stretch;}
.hero-grid > div:first-child{align-self:center;}
.hero .kicker{margin-bottom:.7rem;}
.hero h1{margin-bottom:.5em;}
.hero .lead{font-size:1.07rem;max-width:54ch;}
.hero .cta-reihe{margin-top:1.35rem;}
.hero-media{display:flex;min-width:0;}
.bild--hero{flex:1;aspect-ratio:auto;min-height:440px;}
.bild--hero .bild-chip{left:auto;right:.9rem;top:.9rem;bottom:auto;}
.hero-slogan-overlay{
  position:absolute;left:1.25rem;bottom:1.1rem;z-index:2;
  font-family:var(--serif);font-style:italic;font-size:1.22rem;color:var(--offwhite);
  text-shadow:0 1px 10px rgba(31,36,40,.55);
}
.proof-mini{list-style:none;margin:1.3rem 0 0;padding:1rem 0 0;border-top:1px solid var(--linie);display:grid;gap:.45rem;max-width:54ch;}
.proof-mini li{position:relative;padding-left:1.55rem;font-size:.92rem;color:var(--graphit-soft);}
.proof-mini li::before{content:"";position:absolute;left:0;top:.42em;width:.6rem;height:.6rem;background:var(--ziegel-dark);border-radius:2px;}
.einstiege{
  list-style:none;margin:clamp(1.4rem,2.6vw,2rem) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--linie);border:1px solid var(--linie);
  border-radius:var(--radius-s);overflow:hidden;
}
.einstiege a{
  display:flex;align-items:center;justify-content:space-between;gap:.9rem;height:100%;
  padding:.95rem 1.15rem;background:var(--weiss);
  color:var(--graphit);text-decoration:none;font-weight:600;font-size:.95rem;line-height:1.35;
  transition:background var(--uebergang),color var(--uebergang);
}
.einstiege a:hover{background:var(--greige-soft);color:var(--ziegel-dark);}
.einstiege .pfeil{color:var(--ziegel-dark);flex:none;}

/* ---------- Leitclaim-Band ---------- */
.claimband{background:var(--greige-soft);border-block:1px solid var(--linie);padding-block:clamp(1.7rem,3.4vw,2.4rem);}
.claimband p{margin:0;max-width:none;text-align:center;}
.claim-haupt{font-family:var(--serif);font-style:italic;font-size:clamp(1.25rem,2.4vw,1.6rem);color:var(--graphit);}
.claim-sub{margin-top:.55rem;font-size:.92rem;color:var(--muted);}

/* ---------- Situationen ---------- */
.situationen{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2rem,4.5vw,4rem);}
.situation{padding:1.3rem .15rem 1.25rem;border-top:1px solid var(--linie);}
.situation h3{margin-bottom:.3rem;font-size:1.08rem;}
.situation p{color:var(--muted);font-size:.99rem;margin:0;}
.sinnvoll-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(2.4rem,5vw,4.5rem);align-items:start;}
.sinnvoll-grid .bild{position:sticky;top:100px;}
.sinnvoll-schluss{margin-top:1.9rem;display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;}
.sinnvoll-schluss p{margin:0;color:var(--muted);font-size:.99rem;}

/* ---------- Angebotsprüfung ---------- */
.angebot-grid{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(2.4rem,5vw,4.75rem);align-items:center;}
.pruef-punkte{list-style:none;margin:1.4rem 0;padding:0;display:grid;gap:.6rem;max-width:58ch;}
.pruef-punkte li{position:relative;padding-left:1.7rem;}
.pruef-punkte li::before{content:"";position:absolute;left:0;top:.52em;width:.62rem;height:.62rem;background:var(--ziegel-dark);border-radius:2px;}
.pruef-punkte b{color:var(--graphit);}
.mini-ablauf{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;margin:1.2rem 0 0;padding:0;list-style:none;font-size:.92rem;color:var(--graphit-soft);counter-reset:ma;}
.mini-ablauf li{counter-increment:ma;display:flex;align-items:baseline;gap:.5rem;}
.mini-ablauf li::before{content:counter(ma,decimal-leading-zero);font-size:.78rem;font-weight:800;color:var(--ziegel-dark);}
.fair-note{
  margin-top:1.4rem;padding:1.05rem 1.25rem;border-left:3px solid var(--oliv);
  background:rgba(104,113,90,.09);border-radius:0 var(--radius-s) var(--radius-s) 0;
  font-size:.99rem;color:var(--graphit-soft);max-width:58ch;
}
.klein-note{margin-top:1.1rem;font-size:.88rem;color:var(--muted);max-width:58ch;}

/* ---------- Sanierungsfahrplan mit Deliverables ---------- */
.fahrplan{
  background:var(--weiss);border:1px solid var(--linie);border-radius:var(--radius);
  box-shadow:var(--schatten);overflow:hidden;
}
.fahrplan-kopf{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem 1.5rem;
  padding:1.15rem 1.7rem;background:var(--graphit);color:var(--offwhite);
}
.fahrplan-kopf strong{font-size:1.02rem;letter-spacing:.02em;}
.fahrplan-kopf span{font-size:.85rem;color:#B9B2A4;}
.fahrplan-liste{list-style:none;margin:0;padding:.4rem 1.7rem .9rem;display:grid;grid-template-columns:1fr 1fr;column-gap:3rem;}
.fahrplan-liste li{display:flex;gap:1.05rem;padding:1.05rem 0;border-bottom:1px solid var(--greige-soft);}
.fahrplan-liste li:nth-last-child(-n+2){border-bottom:0;}
.schritt-nr{
  flex:none;font-size:.86rem;font-weight:800;color:var(--ziegel-dark);
  letter-spacing:.03em;padding-top:.2rem;min-width:2rem;
}
.fahrplan-liste h3{font-size:1.03rem;margin-bottom:.2rem;}
.fahrplan-liste p{font-size:.94rem;color:var(--muted);margin:0;}
.schritt-erhalt{display:block;margin-top:.4rem;font-size:.85rem;color:var(--oliv-dark);}
.schritt-erhalt b{font-weight:750;}
.fahrplan-fuss{padding:1rem 1.7rem 1.3rem;font-size:.92rem;color:var(--muted);border-top:1px solid var(--greige-soft);}

/* ---------- Leistungen (Aufklapp-Liste, erste Einträge offen) ---------- */
.leistungen-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.4rem,5vw,4.5rem);align-items:start;}
.gruppe-titel{
  font-size:.83rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;
  color:var(--stahlblau-soft);margin:0 0 1rem;padding-bottom:.7rem;border-bottom:2px solid var(--graphit);
}
.acc{border-bottom:1px solid var(--linie);}
.acc summary{
  list-style:none;cursor:pointer;display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  padding:1.05rem .1rem;
}
.acc summary::-webkit-details-marker{display:none;}
.acc summary h3{margin:0;font-size:1.06rem;transition:color var(--uebergang);}
.acc summary:hover h3{color:var(--ziegel-dark);}
.acc-zeichen{
  flex:none;width:1.55rem;height:1.55rem;border:1.5px solid var(--linie);border-radius:50%;
  position:relative;transition:border-color var(--uebergang);align-self:center;
}
.acc-zeichen::before,.acc-zeichen::after{content:"";position:absolute;inset:0;margin:auto;background:var(--graphit-soft);}
.acc-zeichen::before{width:.75rem;height:1.5px;}
.acc-zeichen::after{width:1.5px;height:.75rem;transition:transform var(--uebergang);}
.acc[open] .acc-zeichen{border-color:var(--ziegel-dark);}
.acc[open] .acc-zeichen::after{transform:scaleY(0);}
.acc-inhalt{padding:0 .1rem 1.35rem;}
.acc-inhalt dl{margin:0 0 .9rem;display:grid;gap:.55rem;}
.acc-inhalt dt{font-size:.76rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:var(--stahlblau-soft);}
.acc-inhalt dd{margin:0 0 .2rem;font-size:.97rem;color:var(--graphit-soft);}
.acc-inhalt .karten-link{font-weight:650;text-decoration:none;font-size:.97rem;}
.leistung-bild{margin-top:2rem;}

/* ---------- Vergleich (Warum MS) ---------- */
.vergleich{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.1rem;align-items:stretch;}
.spalte{border:1px solid var(--linie);border-radius:var(--radius);padding:1.5rem 1.4rem;background:transparent;}
.spalte h3{font-size:1.02rem;padding-bottom:.85rem;border-bottom:1px solid var(--linie);margin-bottom:.4rem;}
.spalte.ist-ms{background:var(--weiss);border-color:var(--ziegel-dark);border-top-width:3px;box-shadow:var(--schatten);}
.aspekt{padding:.8rem 0;border-bottom:1px solid var(--greige-soft);}
.aspekt:last-child{border-bottom:0;padding-bottom:0;}
.aspekt-label{display:block;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:.18rem;}
.aspekt p{margin:0;font-size:.94rem;color:var(--graphit-soft);}
.spalte.ist-ms .aspekt p{color:var(--graphit);}
.aspekt.ist-engpass p{font-weight:650;color:var(--graphit);}
.spalte.ist-ms .aspekt.ist-engpass p{color:var(--ziegel-dark);}
.vergleich-note{margin-top:1.6rem;font-size:.92rem;color:var(--muted);max-width:70ch;}

/* ---------- Transparenz (dunkles Band) + Rollen-Diagramm ---------- */
.rollen-liste{list-style:none;margin:2rem 0 0;padding:0;max-width:840px;}
.rollen-liste li{
  padding:1.15rem 0;border-top:1px solid rgba(220,229,236,.22);
  font-size:1.05rem;color:#E7EDF2;display:flex;gap:1rem;
}
.rollen-liste li:last-child{border-bottom:1px solid rgba(220,229,236,.22);}
.rollen-liste .marker{flex:none;width:.62rem;height:.62rem;margin-top:.52em;background:var(--ziegel);border-radius:2px;}
.fluss{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:1rem;align-items:stretch;margin-top:2.4rem;}
.fluss-box{background:rgba(246,241,232,.07);border:1px solid rgba(220,229,236,.28);border-radius:var(--radius-s);padding:1.15rem 1.2rem;}
.fluss-box strong{display:block;color:var(--weiss);font-size:1rem;margin:.2rem 0 .3rem;}
.fluss-box p{margin:0;font-size:.88rem;color:#C4D2DD;}
.fluss-tag{font-size:.7rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#9FB6C8;}
.fluss-box.ist-de .fluss-tag{color:#E8B98F;}
.fluss-box.ist-de{border-color:rgba(216,138,90,.55);}
.fluss-pfeil{align-self:center;color:#9FB6C8;}
.rollen-note{margin-top:1.6rem;font-size:.93rem;color:#9FB6C8;max-width:72ch;}

/* ---------- Transparenz-Akte: Musterdokumente ---------- */
.akte-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.4rem,3vw,2.2rem);align-items:stretch;}
.doc{
  position:relative;background:var(--weiss);border:1px solid var(--linie);border-radius:var(--radius);
  box-shadow:var(--schatten);overflow:hidden;display:flex;flex-direction:column;
}
.doc-kopf{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:.95rem 1.4rem;background:var(--graphit);color:var(--offwhite);
}
.doc-kopf strong{font-size:.95rem;}
.doc-kopf span{font-size:.78rem;color:#B9B2A4;white-space:nowrap;}
.doc-body{padding:1.2rem 1.4rem 1.4rem;position:relative;flex:1;}
.doc-body::before{ /* MUSTER-Wasserzeichen */
  content:"MUSTER";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:clamp(3rem,7vw,4.5rem);font-weight:800;letter-spacing:.18em;color:rgba(31,36,40,.055);
  transform:rotate(-16deg);pointer-events:none;
}
.doc-meta{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin:0 0 1rem;font-size:.88rem;}
.doc-meta dt{font-weight:750;color:var(--graphit);}
.doc-meta dd{margin:0;color:var(--graphit-soft);}
.doc-abschnitt{margin-top:.9rem;}
.doc-abschnitt h4{font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--stahlblau-soft);margin:0 0 .4rem;}
.doc-abschnitt ul{list-style:none;margin:0;padding:0;display:grid;gap:.3rem;font-size:.92rem;color:var(--graphit-soft);}
.doc-abschnitt li{position:relative;padding-left:1.15rem;}
.doc-abschnitt li::before{content:"";position:absolute;left:0;top:.52em;width:.42rem;height:.42rem;background:var(--linie);border-radius:1px;}
.doc-pos{padding:.75rem 0;border-bottom:1px solid var(--greige-soft);font-size:.92rem;}
.doc-pos:last-of-type{border-bottom:0;}
.doc-pos b{display:block;color:var(--graphit);}
.doc-pos span{color:var(--graphit-soft);}
.doc-fuss{padding:.9rem 1.4rem;border-top:1px solid var(--greige-soft);font-size:.85rem;color:var(--muted);background:var(--offwhite);}
.prinzip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem;margin-top:clamp(1.6rem,3vw,2.2rem);}
.prinzip{background:var(--weiss);border:1px solid var(--linie);border-radius:var(--radius);padding:1.35rem 1.3rem;box-shadow:var(--schatten);}
.prinzip h3{font-size:1.02rem;margin-bottom:.45rem;}
.prinzip p{font-size:.93rem;color:var(--graphit-soft);margin:0;}
.prinzip dl{margin:.2rem 0 0;font-size:.9rem;}
.prinzip dt{font-weight:750;color:var(--graphit);margin-top:.55rem;}
.prinzip dd{margin:0;color:var(--muted);}
.akte-note{margin-top:1.6rem;font-size:.9rem;color:var(--muted);max-width:76ch;}

/* ---------- Messen vs. Nicht-versprechen ---------- */
.grenzen-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2.2rem,4.5vw,4rem);align-items:start;}
.check,.keine{display:flex;gap:.9rem;padding:.95rem 0;border-bottom:1px solid var(--linie);}
.check svg,.keine svg{flex:none;margin-top:.3rem;}
.check h3,.keine h3{font-size:1.01rem;margin-bottom:.12rem;}
.check p,.keine p{font-size:.93rem;color:var(--muted);margin:0;}
.spalten-titel{font-size:.83rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--stahlblau-soft);margin:0 0 .6rem;padding-bottom:.6rem;border-bottom:2px solid var(--graphit);}

/* ---------- Projekte: Dossier-Format + Anfragen ---------- */
.projekt-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(2rem,4.5vw,3.6rem);align-items:stretch;}
.dossier .doc-body::before{content:"VORLAGE";}
.dossier-felder{list-style:none;margin:0;padding:0;}
.dossier-felder li{display:flex;justify-content:space-between;gap:1rem;padding:.62rem 0;border-bottom:1px solid var(--greige-soft);font-size:.93rem;}
.dossier-felder li:last-child{border-bottom:0;}
.dossier-felder b{color:var(--graphit);font-weight:700;}
.dossier-felder span{color:var(--muted);}
.anfragen-liste{list-style:none;margin:clamp(2rem,4vw,2.8rem) 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(2rem,4.5vw,4rem);}
.anfragen-liste li{padding:1.05rem .1rem;border-top:1px solid var(--linie);}
.anfragen-liste h3{font-size:1.03rem;margin-bottom:.2rem;}
.anfragen-liste p{font-size:.94rem;color:var(--muted);margin:0;}

/* ---------- Region ---------- */
.region-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2.4rem,5vw,4.5rem);align-items:center;}
.region-karte{border:1px solid var(--linie);border-radius:var(--radius);background:var(--weiss);box-shadow:var(--schatten);padding:1rem;}
.region-karte svg{width:100%;height:auto;}
.region-punkte{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;gap:.7rem;max-width:56ch;}
.region-punkte li{position:relative;padding-left:1.7rem;color:var(--graphit-soft);font-size:.99rem;}
.region-punkte li::before{content:"";position:absolute;left:0;top:.5em;width:.62rem;height:.62rem;background:var(--stahlblau-soft);border-radius:2px;}

/* ---------- Über uns ---------- */
.ueber-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(2.4rem,5vw,4.75rem);align-items:center;}
.signatur{
  margin:1.8rem 0 0;padding-left:1.4rem;border-left:3px solid var(--ziegel-dark);
  font-family:var(--serif);font-style:italic;font-size:1.22rem;color:var(--graphit);max-width:46ch;
}
.signatur footer{margin-top:.55rem;font-family:var(--font);font-style:normal;font-size:.9rem;font-weight:650;color:var(--muted);}
.ueber-punkte{list-style:none;margin:1.7rem 0 0;padding:0;display:grid;gap:.6rem;}
.ueber-punkte li{position:relative;padding-left:1.7rem;font-size:.99rem;color:var(--graphit-soft);}
.ueber-punkte li::before{content:"";position:absolute;left:0;top:.5em;width:.62rem;height:.62rem;background:var(--ziegel-dark);border-radius:2px;}

/* ---------- FAQ ---------- */
.faq-liste{max-width:860px;}
.faq-liste .acc-inhalt p{max-width:66ch;color:var(--graphit-soft);font-size:1rem;}

/* ---------- Kontakt ---------- */
.kontakt-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(2.2rem,4.5vw,3.6rem);align-items:start;}
.formular{
  background:var(--weiss);border:1px solid var(--linie);border-radius:var(--radius);
  box-shadow:var(--schatten);padding:clamp(1.5rem,3.4vw,2.4rem);
}
.feld{margin-bottom:1.1rem;}
.feld-reihe{display:grid;grid-template-columns:1fr 1fr;gap:1.05rem;}
.feld label,.feld-label{display:block;font-size:.86rem;font-weight:700;color:var(--graphit);margin-bottom:.4rem;}
.feld input,.feld select,.feld textarea{
  width:100%;font:inherit;font-size:1rem;color:var(--graphit);
  background:var(--offwhite);border:1.5px solid var(--linie);border-radius:var(--radius-s);
  padding:.85rem .95rem;transition:border-color var(--uebergang),background var(--uebergang);
}
.feld textarea{min-height:110px;resize:vertical;}
.feld input:focus,.feld select:focus,.feld textarea:focus{outline:none;border-color:var(--stahlblau-soft);background:var(--weiss);}
.feld ::placeholder{color:#8B9096;}
.feld input[type="file"]{padding:.65rem .8rem;background:var(--weiss);}
.feld input[type="file"]::file-selector-button{
  font:inherit;font-size:.9rem;font-weight:650;color:var(--graphit);
  background:var(--greige-soft);border:1px solid var(--linie);border-radius:999px;
  padding:.45rem 1rem;margin-right:.9rem;cursor:pointer;
}
.optional-block{border:1px dashed var(--linie);border-radius:var(--radius-s);padding:0 1.05rem;margin-bottom:1.1rem;background:var(--offwhite);}
.optional-block summary{list-style:none;cursor:pointer;padding:.95rem 0;font-size:.95rem;font-weight:650;color:var(--stahlblau-soft);}
.optional-block summary::-webkit-details-marker{display:none;}
.optional-block summary::before{content:"+ ";font-weight:800;}
.optional-block[open] summary::before{content:"– ";}
.optional-block .feld:last-child{margin-bottom:1.05rem;}
.checkbox-zeile{display:flex;gap:.7rem;align-items:flex-start;font-size:.88rem;color:var(--graphit-soft);margin:0 0 1.25rem;}
.checkbox-zeile input{width:1.05rem;height:1.05rem;margin-top:.2rem;flex:none;accent-color:var(--ziegel-dark);}
.hp-feld{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;}
.form-hinweis{font-size:.85rem;color:var(--muted);margin:0 0 1.2rem;max-width:60ch;}
.danke-box{
  margin-top:1.2rem;padding:1.15rem 1.25rem;border-radius:var(--radius-s);
  background:rgba(104,113,90,.12);border:1px solid rgba(104,113,90,.4);color:#3F4636;
}
.danke-box h3{font-size:1.05rem;color:#3F4636;margin-bottom:.4rem;}
.danke-box ol{margin:.2rem 0 .6rem;padding-left:1.2rem;font-size:.93rem;display:grid;gap:.25rem;}
.danke-box .demo-note{font-size:.8rem;color:#5E6653;margin:0;}
.kontakt-box{
  background:var(--graphit);color:#E8E3D9;border-radius:var(--radius);
  padding:clamp(1.5rem,3vw,2.1rem);box-shadow:var(--schatten);
}
.kontakt-box h3{color:var(--weiss);font-size:1.12rem;margin-bottom:1.2rem;}
.kontakt-zeile{padding:.85rem 0;border-top:1px solid rgba(232,227,217,.16);}
.kontakt-zeile dt{font-size:.74rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#A8A294;}
.kontakt-zeile dd{margin:.2rem 0 0;font-size:1.01rem;color:var(--weiss);}
.kontakt-zeile small{display:block;color:#A8A294;font-size:.83rem;margin-top:.1rem;}
.kontakt-microcopy{list-style:none;margin:1.4rem 0 0;padding:1.2rem 0 0;border-top:1px solid rgba(232,227,217,.16);display:grid;gap:.55rem;}
.kontakt-microcopy li{position:relative;padding-left:1.5rem;font-size:.92rem;color:#CFC9BD;}
.kontakt-microcopy li::before{content:"";position:absolute;left:0;top:.5em;width:.55rem;height:.55rem;background:var(--ziegel);border-radius:2px;}

/* ---------- Footer ---------- */
.site-footer{background:var(--graphit);color:#B9B2A4;padding:clamp(3rem,6vw,4.5rem) 0 0;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2.4rem;padding-bottom:2.6rem;}
.footer-marke p{font-size:.94rem;max-width:38ch;margin-top:1.1rem;}
.footer-spalte h4{color:var(--offwhite);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:1rem;}
.footer-spalte ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;}
.footer-spalte a{color:#B9B2A4;text-decoration:none;font-size:.95rem;}
.footer-spalte a:hover{color:var(--offwhite);}
.footer-spalte li{font-size:.95rem;}
.footer-unten{
  display:flex;flex-wrap:wrap;gap:.8rem 2rem;justify-content:space-between;align-items:center;
  padding:1.4rem 0 1.6rem;border-top:1px solid rgba(232,227,217,.14);font-size:.88rem;
}
.footer-unten p{margin:0;}
.rechtslinks{display:flex;gap:1.6rem;}
.rechtslinks a{color:#B9B2A4;}

/* ---------- Skip-Link ---------- */
.skip-link{
  position:absolute;left:-999px;top:.6rem;z-index:100;
  background:var(--graphit);color:var(--offwhite);padding:.7rem 1.1rem;border-radius:8px;font-weight:650;text-decoration:none;
}
.skip-link:focus{left:.6rem;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
  .hauptnav{
    position:fixed;inset:66px 0 auto 0;z-index:59;
    background:var(--offwhite);border-bottom:1px solid var(--linie);
    padding:1.2rem clamp(1.1rem,4vw,2rem) 1.6rem;
    transform:translateY(-130%);transition:transform .28s ease;
    max-height:calc(100vh - 66px);overflow:auto;box-shadow:0 24px 40px -24px rgba(31,36,40,.3);
  }
  body.nav-offen{overflow:hidden;} /* Scroll-Lock bei offenem Menü */
  body.nav-offen .hauptnav{transform:translateY(0);}
  .hauptnav ul{flex-direction:column;gap:.15rem;}
  .hauptnav a{display:block;padding:.8rem .2rem;font-size:1.08rem;border-bottom:1px solid var(--greige-soft);}
  .header-cta{display:none;}
  .header-cta.im-menue{display:inline-flex;margin-top:1.2rem;}
  .nav-toggle{display:block;}
  body.nav-offen .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  body.nav-offen .nav-toggle span:nth-child(2){opacity:0;}
  body.nav-offen .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

  .hero-grid,.sinnvoll-grid,.angebot-grid,.leistungen-grid,.region-grid,.ueber-grid,
  .akte-grid,.grenzen-grid,.projekt-grid{grid-template-columns:1fr;}
  .bild--hero{min-height:0;aspect-ratio:16/10;}
  .einstiege{grid-template-columns:1fr;}
  .sinnvoll-grid .bild{position:static;order:-1;}
  .angebot-grid .bild{order:-1;}
  .vergleich{grid-template-columns:1fr;max-width:640px;}
  .spalte.ist-ms{order:-1;}
  .fluss{grid-template-columns:1fr;}
  .fluss-pfeil{transform:rotate(90deg);justify-self:center;}
  .prinzip-grid{grid-template-columns:1fr;}
  .kontakt-grid{grid-template-columns:1fr;}
}
@media (max-width:760px){
  body{padding-bottom:56px;}
  .mobil-leiste{display:flex;}
  .situationen,.anfragen-liste{grid-template-columns:1fr;}
  .fahrplan-liste{grid-template-columns:1fr;padding-inline:1.25rem;}
  .fahrplan-liste li:nth-last-child(-n+2){border-bottom:1px solid var(--greige-soft);}
  .fahrplan-liste li:last-child{border-bottom:0;}
  .fahrplan-kopf,.fahrplan-fuss{padding-inline:1.25rem;}
  .feld-reihe{grid-template-columns:1fr;gap:0;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .bild--split{aspect-ratio:16/10;}
}
@media (max-width:560px){
  .footer-grid{grid-template-columns:1fr;}
  .cta-reihe .btn{width:100%;justify-content:center;}
}
@media print{
  .site-header,.mobil-leiste,.skip-link{display:none;}
}