/* ==========================================================================
   Ingenieurbüro Kuntzsch GmbH — gemeinsames Stylesheet für alle Seiten
   ==========================================================================
   Vorher hatte jede Seite ihren eigenen <style>-Block, oft mit demselben
   Klassennamen aber unterschiedlichen Regeln (zwei Nav-Stile, zwei
   Markengrün-Töne, drei "cta-sec"-Bedeutungen, ...). Diese Datei führt das
   zu EINEM Design-System zusammen:
     1) Basis (Reset, Variablen, Typografie)
     2) Geteilte Komponenten (Nav, Buttons, Footer, Breadcrumb, ...)
     3) Die zwei Hero-Familien ("Startseite/Kategorie" und "Leistungsdetail")
     4) Seiteneigene Komponenten, die nirgends sonst vorkommen
     5) Vereinzelte Ausnahmen für einzelne Seiten (klar kommentiert)
   Markengrün ist einheitlich RGB(0,128,0).
   ========================================================================== */

/* Schriftart "Outfit" selbst gehostet statt über Google Fonts geladen —
   vermeidet die Übertragung der Besucher-IP an Google (fonts.googleapis.com/
   fonts.gstatic.com) beim Seitenaufruf. Variable Schriftdatei, deckt die
   genutzten Schnitte 300–700 ab; Lizenz: SIL Open Font License 1.1,
   siehe fonts/OFL.txt. Latin-Subset genügt für deutsche Texte (inkl. äöüß). */
@font-face{
  font-family:'Outfit';
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url('fonts/Outfit.woff2') format('woff2');
}

/* ---------- 1. Basis ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
:root{
  --g:#008000;--g-dk:#006400;--g-lt:#E6F5E6;--g-xlt:#F0FAF0;
  --w:#FFFFFF;--bg:#F8F9F6;--ink:#1C1C1C;--mut:#5F6660;--bdr:#E0E4DC;
}
body{background:var(--w);color:var(--ink);font-family:'Outfit',sans-serif;font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}

/* ---------- 2.1 Trust-Bar ---------- */
.trust-bar{background:var(--g);padding:8px 5vw;display:flex;align-items:center;justify-content:center;gap:2rem;flex-wrap:wrap}
.trust-bar span{font-size:12px;font-weight:500;color:rgba(255,255,255,.82);letter-spacing:.04em}
.trust-bar strong{color:#fff}
.trust-bar .s{color:rgba(255,255,255,.3)}

/* ---------- 2.2 Navigation ---------- */
nav{position:sticky;top:0;z-index:100;height:64px;background:rgba(255,255,255,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--bdr);padding:0 5vw;display:flex;align-items:center;gap:3rem;transition:box-shadow .2s}
nav.up{box-shadow:0 2px 20px rgba(0,0,0,.07)}
.nav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.nav-logo img{height:36px;width:auto}
.nav-sp{flex:1}
.nav-search{position:relative;display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--bdr);border-radius:100px;padding:7px 14px;width:190px;flex-shrink:0;transition:border-color .15s,width .15s}
.nav-search:focus-within{border-color:var(--g);width:230px}
.nav-search svg{width:15px;height:15px;stroke:var(--mut);fill:none;stroke-width:2;flex-shrink:0}
.nav-search input{border:none;background:none;outline:none;font-family:'Outfit',sans-serif;font-size:13px;color:var(--ink);width:100%}
.nav-search input::placeholder{color:var(--mut)}
.nav-search input::-webkit-search-cancel-button{display:none}
.search-results{position:absolute;top:calc(100% + 10px);left:0;width:280px;background:#fff;border:1px solid var(--bdr);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.12);max-height:360px;overflow-y:auto;display:none;z-index:250}
.search-results.open{display:block}
.search-result{display:block;padding:10px 14px;text-decoration:none;color:inherit;border-bottom:1px solid var(--bdr)}
.search-result:last-child{border-bottom:none}
.search-result:hover{background:var(--g-lt)}
.search-result-title{font-size:13.5px;font-weight:600;color:var(--ink)}
.search-result-desc{font-size:12px;color:var(--mut);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-empty{padding:14px;font-size:13px;color:var(--mut);text-align:center}
.nav-ul{display:flex;align-items:center;gap:.25rem;list-style:none}
.nav-ul>li>a{font-size:14px;color:var(--mut);text-decoration:none;padding:6px 12px;border-radius:6px;transition:color .15s,background .15s;display:block}
.nav-ul>li>a:hover,.nav-ul>li>a.active{color:var(--ink);background:var(--bg)}
.nav-cta{padding:9px 20px;border-radius:7px;background:var(--g);color:#fff;font-size:13px;font-weight:500;text-decoration:none;flex-shrink:0;transition:background .15s,transform .15s;letter-spacing:.02em}
.nav-cta:hover{background:var(--g-dk);transform:translateY(-1px)}

.has-drop{position:relative}
.has-drop>a::after{content:'▾';margin-left:4px;font-size:10px}
.drop{position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--bdr);border-radius:10px;padding:.5rem;min-width:220px;box-shadow:0 8px 24px rgba(0,0,0,.1);opacity:0;pointer-events:none;transform:translateY(6px);transition:opacity .18s,transform .18s;z-index:200}
.has-drop:hover .drop,
.has-drop:focus-within .drop,
.has-drop.open .drop{opacity:1;pointer-events:auto;transform:translateY(0)}
.drop-link{display:block;padding:9px 14px;font-size:13px;color:var(--ink);text-decoration:none;border-radius:6px;transition:background .12s,color .12s;white-space:nowrap}
.drop-link:hover{background:var(--g-lt);color:var(--g)}

/* ---------- 2.3 Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:8px;padding:13px 24px;border-radius:8px;font-size:14px;font-weight:500;text-decoration:none;cursor:pointer;border:none;font-family:'Outfit',sans-serif;transition:all .2s;letter-spacing:.02em}
.btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:2.2}
.btn-g{background:var(--g);color:#fff;box-shadow:0 4px 14px rgba(0,128,0,.25)}
.btn-g:hover{background:var(--g-dk);transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,128,0,.35)}
.btn-o{background:#fff;color:var(--ink);border:1.5px solid var(--bdr)}
.btn-o:hover{border-color:var(--g);color:var(--g)}
/* Sekundär-Button auf dunklem Hero (Schall/UVP) */
.btn-o--on-dark{background:transparent;color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.2)}
.btn-o--on-dark:hover{border-color:rgba(255,255,255,.5);color:#fff}

.btn-white{background:#fff;color:var(--g);font-size:14px;font-weight:600;padding:13px 28px;border-radius:7px;text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:background .15s,opacity .15s}
.btn-white:hover{background:var(--g-xlt)}
.btn-white svg{width:14px;height:14px;stroke:var(--g);fill:none;stroke-width:2.2}

/* ---------- 2.4 Breadcrumb ---------- */
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--mut);margin-bottom:1.5rem;flex-wrap:wrap}
.breadcrumb a{color:var(--mut);text-decoration:none}
.breadcrumb a:hover{color:var(--g)}
.breadcrumb .sep{color:var(--bdr)}

/* ---------- 2.5 Abschnitts-Überschriften ---------- */
.sec-label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--g);margin-bottom:.7rem}
.sec-title{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:.6rem}
.sec-sub{font-size:15px;color:var(--mut);max-width:600px;line-height:1.7;margin-bottom:2rem}
.hero-eyebrow{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);margin-bottom:1rem}

/* ---------- 2.6 Footer ---------- */
footer{background:var(--ink);border-top:3px solid var(--g);padding:3rem 5vw 1.75rem}
.foot-top{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:2.5rem}
.fn{font-size:15px;font-weight:700;color:#fff;margin-bottom:6px}
.fa{font-size:13px;color:rgba(255,255,255,.55);line-height:1.8}
.ft{font-size:13px;color:rgba(255,255,255,.6);margin-top:8px}
.fe{font-size:13px;color:#8fcf5a;text-decoration:none;display:block;margin-top:3px}
.fh{font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:.9rem}
.fl{list-style:none;display:flex;flex-direction:column;gap:7px}
.fl a{font-size:13px;color:rgba(255,255,255,.5);text-decoration:none}
.fl a:hover{color:#8fcf5a}
.foot-bot{padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem}
.fc{font-size:11.5px;color:rgba(255,255,255,.5)}

/* ==========================================================================
   3. HERO-FAMILIE A — Startseite / Kategorie-Seiten
   (ibk_v3, karriere, geschichte, referenzen, kategorie_wind/umwelt/betrieb/immissionen)
   ========================================================================== */
.hero{background:var(--bg);padding:5rem 5vw;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.012) 1px,transparent 1px);background-size:80px 80px;pointer-events:none}
.hero>.hero-inner{position:relative;z-index:1;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 420px;gap:4rem;align-items:end}
.hero-l{display:flex;flex-direction:column;justify-content:center;background:transparent;border:none;position:relative;z-index:1}
.hero-l h1,.hero h1{font-size:clamp(2.2rem,3.4vw,3.4rem);font-weight:700;line-height:1.1;color:var(--ink);letter-spacing:-.03em;margin-bottom:1.25rem}
.hero-l h1 em,.hero h1 em{color:var(--g);font-style:normal}
.hero-sub{font-size:16px;color:var(--mut);line-height:1.75;max-width:480px;margin-bottom:2rem}
.hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.bank-strip{display:flex;align-items:center;gap:14px;padding:14px 18px;border-left:3px solid var(--g);background:var(--g-lt);border-radius:0 8px 8px 0;margin-bottom:2.5rem}
.bank-ico{width:32px;height:32px;border-radius:6px;background:var(--g);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bank-ico svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2}
.bank-t{font-size:13px;font-weight:600;color:var(--g)}
.bank-s{font-size:12px;color:var(--mut);margin-top:1px}

.hero-r{position:relative;z-index:1;background:radial-gradient(circle at top right,#e8f5e8,#f0f7f0 50%,#f8f9f6);padding:3.5rem 3rem;display:flex;flex-direction:column;justify-content:center;gap:1.5rem}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sc{background:rgba(255,255,255,.85);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.9);border-radius:12px;padding:1.5rem 1.25rem;box-shadow:0 2px 12px rgba(0,0,0,.04)}
.sc .n{font-size:2rem;font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em}
.sc .n span{color:var(--g)}
.sc .l{font-size:10.5px;font-weight:600;color:var(--mut);text-transform:uppercase;letter-spacing:.1em;margin-top:5px}
.iso-bar{background:var(--g);border-radius:12px;padding:14px 18px;display:flex;align-items:center;gap:10px;box-shadow:0 4px 14px rgba(0,128,0,.2)}
.iso-bar svg{width:16px;height:16px;stroke:rgba(255,255,255,.8);fill:none;stroke-width:1.8;flex-shrink:0}
.iso-t{font-size:13px;font-weight:600;color:#fff}
.iso-s{font-size:11px;color:rgba(255,255,255,.65);margin-top:1px}

/* Kategorie-Kacheln "Weitere Leistungen in dieser Kategorie" (lk-*) */
.sec{padding:4rem 5vw;border-top:1px solid var(--bdr)}
.lk-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.lk-grid.cols2{grid-template-columns:repeat(2,1fr)}
.lk-grid.cols1{grid-template-columns:1fr;max-width:520px;margin:0 auto}
.lk-card{background:#fff;border:1px solid var(--bdr);border-radius:12px;padding:2rem;text-decoration:none;display:block;color:inherit;transition:border-color .2s,box-shadow .2s;position:relative;overflow:hidden}
.lk-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--g);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.lk-card:hover{border-color:var(--g);box-shadow:0 4px 20px rgba(0,128,0,.08)}
.lk-card:hover::before{transform:scaleX(1)}
.lk-ico{width:44px;height:44px;border-radius:9px;background:var(--g-lt);display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem}
.lk-ico svg{width:26px;height:26px;stroke:var(--g);fill:none;stroke-width:1.8}
.lk-norm{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--g);margin-bottom:.5rem}
.lk-name{font-size:17px;font-weight:700;color:var(--ink);margin-bottom:.5rem}
.lk-desc{font-size:13.5px;color:var(--mut);line-height:1.65;margin-bottom:1.25rem}
.lk-tags{display:flex;flex-wrap:wrap;gap:6px}
.lk-tag{font-size:11px;color:var(--mut);background:var(--bg);padding:3px 9px;border-radius:100px;border:1px solid var(--bdr)}
.lk-footer{display:flex;align-items:center;justify-content:space-between}
.lk-arrow{position:absolute;bottom:1.5rem;right:1.5rem;width:32px;height:32px;border-radius:50%;background:var(--g-lt);display:flex;align-items:center;justify-content:center;transition:background .2s}
.lk-card:hover .lk-arrow{background:var(--g)}
.lk-arrow svg{width:14px;height:14px;stroke:var(--g);fill:none;stroke-width:2.5;transition:stroke .2s}
.lk-card:hover .lk-arrow svg{stroke:#fff}

/* Kategorie-Kreuzverlinkung "Weitere Kategorien" — bewusst eigener Name,
   damit sie nicht mit den größeren .other-card der Leistungsseiten kollidiert */
.catlink-sec{padding:3rem 5vw;border-top:1px solid var(--bdr)}
.catlink-inner{max-width:1000px;margin:0 auto}
.catlink-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:1.25rem}
.catlink{border:1px solid var(--bdr);border-radius:8px;padding:1rem 1.25rem;text-decoration:none;display:flex;align-items:center;gap:10px;transition:border-color .15s}
.catlink:hover{border-color:var(--g)}
.catlink-ico{width:28px;height:28px;border-radius:6px;background:var(--g-lt);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.catlink-ico svg{width:13px;height:13px;stroke:var(--g);fill:none;stroke-width:2}
.catlink-name{font-size:13px;font-weight:500;color:var(--ink)}

/* Grüner CTA-Banner, in dieser Bedeutung auf allen Kategorieseiten,
   geschichte.html und den Leistungsdetailseiten (dort als .cta-strip) gleich */
.cta-sec,.cta-strip{background:var(--g);padding:4rem 5vw}
.cta-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:3rem;flex-wrap:wrap}
.cta-inner h3{font-size:1.5rem;font-weight:700;color:#fff;letter-spacing:-.01em}
.cta-inner p{font-size:15px;color:rgba(255,255,255,.7);margin-top:.4rem}

/* ==========================================================================
   4. HERO-FAMILIE B — Leistungsdetailseiten (alle 12 leistung_*.html)
   ========================================================================== */
.hero-lp{background:var(--bg);padding:4.5rem 5vw 0;position:relative;overflow:hidden}
.hero-lp::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.02) 1px,transparent 1px);background-size:60px 60px}
.hero-lp>.hero-inner{position:relative;z-index:1;display:grid;grid-template-columns:1fr 480px;gap:4rem;align-items:end;max-width:1200px;margin:0 auto}
.hero-text{padding-bottom:4rem;position:relative;z-index:1}
.phase-badge{display:inline-flex;align-items:center;gap:7px;padding:5px 14px;background:var(--g-lt);border-radius:100px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--g);margin-bottom:1.5rem}
.hero-text h1{font-size:clamp(2.6rem,5vw,4.2rem);font-weight:700;line-height:1.04;color:var(--ink);letter-spacing:-.025em;margin-bottom:1rem}
.hero-text h1 em{color:var(--g);font-style:normal}
.hero-tagline{font-size:17px;color:var(--mut);line-height:1.7;max-width:480px;margin-bottom:2rem}
.norm-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;background:var(--g-lt);border:1px solid rgba(0,128,0,.25);border-radius:6px;font-size:12px;font-weight:600;color:var(--g);margin-bottom:2rem}

/* Hero-Grafik: gerahmte, zentrierte SVG-Illustration (Standardfall) */
.hero-img{background:rgba(0,128,0,.05);border:1px solid rgba(0,128,0,.12);border-radius:14px 14px 0 0;display:flex;align-items:center;justify-content:center;padding:2.5rem;min-height:320px;position:relative;align-self:center}
/* Hero-Grafik: echtes Foto, randabschneidend (Artenschutz/LBP/Kartierung/UVP) */
.hero-img-photo{border-radius:12px;overflow:hidden;height:340px;position:relative;align-self:center}
.hero-img-photo img{width:100%;height:100%;object-fit:cover;object-position:center;display:block;opacity:.9}
.hero-img-caption{position:absolute;bottom:0;left:0;right:0;padding:.75rem 1rem;background:linear-gradient(transparent,rgba(0,0,0,.6));font-size:11px;color:rgba(255,255,255,.8);font-style:italic}

.content{padding:5rem 5vw;max-width:1200px;margin:0 auto}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;margin-bottom:4rem}
.intro-text h2{font-size:clamp(1.6rem,2.5vw,2.1rem);font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:1rem}
.intro-grid .intro-text p{font-size:15.5px;color:var(--mut);line-height:1.75;margin-bottom:1.1rem}

.specs-grid{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:1.5rem}
/* Normen-Tabellen (Akkreditierung) — an die Tabellendarstellung der Altseite angelehnt */
.norm-head{font-size:1rem;font-weight:600;color:var(--ink);margin:2rem 0 .6rem}
.norm-head:first-of-type{margin-top:0}
.norm-scroll{overflow-x:auto;margin-bottom:1rem}
.norm-table{width:100%;min-width:640px;border-collapse:collapse;font-size:13px;border:1px solid var(--bdr);border-radius:8px;overflow:hidden}
.norm-table th{text-align:left;padding:.65rem 1rem;background:var(--g);color:#fff;font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.norm-table td{padding:.7rem 1rem;border-bottom:1px solid var(--bdr);color:var(--ink);vertical-align:top;line-height:1.55;background:#fff}
.norm-table tbody tr:last-child td{border-bottom:none}
.norm-table tbody tr:nth-child(even) td{background:var(--bg)}
.norm-table td:first-child,.norm-table th:first-child{width:34px;color:var(--mut);font-weight:600}
.norm-table td:nth-last-child(2),.norm-table th:nth-last-child(2){width:110px}
.norm-table td:last-child,.norm-table th:last-child{width:130px;text-align:center}
.specs-box{background:var(--bg);border:1px solid var(--bdr);border-radius:12px;overflow:hidden}
.specs-box .specs-title{padding:1rem 1.5rem;background:var(--g);font-size:11px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#fff}
.spec-row{display:flex;align-items:flex-start;gap:1rem;padding:.9rem 1.5rem;border-bottom:1px solid var(--bdr);background:#fff}
.spec-row:last-child{border-bottom:none}
.spec-label{font-size:12px;font-weight:600;color:var(--mut);min-width:130px;flex-shrink:0;padding-top:1px}
.spec-val{font-size:13px;color:var(--ink);line-height:1.5}

.method-sec{background:var(--bg);border-top:1px solid var(--bdr);border-bottom:1px solid var(--bdr);padding:5rem 5vw}
.method-inner{max-width:1200px;margin:0 auto}
.steps{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem;margin-top:2.5rem}
.step{background:#fff;border:1px solid var(--bdr);border-radius:12px;padding:2rem;display:flex;gap:1.25rem;align-items:flex-start}
.step-num{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--g);background:var(--g-lt);width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:2px}
.step-title{font-size:14.5px;font-weight:600;color:var(--ink);margin-bottom:.35rem}
.step-desc{font-size:13px;color:var(--mut);line-height:1.65}

/* "Weitere Leistungen" — ausführliche Kartenvariante */
.other-sec{padding:5rem 5vw;border-top:1px solid var(--bdr);background:var(--bg)}
.other-sec-inner{max-width:1200px;margin:0 auto}
.other-label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--g);margin-bottom:.5rem}
.other-sec h4{font-size:1.6rem;font-weight:700;color:var(--ink);margin-bottom:.5rem;letter-spacing:-.02em}
.other-context{font-size:14px;color:var(--mut);margin-bottom:2rem}
.other-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.other-grid.cols2{grid-template-columns:repeat(2,1fr)}
.other-grid.cols1{grid-template-columns:1fr;max-width:380px}
.other-card{background:#fff;border:1px solid var(--bdr);border-radius:12px;padding:1.5rem;text-decoration:none;display:block;color:inherit;transition:border-color .2s,box-shadow .2s,transform .2s}
.other-card:hover{border-color:var(--g);box-shadow:0 4px 16px rgba(0,128,0,.08);transform:translateY(-2px)}
.other-card-title{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:.4rem}
.other-card-desc{font-size:12.5px;color:var(--mut);line-height:1.6;margin-bottom:.75rem}
.other-card-link{font-size:12px;font-weight:600;color:var(--g)}

/* "Weitere Leistungen" — knappe Link-Pill-Variante (Schall/UVP) */
.otherlinks-sec{padding:4rem 5vw;border-top:1px solid var(--bdr);max-width:1200px;margin:0 auto}
.otherlinks-sec h4{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);margin-bottom:1.25rem}
.other-links{display:flex;gap:10px;flex-wrap:wrap}
.other-link{padding:8px 16px;border:1px solid var(--bdr);border-radius:7px;font-size:13px;color:var(--mut);text-decoration:none;transition:border-color .15s,color .15s}
.other-link:hover{border-color:var(--g);color:var(--g)}

/* ---------- 5. Seiteneigene Komponenten (kollisionsfrei, unverändert) ---------- */

/* ibk_v3.html — Tabs, Bankfähigkeit, Kontaktformular */
.tabs{display:flex;gap:10px;margin-bottom:2.5rem;overflow-x:auto;padding-bottom:6px}
.tab{padding:12px 22px;font-size:14px;font-weight:600;color:var(--ink);background:var(--bg);border:1.5px solid var(--bdr);border-radius:100px;cursor:pointer;font-family:'Outfit',sans-serif;transition:background .2s,color .2s,border-color .2s,box-shadow .2s;white-space:nowrap;text-decoration:none;display:flex;align-items:center;gap:9px;flex-shrink:0}
.tab:hover{border-color:var(--g);color:var(--g)}
.tab.active{background:var(--g);color:#fff;border-color:var(--g);box-shadow:0 4px 14px rgba(0,128,0,.25)}
.tab-ico{width:20px;height:20px;display:flex;align-items:center;justify-content:center}
.tab-ico svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.tab-panel{display:none}
.tab-panel.active{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.tab-panel.active.cols3{display:flex;flex-wrap:wrap;justify-content:center}
.tab-panel.active.cols3 .svc-card{flex:0 0 calc(25% - .75rem)}
.tab-panel.active.cols2{grid-template-columns:repeat(2,1fr);max-width:780px;margin:0 auto}
.tab-panel.active.cols1{grid-template-columns:1fr;max-width:380px;margin:0 auto}
.svc-card{background:#fff;border:1px solid var(--bdr);border-radius:12px;padding:1.75rem;position:relative;overflow:hidden;text-decoration:none;display:block;color:inherit;transition:border-color .2s,box-shadow .2s,transform .2s;box-shadow:0 2px 8px rgba(0,0,0,.03)}
.svc-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--g);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.svc-card:hover{border-color:var(--g);box-shadow:0 8px 24px rgba(0,128,0,.08);transform:translateY(-2px)}
.svc-card:hover::before{transform:scaleX(1)}
.svc-logo{margin-bottom:1.1rem}
.svc-name{font-size:14.5px;font-weight:700;color:var(--ink);margin-bottom:.4rem}
.svc-short{font-size:12.5px;color:var(--mut);line-height:1.6}

/* Dunkles 2-Spalten-Panel: Text links, Check-Liste rechts.
   Gemeinsame Komponente für ibk_v3.html ("Warum IBK?") und
   karriere.html ("Initiativbewerbung") — vorher zwei fast identische
   Bausteine (.bank-sec / .dark-cta) mit eigenem Klassensatz. */
.dark-panel{background:var(--ink);padding:5rem 5vw}
.dark-panel-grid{display:grid;grid-template-columns:1fr 1fr;gap:5rem;align-items:center;max-width:1100px;margin:0 auto}
.dark-panel-grid .sec-label{color:#8fcf5a}
.dark-panel-grid .sec-title{color:#fff;margin-bottom:1rem}
.dark-panel-text{color:rgba(255,255,255,.55);font-size:15px;line-height:1.75;margin-bottom:2rem}
.dark-panel-email{font-size:16px;font-weight:600;color:#8fcf5a;text-decoration:none;display:block;margin-bottom:1.5rem}
.dark-panel-list{border:1px solid rgba(255,255,255,.08);border-radius:12px;overflow:hidden;margin-top:1.5rem}
.dark-panel-row{display:flex;align-items:center;gap:12px;padding:1rem 1.4rem;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.06)}
.dark-panel-row:last-child{border-bottom:none}
.dark-panel-check{width:20px;height:20px;border-radius:50%;background:rgba(0,128,0,.35);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.dark-panel-check svg{width:10px;height:10px;stroke:#8fcf5a;fill:none;stroke-width:2.5}
.dark-panel-row p{font-size:13.5px;color:rgba(255,255,255,.8)}
.dark-panel-row p strong{color:#fff}

.contact-sec{padding:6rem 5vw;border-top:1px solid var(--bdr)}
.contact-inn{display:grid;grid-template-columns:1fr 1fr;gap:5rem;max-width:1100px;margin:0 auto;align-items:start}
.contact-inn.contact-inn--simple{grid-template-columns:1fr;max-width:640px}
.c-left h2{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:1rem}
.c-left h2 em{color:var(--g);font-style:normal}
.c-left p{font-size:15px;color:var(--mut);line-height:1.72;margin-bottom:1.5rem}
.guarantees{display:flex;flex-direction:column;gap:10px;margin-top:1.5rem}
.guar{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--mut)}
.guar svg{width:14px;height:14px;stroke:var(--g);fill:none;stroke-width:2;flex-shrink:0}
.direct-contact{margin-top:2rem;padding-top:2rem;border-top:1px solid var(--bdr)}
.dc-label{font-size:12px;color:var(--mut);margin-bottom:.5rem}
.dc-phone{font-size:18px;font-weight:700;color:var(--ink)}
.dc-email{font-size:14px;color:var(--g);margin-top:4px;display:block;text-decoration:none}
.dc-hours{font-size:13px;color:var(--mut);margin-top:6px}

/* team.html */
.abt-sec{padding:5rem 5vw;border-top:1px solid var(--bdr);background:#fff}
.abt-inner{max-width:1200px;margin:0 auto}
.abt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:3rem}
.abt-card{background:var(--bg);border:1px solid var(--bdr);border-radius:14px;padding:2rem;position:relative;overflow:hidden}
.abt-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--g)}
.abt-icon{width:40px;height:40px;background:var(--g-lt);border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:1.25rem}
.abt-icon svg{width:18px;height:18px;stroke:var(--g);fill:none;stroke-width:2}
.abt-title{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:.35rem;line-height:1.3}
.abt-count{font-size:12px;color:var(--g);font-weight:600;margin-bottom:1.25rem}
.abt-divider{height:1px;background:var(--bdr);margin-bottom:1.25rem}
.abt-person{border-bottom:1px solid var(--bdr)}
.abt-person:last-child{border-bottom:none}
.abt-name-row{display:flex;align-items:center;gap:8px;padding:9px 0}
.person-name{font-size:13px;font-weight:500;color:var(--ink);flex:1}
.loc-sec{padding:5rem 5vw;border-top:1px solid var(--bdr);background:#fff}
.loc-inner{max-width:1200px;margin:0 auto}
.loc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:3rem}
.loc-card{background:var(--bg);border:1px solid var(--bdr);border-radius:14px;padding:2rem;text-align:center}
.loc-icon{width:44px;height:44px;background:var(--g-lt);border-radius:10px;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;transition:background .15s}
.loc-icon svg{width:20px;height:20px;stroke:var(--g);fill:none;stroke-width:1.8;transition:stroke .15s}
.loc-icon:hover{background:var(--g)}
.loc-icon:hover svg{stroke:#fff}
.loc-city{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:.3rem;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.loc-badge{font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--g);background:var(--g-lt);padding:3px 8px;border-radius:100px}
.loc-region{font-size:13px;color:var(--mut)}
.loc-address{font-size:12.5px;color:var(--mut);margin-top:.5rem;line-height:1.5}
.loc-count{font-size:12px;font-weight:600;color:var(--g);margin-top:.4rem}
.foto-sec{padding:5rem 5vw;background:var(--bg);border-top:1px solid var(--bdr)}
.foto-inner{max-width:1200px;margin:0 auto}
.foto-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2.5rem}
.foto-card{border-radius:12px;overflow:hidden;position:relative;aspect-ratio:16/9}
.foto-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.foto-card:hover img{transform:scale(1.03)}
.foto-caption{position:absolute;bottom:0;left:0;right:0;padding:.75rem 1rem;background:linear-gradient(transparent,rgba(0,0,0,.65));font-size:11.5px;color:rgba(255,255,255,.85);font-style:italic;line-height:1.4}
.hero-stats{display:flex;gap:2.5rem}
.hs-n{font-size:2rem;font-weight:700;color:var(--ink);line-height:1}
.hs-n span{color:var(--g)}
.hs-l{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.1em;margin-top:4px}

/* geschichte.html */
.intro-sec{padding:5rem 5vw;border-bottom:1px solid var(--bdr)}
.intro-inner{max-width:900px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.intro-sec .intro-text p{font-size:16px;color:var(--mut);line-height:1.8;margin-bottom:1.25rem}
.intro-sec .intro-text p:last-child{margin-bottom:0}
.intro-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--bdr);border:1px solid var(--bdr);border-radius:12px;overflow:hidden}
.stat{background:#fff;padding:1.5rem;text-align:center}
.stat-n{font-size:2.8rem;font-weight:700;color:var(--ink);line-height:1;letter-spacing:-.03em}
.stat-n span{color:var(--g)}
.stat-l{font-size:11px;font-weight:500;color:var(--mut);text-transform:uppercase;letter-spacing:.1em;margin-top:5px}
.timeline-sec{padding:5rem 5vw;background:var(--bg)}
.timeline-inner{max-width:800px;margin:0 auto}
.tl-label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--g);margin-bottom:.7rem}
.tl-title{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:3rem}
.timeline{position:relative;padding-left:2rem}
.timeline::before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--g),var(--g-lt))}
.tl-item{position:relative;padding:0 0 3rem 2.5rem}
.tl-item:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:-2.5rem;top:4px;width:16px;height:16px;border-radius:50%;background:var(--g);border:3px solid #fff;box-shadow:0 0 0 2px var(--g);flex-shrink:0}
.tl-item.major .tl-dot{width:20px;height:20px;left:-2.625rem;top:2px;background:var(--g)}
.tl-year{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--g);text-transform:uppercase;margin-bottom:.4rem}
.tl-head{font-size:17px;font-weight:700;color:var(--ink);margin-bottom:.5rem;letter-spacing:-.01em}
.tl-body{font-size:14.5px;color:var(--mut);line-height:1.7}
.tl-item.major .tl-head{font-size:19px}
.tl-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;background:var(--g-lt);border-radius:100px;font-size:11px;font-weight:600;color:var(--g);margin-top:.6rem}
.intl-sec{padding:5rem 5vw;border-top:1px solid var(--bdr)}
.intl-inner{max-width:900px;margin:0 auto}
.intl-label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--g);margin-bottom:.7rem}
.intl-title{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:700;color:var(--ink);letter-spacing:-.02em;margin-bottom:1rem}
.intl-sub{font-size:15px;color:var(--mut);line-height:1.7;margin-bottom:2.5rem;max-width:600px}
.countries{display:flex;flex-wrap:wrap;gap:8px}
.country{padding:7px 14px;background:var(--bg);border:1px solid var(--bdr);border-radius:100px;font-size:13px;color:var(--mut);transition:border-color .15s,color .15s}
.country:hover{border-color:var(--g);color:var(--g)}
.akk-sec{background:var(--ink);padding:5rem 5vw}
.akk-inner{max-width:900px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.akk-label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#8fcf5a;margin-bottom:.7rem}
.akk-title{font-size:clamp(1.6rem,2.5vw,2.2rem);font-weight:700;color:#fff;letter-spacing:-.02em;margin-bottom:1rem}
.akk-text{font-size:15px;color:rgba(255,255,255,.5);line-height:1.75}
.akk-list{display:flex;flex-direction:column;gap:0;border:1px solid rgba(255,255,255,.08);border-radius:10px;overflow:hidden}
.akk-row{display:flex;align-items:flex-start;gap:10px;padding:.9rem 1.2rem;background:rgba(255,255,255,.04);border-bottom:1px solid rgba(255,255,255,.06)}
.akk-row:last-child{border-bottom:none}
.akk-dot{width:6px;height:6px;border-radius:50%;background:#8fcf5a;flex-shrink:0;margin-top:7px}
.akk-row p{font-size:13px;color:rgba(255,255,255,.75);line-height:1.55}

/* karriere.html */
.sec-inner{max-width:1100px;margin:0 auto}
.warum-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.warum-card{background:var(--bg);border:1px solid var(--bdr);border-radius:12px;padding:1.75rem;box-shadow:0 2px 8px rgba(0,0,0,.03)}
.warum-title{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:.5rem}
.warum-text{font-size:13px;color:var(--mut);line-height:1.65}
/* Zentrierte Info-Karte: Icon, Überschrift, Text, Buttons — wiederverwendet für
   "Keine offenen Stellen" (karriere.html) und den LinkedIn-Teaser (kategorie_aktuell.html) */
.info-card{background:#fff;border:1px solid var(--bdr);border-radius:14px;padding:3rem;text-align:center;max-width:600px;margin:0 auto;box-shadow:0 2px 12px rgba(0,0,0,.04)}
.info-card-ico{width:52px;height:52px;border-radius:50%;background:var(--g-lt);display:flex;align-items:center;justify-content:center;margin:0 auto 1.25rem}
.info-card-ico svg{width:24px;height:24px;stroke:var(--g);fill:none;stroke-width:1.5}
.info-card h3{font-size:18px;font-weight:700;color:var(--ink);margin-bottom:.6rem}
.info-card p{font-size:14px;color:var(--mut);line-height:1.7;margin-bottom:1.5rem}
.info-card-note{font-size:12px;color:var(--mut);margin-top:1rem}
.info-card-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.einstieg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.einstieg-card{background:#fff;border:1px solid var(--bdr);border-radius:12px;padding:2rem;position:relative;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.03)}
.einstieg-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--g)}
.einstieg-num{font-size:10px;font-weight:700;letter-spacing:.12em;color:var(--g);background:var(--g-lt);width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:1rem}
.einstieg-title{font-size:15px;font-weight:700;color:var(--ink);margin-bottom:.5rem}
.einstieg-text{font-size:13.5px;color:var(--mut);line-height:1.65}
.prozess-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--bdr);border:1px solid var(--bdr);border-radius:12px;overflow:hidden}
.pstep{background:#fff;padding:2rem 1.75rem}
.pstep-num{font-size:2rem;font-weight:700;color:var(--g);line-height:1;margin-bottom:.75rem}
.pstep-title{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:.5rem}
.pstep-text{font-size:13px;color:var(--mut);line-height:1.6}
/* dunkles 2-Spalten CTA-Panel — eigener Name, damit es nicht mit dem
   grünen .cta-sec-Banner der Kategorieseiten kollidiert */

/* referenzen.html */
.branchen-sec{padding:5rem 5vw}
.branchen-inner{max-width:1100px;margin:0 auto}
.branchen-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem 2rem;margin-top:2rem}
.branchen-item{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--ink);font-weight:500;padding:.9rem 1.1rem;background:var(--bg);border:1px solid var(--bdr);border-radius:10px}
.branchen-item::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--g);flex-shrink:0}

.projekte-sec{padding:5rem 5vw;background:var(--bg);border-top:1px solid var(--bdr)}
.projekte-inner{max-width:1100px;margin:0 auto}
.projekte-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin-top:2.5rem}
.projekt{background:#fff;border:1px solid var(--bdr);border-radius:14px;padding:2rem;position:relative;overflow:hidden}
.projekt::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--g)}
.projekt-year{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--g);text-transform:uppercase;margin-bottom:.5rem}
.projekt-title{font-size:16px;font-weight:700;color:var(--ink);margin-bottom:.4rem;line-height:1.3}
.projekt-client{font-size:12px;color:var(--mut);margin-bottom:1rem;font-weight:500}
.projekt-client span{color:var(--g);font-weight:600}
.projekt-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:1rem}
.projekt-tag{font-size:11px;padding:3px 10px;background:var(--g-lt);border-radius:100px;color:var(--g);font-weight:500}
.projekt-text{font-size:13.5px;color:var(--mut);line-height:1.65}
.testi-sec{padding:5rem 5vw}
.testi-inner{max-width:1100px;margin:0 auto}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;margin-top:2.5rem}
.testi{background:var(--bg);border:1px solid var(--bdr);border-radius:14px;padding:2rem;position:relative}
.testi-quote{font-size:3rem;line-height:1;color:var(--g-lt);font-family:Georgia,serif;margin-bottom:.5rem}
.testi-text{font-size:14.5px;color:var(--ink);line-height:1.7;font-style:italic;margin-bottom:1.5rem}
.testi-author{display:flex;flex-direction:column;gap:3px;padding-top:1rem;border-top:1px solid var(--bdr)}
.testi-name{font-size:13px;font-weight:700;color:var(--ink)}
.testi-role{font-size:12px;color:var(--mut)}
.testi-placeholder{font-size:10px;color:#ccc;margin-top:4px;font-style:italic}
.hero-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hstat{background:rgba(255,255,255,.6);border:1px solid rgba(0,0,0,.05);border-radius:12px;padding:1.5rem 1.25rem;text-align:left}
.hstat-n{font-size:1.6rem;font-weight:700;color:var(--ink);line-height:1}
.hstat-n span{color:var(--g)}
.hstat-l{font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.1em;margin-top:4px}

/* kategorie_umwelt.html — Video-Sektion + eigene Leistungs-Karten (.card) */
.leistungen-sec{padding:5rem 5vw;background:var(--bg)}
.leistungen-inner{max-width:1200px;margin:0 auto}

/* Einfacher, einspaltiger Hero (Rechtliches, Aktuelles — keine zweite Spalte nötig) */
.hero-lp.hero-lp--simple{padding:4.5rem 5vw;border-bottom:1px solid var(--bdr)}
.hero-lp.hero-lp--simple .hero-inner{display:block;max-width:800px;margin:0 auto}
.phase-badge.phase-badge--simple{margin-bottom:1.5rem}
.content .info-box{background:#fff;border:1px solid var(--bdr);border-radius:12px;overflow:hidden;margin-bottom:3rem}
.content h2{font-size:1.35rem;font-weight:700;color:var(--ink);margin:2.5rem 0 .75rem;letter-spacing:-.01em;padding-top:1rem;border-top:1px solid var(--bdr)}
.content h2:first-child{border-top:none;margin-top:0}
.content h3{font-size:1rem;font-weight:600;color:var(--ink);margin:1.75rem 0 .4rem}
.content p{color:var(--mut);line-height:1.8;margin-bottom:1rem;font-size:15px}
.content a{color:var(--g);text-decoration:none}
.content a:hover{text-decoration:underline}
.info-row{display:flex;gap:1rem;padding:.85rem 1.5rem;border-bottom:1px solid var(--bdr);font-size:14px}
.info-row:last-child{border-bottom:none}
.info-label{font-weight:600;color:var(--ink);min-width:160px;flex-shrink:0}
.info-val{color:var(--mut)}
.info-val a{color:var(--g)}

/* ---------- 6. Responsive ---------- */
@media(max-width:1100px){
  .hero>.hero-inner,.hero-lp>.hero-inner{grid-template-columns:1fr}
  .hero-r{display:none}
  .dark-panel-grid,.akk-inner,.intro-inner,.specs-grid{grid-template-columns:1fr;gap:3rem}
  .contact-inn{grid-template-columns:1fr;gap:3rem}
  .foot-top{grid-template-columns:1fr 1fr;gap:2.5rem}
  .tab-panel.active{grid-template-columns:1fr 1fr}
  .tab-panel.active.cols3 .svc-card{flex:0 0 calc(50% - .5rem)}
  .lk-grid,.other-grid,.warum-grid,.einstieg-grid,.abt-grid,.foto-grid,.projekte-grid,.testi-grid,.steps,.intro-grid,.loc-grid,.branchen-grid{grid-template-columns:1fr 1fr}
  .catlink-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  nav{padding:0 1.5rem}
  .nav-ul{display:none}
  .nav-search{display:none}
  .hero,.hero-lp,.contact-sec,.dark-panel,.sec,.method-sec,.cta-sec,.cta-strip,.otherlinks-sec,.other-sec,.catlink-sec,.content,.projekte-sec,.testi-sec,.leistungen-sec,.intro-sec,.timeline-sec,.intl-sec,.akk-sec,.loc-sec,.branchen-sec{padding:4rem 1.5rem}
  .tab-panel.active,.lk-grid,.lk-grid.cols2,.other-grid,.other-grid.cols2,.warum-grid,.einstieg-grid,.abt-grid,.foto-grid,.projekte-grid,.testi-grid,.steps,.intro-grid,.cards,.catlink-grid,.prozess-grid,.loc-grid,.branchen-grid{grid-template-columns:1fr}
  .tab-panel.active.cols3 .svc-card{flex:0 0 100%}
  .foot-top{grid-template-columns:1fr;gap:2rem}
  footer{padding:3rem 1.5rem 2rem}
  .trust-bar{gap:1rem;padding:8px 1.5rem}
  .cta-inner,.dark-panel-grid{flex-direction:column;align-items:flex-start}
}