/* STG Beratung 2026 · eine Datei, Arial, immer hell, AAA
   Text schwarz/anthrazit, Website-Blau nur als Akzent (Hero-Band, Footer, Buttons, Links,
   Nummern, Fenster-Motiv, feine Linien). Kein Dark Mode (Vorgabe 21.10.2026). */
:root{
  --bg:#ffffff;--bg-2:#f4f5f7;--bg-3:#e9ebef;
  --text:#111318;--text-2:#444b57;--link:#1443c7;
  --brand:#1f5bff;--slab:#133882;--slab-2:#0f2d6b;--on-slab:#ffffff;--on-slab-2:#dbe6ff;
  --cyan:#00c4ff;--line:#c9d4ef;--line-2:#9fb0dc;--line-n:#d9dce3;
  --btn-bg:#133882;--btn-fg:#ffffff;--btn-bg-h:#0f2d6b;
  --focus:#1f5bff;--ok-bg:#e3f6ea;--ok-fg:#0b4a25;--err-bg:#fdecea;--err-fg:#7a1c1c;
  --win:#2a56c9;--win-lit:#9dc0ff;--win-hot:#ffffff;
  --max:1200px;--gut:16px;--r:4px;--fs-small:1rem;
  --s1:.5rem;--s2:1rem;--s3:1.5rem;--s4:2rem;--s5:3rem;--s6:4rem;--s7:6rem;
  color-scheme:light;
}
@media (min-width:768px){:root{--gut:32px;--fs-small:.9375rem}}

/* ---------- Basis ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:5rem;background:#fff}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;font:400 1.0625rem/1.6 Arial,Helvetica,sans-serif;color:var(--text);background:var(--bg);overflow-x:clip}
img,svg,video{display:block;max-width:100%}
img{height:auto}
h1,h2,h3,h4{margin:0 0 var(--s2);font-weight:700;letter-spacing:-.015em;line-height:1.1;text-wrap:balance;color:var(--text)}
h1{font-size:clamp(2.25rem,1.6rem + 2.6vw,3.5rem);letter-spacing:-.02em;line-height:1.06}
h2{font-size:clamp(1.75rem,1.4rem + 1.4vw,2.25rem);line-height:1.12}
h3{font-size:1.375rem;line-height:1.25;letter-spacing:-.01em}
h4{font-size:1.125rem;line-height:1.3;letter-spacing:0}
p,ul,ol,dl,table,figure{margin:0 0 var(--s3)}
p:last-child,ul:last-child,ol:last-child{margin-bottom:0}
.lead{font-size:1.25rem;line-height:1.5}
.small,small,.meta,figcaption,.hint,.crumbs,.toc ol,.login-foot{font-size:var(--fs-small);line-height:1.5}
.muted{color:var(--text-2)}
a{color:var(--link);text-decoration:underline;text-underline-offset:.15em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:2px}
hr{border:0;border-top:1px solid var(--line);margin:var(--s5) 0}
strong{font-weight:700}
abbr[title]{text-decoration:none}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:var(--gut);top:-100px;z-index:200;padding:.75rem 1rem;background:var(--btn-bg);color:var(--btn-fg);font-weight:700;border-radius:var(--r)}
.skip:focus{top:.5rem}
.measure{max-width:68ch}
.measure-w{max-width:80ch}

/* ---------- Layout ---------- */
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.section{padding-block:var(--s6);background:var(--bg)}
.section+.section,.section+.cta{border-top:1px solid var(--line)}
.section--tight{padding-block:var(--s5)}
.section-head{margin-bottom:var(--s4);max-width:68ch}
.section-head p{color:var(--text-2);font-size:1.125rem}
.grid{display:grid;gap:var(--s4)}
.cols-2{grid-template-columns:1fr}
.cols-3{grid-template-columns:1fr}
.stack>*+*{margin-top:var(--s3)}
@media (min-width:768px){.section{padding-block:var(--s7)}.section--tight{padding-block:var(--s6)}.cols-2{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.cols-3{grid-template-columns:repeat(3,1fr)}}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.7rem 1.35rem;border:2px solid var(--btn-bg);border-radius:var(--r);background:var(--btn-bg);color:var(--btn-fg);font:700 1.0625rem/1.2 Arial,Helvetica,sans-serif;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.btn:hover{background:var(--btn-bg-h);border-color:var(--btn-bg-h);text-decoration:none}
.btn--ghost{background:transparent;color:var(--slab);border-color:var(--slab)}
.btn--ghost:hover{background:var(--slab);color:#fff;border-color:var(--slab)}
.btn--on-slab{background:#fff;color:#133882;border-color:#fff}
.btn--on-slab:hover{background:#dbe6ff;border-color:#dbe6ff;color:#0f2d6b}
.btn--ghost-slab{background:transparent;color:#fff;border-color:#fff}
.btn--ghost-slab:hover{background:#fff;color:#133882}
.btn svg{width:1.1em;height:1.1em;flex:none}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center}
.textlink{font-weight:700;display:inline-block;padding:.7rem 0}

/* ---------- Header ---------- */
.site-head{position:sticky;top:0;z-index:100;background:var(--bg);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:var(--s2);min-height:72px}
.brand{flex:none;display:block;margin-right:auto;padding:.25rem 0}
.brand img{height:44px;width:auto}
.nav-toggle{display:inline-flex;align-items:center;gap:.6rem;min-height:48px;padding:.5rem .75rem;border:2px solid var(--text);border-radius:var(--r);background:transparent;color:var(--text);font:700 1rem Arial,Helvetica,sans-serif;cursor:pointer}
.nav-toggle svg{width:22px;height:22px}
.nav-toggle .ic-x{display:none}
.nav-toggle[aria-expanded="true"] .ic-x{display:block}
.nav-toggle[aria-expanded="true"] .ic-menu{display:none}
.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);max-height:calc(100vh - 72px);overflow:auto;padding:var(--s2) var(--gut) var(--s4)}
.nav.is-open{display:block}
.nav ul{list-style:none;margin:0;padding:0}
.nav li{border-top:1px solid var(--line)}
.nav li:first-child{border-top:0}
.nav a,.nav .sub-toggle{display:flex;align-items:center;width:100%;min-height:52px;padding:.75rem 0;color:var(--text);text-decoration:none;font-weight:700;font-size:1.0625rem;background:none;border:0;font-family:inherit;text-align:left;cursor:pointer}
.nav a[aria-current="page"]{color:var(--link);box-shadow:inset 4px 0 0 var(--brand);padding-left:.75rem}
.nav .sub-toggle svg{width:18px;height:18px;margin-left:auto;flex:none;transition:transform .2s}
.nav .sub-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
.nav .sub{display:none;padding:0 0 .5rem 1rem}
.nav .has-sub.is-open .sub{display:block}
.nav .sub li{border:0}
.nav .sub a{font-weight:400;min-height:44px;padding:.5rem 0}
.nav .nav-cta{margin-top:var(--s3)}
.nav .nav-cta a.btn{color:var(--btn-fg);background:var(--btn-bg);border:2px solid var(--btn-bg);justify-content:center;min-height:48px;padding:.7rem 1.35rem}
.nav .nav-cta a.btn:hover{color:var(--btn-fg);background:var(--btn-bg-h);border-color:var(--btn-bg-h)}
.head-cta{display:none}
@media (min-width:1180px){
  .nav-toggle{display:none}
  .nav{display:block;position:static;border:0;padding:0;max-height:none;overflow:visible;background:transparent}
  .nav>ul{display:flex;gap:.25rem;align-items:center}
  .nav li{border:0;position:relative;flex:none}
  .nav a,.nav .sub-toggle{min-height:44px;padding:.5rem .6rem;font-size:.9375rem;font-weight:700;border-radius:var(--r);width:auto}
  .nav a:hover,.nav .sub-toggle:hover{background:var(--bg-2)}
  .nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--brand);padding-left:.6rem;color:var(--text)}
  .nav .sub-toggle svg{margin-left:.35rem;width:14px;height:14px;flex:none}
  .nav .sub{position:absolute;left:0;top:100%;min-width:19rem;padding:.5rem;background:var(--bg);border:1px solid var(--line);border-radius:var(--r);box-shadow:0 12px 30px rgba(17,19,24,.14)}
  .nav .has-sub:hover .sub,.nav .has-sub:focus-within .sub,.nav .has-sub.is-open .sub{display:block}
  .nav .sub a{padding:.55rem .75rem;font-size:1rem}
  .nav .sub a:hover{background:var(--bg-2)}
  .nav .nav-cta{display:none}
  .head-cta{display:inline-flex;margin-left:var(--s2)}
  .site-head .head-cta.btn{color:var(--btn-fg)}
}
@media (min-width:1300px){.nav a,.nav .sub-toggle{padding:.5rem .7rem;font-size:1rem}}

/* ---------- Fensterwand (Motiv) ---------- */
.wall{display:block;width:100%;height:auto}
.wall .w{fill:var(--win)}
.wall .lit{fill:var(--win-lit)}
.wall .hot{fill:var(--win-hot)}
.hero .wall .lit,.hero .wall .hot{opacity:0;animation:lit .4s ease forwards}
.hero .wall .lit:nth-of-type(3n){animation-delay:.3s}.hero .wall .lit:nth-of-type(3n+1){animation-delay:.6s}.hero .wall .lit:nth-of-type(3n+2){animation-delay:.9s}.hero .wall .hot{animation-delay:1.1s}
@keyframes lit{to{opacity:1}}
@media (prefers-reduced-motion:reduce){.hero .wall .lit,.hero .wall .hot{opacity:1}}
.glyph{width:56px;height:56px;flex:none}
.glyph rect{fill:var(--line)}
.glyph .on{fill:var(--brand)}

/* ---------- Hero-Band (Slab, oben) ---------- */
.slab{background:var(--slab);color:var(--on-slab)}
.slab h1,.slab h2,.slab h3{color:#fff}
.slab p{color:var(--on-slab-2)}
.slab a:not(.btn){color:#fff}
.slab .lead{color:#fff}
.hero{display:grid;grid-template-columns:1fr}
.hero .slab{padding:var(--s5) var(--gut) 0;display:flex;flex-direction:column;position:relative}
.hero .slab-in{max-width:40rem;padding-bottom:var(--s4)}
.hero .display{font-size:clamp(2.75rem,2rem + 4.5vw,5.5rem);line-height:1;letter-spacing:-.025em;margin:0 0 var(--s3);color:#fff}
.hero .lead{max-width:34rem;margin-bottom:var(--s4)}
.hero .wall{margin-top:auto;max-width:36rem}
.hero .photo{aspect-ratio:4/3;overflow:hidden;background:var(--bg-3)}
.hero .photo img{width:100%;height:100%;object-fit:cover}
@media (min-width:900px){
  .hero{grid-template-columns:7fr 5fr;min-height:min(78vh,760px)}
  .hero .slab{padding-left:max(var(--gut),calc((100vw - var(--max))/2 + var(--gut)));padding-top:var(--s7)}
  .hero .photo{aspect-ratio:auto}
}
.pagehead{padding:var(--s5) 0 var(--s5)}
.pagehead .crumbs{margin-bottom:var(--s3)}
.pagehead h1{max-width:20ch}
.pagehead .lead{max-width:60ch;margin:0}
.crumbs{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.25rem .5rem}
.crumbs li+li::before{content:"/";margin-right:.5rem;opacity:.7}
.crumbs a{display:inline-block;padding:.625rem 0;margin:-.625rem 0}
.slab .crumbs a{color:var(--on-slab-2)}
.crumbs a[aria-current]{text-decoration:none;color:inherit}

/* ---------- Drei Felder (Spaltensatz) ---------- */
.fields{display:grid;gap:0}
.field{padding:var(--s4) 0;border-top:1px solid var(--line)}
.field:first-child{border-top:0}
.field header{display:flex;gap:var(--s2);align-items:flex-start;margin-bottom:var(--s2)}
.field h3{margin:0;padding-top:.35rem}
.field ul{list-style:none;padding:0;margin:0 0 var(--s2)}
.field li{padding:.3rem 0 .3rem 1.4rem;position:relative}
.field li::before{content:"";position:absolute;left:0;top:.95em;width:10px;height:10px;background:var(--brand)}
@media (min-width:900px){
  .fields{grid-template-columns:repeat(3,1fr)}
  .field{border-top:0;border-left:1px solid var(--line);padding:0 var(--s4)}
  .field:first-child{border-left:0;padding-left:0}
  .field:last-child{padding-right:0}
}

/* ---------- Foto + Text ---------- */
.split{display:grid;gap:var(--s4);align-items:center}
.split .photo{aspect-ratio:4/3;overflow:hidden}
.split .photo img{width:100%;height:100%;object-fit:cover}
.split .photo--portrait{aspect-ratio:1/1}
@media (min-width:900px){.split{grid-template-columns:1fr 1fr;gap:var(--s6)}.split--rev .photo{order:2}}
figure.photo-wide{margin:0 0 var(--s4)}
.photo-wide img{width:100%;aspect-ratio:16/9;object-fit:cover}
figcaption{color:var(--text-2);margin-top:.5rem}

/* ---------- Ablauf (echte Reihenfolge) ---------- */
.steps{list-style:none;counter-reset:s;padding:0;margin:0;display:grid;gap:var(--s3)}
.steps li{counter-increment:s;position:relative;padding-left:3.5rem}
.steps li::before{content:counter(s);position:absolute;left:0;top:0;width:2.5rem;height:2.5rem;display:grid;place-items:center;background:var(--slab);color:#fff;font-weight:700;font-size:1.125rem}
.steps li::after{content:"";position:absolute;left:1.2rem;top:2.5rem;bottom:calc(-1 * var(--s3));width:2px;background:var(--line)}
.steps li:last-child::after{display:none}
.steps h3{margin-bottom:.25rem}
.steps p{color:var(--text-2)}
@media (min-width:900px){
  .steps--row{grid-template-columns:repeat(4,1fr);gap:var(--s4)}
  .steps--row li{padding-left:0;padding-top:3.5rem}
  .steps--row li::after{left:2.5rem;right:calc(-1 * var(--s4));top:1.2rem;bottom:auto;height:2px;width:auto}
}

/* ---------- Kennzahlen in der Wand (einziges Akzentband) ---------- */
.numbers{background:var(--slab);color:#fff;padding:var(--s4) 0}
.numbers .wall{max-width:40rem}
.numbers .grid{gap:var(--s2);margin-top:var(--s2)}
.num{border:2px solid rgba(255,255,255,.35);padding:var(--s2) var(--s3);min-height:7.5rem;display:flex;flex-direction:column;justify-content:flex-end}
.num.lit{background:#fff;color:var(--text);border-color:#fff}
.num b{display:block;font-size:clamp(2rem,1.75rem + 1.2vw,2.75rem);line-height:1;letter-spacing:-.03em;margin-bottom:.4rem}
.num span{font-size:1rem;line-height:1.3}
.numbers .num:not(.lit) span{color:var(--on-slab-2)}
@media (min-width:600px){.numbers .grid{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.numbers .grid{grid-template-columns:repeat(4,1fr)}}

/* ---------- Wissen ---------- */
.posts{list-style:none;padding:0;margin:0;display:grid;gap:0}
.post{display:grid;gap:var(--s2);padding:var(--s3) 0;border-top:1px solid var(--line);grid-template-columns:96px 1fr;align-items:start}
.post:first-child{border-top:0}
.post .thumb{aspect-ratio:1/1;overflow:hidden;background:var(--bg-3)}
.post .thumb img{width:100%;height:100%;object-fit:cover}
.post h3{font-size:1.25rem;margin:0 0 .25rem}
.post h3 a,.post h2 a{color:var(--text);text-decoration:none}
.post h3 a:hover,.post h2 a:hover{text-decoration:underline}
.post .meta{color:var(--text-2);margin:0 0 .35rem}
.post p{color:var(--text-2);margin:0}
.post--lead{grid-template-columns:1fr;padding-top:0}
.post--lead .thumb{aspect-ratio:16/9}
.post--lead h3{font-size:1.5rem}
@media (min-width:600px){.post{grid-template-columns:160px 1fr;gap:var(--s3)}.post .thumb{aspect-ratio:4/3}.post--lead{grid-template-columns:1fr}.post--lead .thumb{aspect-ratio:16/9}}
@media (min-width:900px){.post--lead{grid-template-columns:1fr 1fr;gap:var(--s5);align-items:center}}
.filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:var(--s4)}
.filter button{min-height:44px;padding:.5rem 1rem;border:2px solid var(--line-2);border-radius:999px;background:transparent;color:var(--text);font:700 1rem Arial,Helvetica,sans-serif;cursor:pointer}
.filter button[aria-pressed="true"]{background:var(--slab);color:#fff;border-color:var(--slab)}
.post.is-hidden{display:none}
.article-head{padding:var(--s5) 0 var(--s4)}
.article-head .meta{color:var(--text-2);margin-bottom:var(--s2)}
.article-head h1{max-width:24ch}
.article-head .question{font-size:clamp(1.375rem,1.1rem + 1.2vw,1.75rem);line-height:1.35;font-weight:700;max-width:30ch;margin:0 0 var(--s2);color:var(--slab)}
.article{display:grid;gap:var(--s5)}
.article>*{min-width:0}
.toc{border-left:4px solid var(--brand);padding-left:var(--s2)}
.toc h2{font-size:1rem;margin-bottom:.25rem}
.toc ol{list-style:none;padding:0;margin:0}
.toc li{padding:0}
.toc a{display:block;color:var(--text);text-decoration:none;padding:.65rem 0}
.toc a:hover{text-decoration:underline}
.toc--top{border-left:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:var(--s2) 0;margin-bottom:var(--s4)}
.toc--top h2{display:inline-block;margin:0 var(--s2) 0 0}
.toc--top ol{display:flex;flex-wrap:wrap;gap:0 1.5rem}
.toc--top li{display:inline}
.toc--top a{display:inline-block;padding:.65rem 0}
.toc--top a{text-decoration:underline;text-decoration-color:var(--line-2);text-underline-offset:.2em}
@media (min-width:900px){.article{grid-template-columns:3fr 8fr;align-items:start;gap:var(--s6)}.toc{position:sticky;top:6rem}.article--wide{grid-template-columns:1fr}.article--wide .prose{max-width:72ch}}
.prose{max-width:68ch}
.prose h2{font-size:1.625rem;margin:var(--s5) 0 var(--s2);scroll-margin-top:6rem}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:var(--s4)}
.prose ul,.prose ol{padding-left:1.25rem}
.prose li{margin-bottom:.5rem}
.prose li::marker{color:var(--brand);font-weight:700}
.prose .tbl{overflow-x:auto;margin-bottom:var(--s3);border:1px solid var(--line)}
.prose table{width:100%;border-collapse:collapse;margin:0;font-size:1rem;min-width:36rem}
.prose th,.prose td{text-align:left;padding:.65rem .75rem;border-bottom:1px solid var(--line);vertical-align:top}
.prose th{background:var(--bg-3);font-weight:700}
.prose tr:last-child td{border-bottom:0}
.prose .check{padding-left:0}
.prose .check li{margin-bottom:0}
.praxis{background:var(--bg-2);border-left:6px solid var(--brand);padding:var(--s3);margin:var(--s4) 0}
.praxis h2{font-size:1.25rem;margin:0 0 var(--s2)}
.praxis p:last-child{margin:0}
.closing{border-top:2px solid var(--slab);border-bottom:2px solid var(--slab);padding:var(--s3) 0;margin:var(--s5) 0 var(--s4);font-size:1.125rem}
.closing p{margin:0}

/* ---------- Vergleichstabelle (responsiv gestapelt) ---------- */
.compare{width:100%;border-collapse:collapse;font-size:1rem}
.compare th,.compare td{text-align:left;padding:.75rem;border-bottom:1px solid var(--line);vertical-align:top}
.compare thead th{background:var(--bg-3);font-size:1.0625rem}
.compare tbody th{font-weight:700;width:11rem}
@media (max-width:759px){
  .compare thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .compare tr{display:block;border:1px solid var(--line);margin-bottom:var(--s3)}
  .compare th,.compare td{display:block;width:auto;border:0}
  .compare tbody th{background:var(--bg-3);padding:.6rem .75rem}
  .compare td{padding:.5rem .75rem}
  .compare td::before{content:attr(data-l);display:block;font-weight:700;font-size:1rem;color:var(--text-2)}
}

/* ---------- Dauer-Balken (Beschriftung über dem Balken) ---------- */
.dur{margin:var(--s3) 0}
.dur ol{list-style:none;padding:0;margin:0;display:grid;gap:var(--s2)}
.dur li{display:grid;grid-template-columns:1fr;gap:.35rem}
.dur .bar{height:14px;background:var(--bg-3);position:relative}
.dur .bar i{position:absolute;inset:0 auto 0 0;background:var(--brand)}
.dur .lbl{display:flex;justify-content:space-between;gap:var(--s2);font-size:1rem}
.dur .lbl span:last-child{color:var(--text-2);white-space:nowrap}

/* ---------- Checkliste ---------- */
.check{list-style:none;padding:0;margin:0 0 var(--s3);display:grid;gap:.6rem}
.check li{padding-left:2rem;position:relative}
.check li::before{content:"";position:absolute;left:0;top:.25em;width:1.1em;height:1.1em;background:var(--slab);clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0,43% 62%)}
@media (min-width:600px){.check--2{grid-template-columns:1fr 1fr;column-gap:var(--s4)}}

/* ---------- FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;gap:var(--s2);align-items:flex-start;padding:1rem 0;font-weight:700;font-size:1.125rem;line-height:1.35}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:12px;height:12px;margin:.45rem 0 0 auto;border-right:2px solid var(--slab);border-bottom:2px solid var(--slab);transform:rotate(45deg);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(225deg);margin-top:.7rem}
.faq .ans{padding:0 2.5rem var(--s3) 0;max-width:68ch}
.faq .ans p{color:var(--text-2)}
.faq-groups h2{margin-top:var(--s5)}
.faq-groups h2:first-child{margin-top:0}

/* ---------- CTA (weiß, vor dem Footer) ---------- */
.cta{background:var(--bg);padding:var(--s6) 0;border-top:1px solid var(--line)}
.cta h2{max-width:22ch}
.cta p{color:var(--text-2);max-width:52ch}
.cta .btn-row{margin-top:var(--s3)}
.cta .wrap{display:grid;gap:var(--s3)}
@media (min-width:900px){.cta .wrap{grid-template-columns:1fr auto;align-items:center}.cta .btn-row{margin:0}}

/* ---------- Formulare ---------- */
.form{display:grid;gap:var(--s3)}
.form .row2{display:grid;gap:var(--s3)}
@media (min-width:600px){.form .row2{grid-template-columns:1fr 1fr}}
.fld label{display:block;font-weight:700;margin-bottom:.35rem}
.fld label .req{color:var(--slab);font-weight:700;margin-left:.15rem}
.fld input,.fld select,.fld textarea{width:100%;min-height:52px;padding:.75rem .9rem;border:2px solid var(--line-2);border-radius:var(--r);background:#fff;color:var(--text);font:400 1.0625rem Arial,Helvetica,sans-serif}
.fld textarea{min-height:10rem;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:3px solid var(--focus);outline-offset:1px;border-color:var(--focus)}
.fld .hint{color:var(--text-2);margin-top:.35rem}
.hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}
.notice{padding:var(--s2) var(--s3);border-radius:var(--r);margin-bottom:var(--s3);font-size:1.0625rem}
.notice--ok{background:var(--ok-bg);color:var(--ok-fg)}
.notice--err{background:var(--err-bg);color:var(--err-fg)}
.notice a{color:inherit}
.contact-aside{display:grid;gap:var(--s3);align-content:start}
.contact-aside address{font-style:normal}
.contact-aside address a,.notfound li a{display:inline-block;padding:.7rem 0;margin:-.3rem 0}
.kv{display:grid;grid-template-columns:auto 1fr;gap:.35rem var(--s3);margin:0}
.kv dt{font-weight:700}
.kv dd{margin:0}
@media (max-width:479px){.kv{grid-template-columns:1fr;gap:0}.kv dt{margin-top:.5rem}.kv dd{margin-bottom:.25rem}}

/* ---------- Register-Kasten / Fakten ---------- */
.facts{border:2px solid var(--slab);padding:var(--s3);max-width:34rem}
.facts h3{margin-bottom:var(--s2)}
.facts .kv{gap:.5rem var(--s3)}
.facts .kv dt{color:var(--text-2);font-weight:400}
@media (max-width:479px){.facts .kv{gap:0}}

/* ---------- Teamstruktur (Bereiche) ---------- */
.areas{list-style:none;padding:0;margin:0;display:grid;gap:var(--s2)}
.area{display:grid;grid-template-columns:4.5rem 1fr;gap:var(--s2);align-items:start;padding:var(--s2) 0;border-top:1px solid var(--line)}
.area b{font-size:1.75rem;line-height:1;letter-spacing:-.02em;color:var(--slab)}
.area h3{font-size:1.125rem;margin-bottom:.25rem}
.area p{color:var(--text-2);margin:0}
@media (min-width:768px){.areas{grid-template-columns:1fr 1fr;gap:var(--s2) var(--s5)}}

/* ---------- Branchen / Anker ---------- */
.anchors{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 var(--s4);padding:0;list-style:none}
.anchors a{display:inline-flex;align-items:center;min-height:44px;padding:.4rem 1rem;border:2px solid var(--line-2);border-radius:999px;color:var(--text);text-decoration:none;font-weight:700}
.anchors a:hover{border-color:var(--slab)}
.branch{padding:var(--s5) 0;border-top:1px solid var(--line);scroll-margin-top:5rem}
.branch:first-of-type{border-top:0;padding-top:0}
.example{background:var(--bg-2);padding:var(--s3);border-left:6px solid var(--brand)}
.example h4{margin-bottom:.5rem}
.example p{margin:0;color:var(--text-2)}

/* ---------- Footer (dunkel) ---------- */
.site-foot{background:#091123;color:#dbe6ff;padding:var(--s6) 0 var(--s4);margin-top:0;font-size:1rem}
.site-foot a{color:#fff}
.site-foot .cols{display:grid;gap:var(--s4)}
.site-foot h2{font-size:1rem;color:#fff;margin-bottom:.5rem}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li a{display:inline-block;padding:.6rem 0;text-decoration:none}
.site-foot li a:hover{text-decoration:underline}
.site-foot address{font-style:normal;line-height:1.6}
.site-foot address a{display:inline-block;padding:.6rem 0}
.site-foot .legal{margin-top:var(--s5);padding-top:var(--s3);border-top:1px solid rgba(255,255,255,.18);display:flex;flex-wrap:wrap;gap:var(--s2) var(--s4);justify-content:space-between;font-size:var(--fs-small)}
.site-foot .legal ul{display:flex;flex-wrap:wrap;gap:var(--s3)}
.site-foot .legal ul a{display:inline-block;padding:.6rem 0}
.site-foot .legal p{margin:0;max-width:60ch}
.site-foot .brand{display:inline-block;padding:.5rem 0;margin:0 0 var(--s2)}
.site-foot .brand img{height:40px}
.site-foot .cols>div:first-child p{font-size:var(--fs-small)}
@media (min-width:600px){.site-foot .cols{grid-template-columns:1fr 1fr}}
@media (min-width:1000px){.site-foot .cols{grid-template-columns:1.2fr .9fr .9fr .8fr 1.5fr}}

/* ---------- Cookie-Banner ---------- */
.cookie{position:fixed;left:var(--gut);right:var(--gut);bottom:var(--gut);z-index:150;max-width:34rem;margin-left:auto;background:var(--bg);color:var(--text);border:2px solid var(--slab);border-radius:var(--r);padding:var(--s3);display:none;gap:var(--s2)}
.cookie.show{display:grid}
.cookie h2{font-size:1.125rem;margin-bottom:.25rem}
.cookie p{margin:0;font-size:1rem;color:var(--text-2)}
.cookie .btn-row{margin-top:var(--s1)}

/* ---------- Rechtstexte ---------- */
.legal-toc{columns:1;margin-bottom:var(--s5);padding-left:1.25rem}
@media (min-width:700px){.legal-toc{columns:2;column-gap:var(--s4)}}
.legal-toc li{break-inside:avoid;padding:0}
.legal-toc a{display:inline-block;padding:.55rem 0}
.prose--legal h2{font-size:1.375rem;margin-top:var(--s4)}
.prose--legal h3{font-size:1.125rem}

/* ---------- 404 ---------- */
.notfound{padding:var(--s6) 0}
.notfound ul{list-style:none;padding:0;margin:var(--s3) 0 0;display:grid;gap:.5rem}

/* ---------- Login (karriere/login.php) ---------- */
.login-page{min-height:100vh;display:grid;grid-template-columns:1fr;background:#fff}
.login-brand{background:var(--slab);color:#fff;padding:var(--s4) var(--gut);display:flex;flex-direction:column;gap:var(--s3)}
.login-brand .brand img{height:40px}
.login-brand h1{color:#fff;font-size:clamp(1.75rem,1.4rem + 1.4vw,2.5rem);max-width:16ch}
.login-brand p{color:var(--on-slab-2);max-width:40ch;margin:0}
.login-brand ul{list-style:none;padding:0;margin:0;display:grid;gap:.5rem;color:#fff}
.login-brand li{padding-left:1.5rem;position:relative}
.login-brand li::before{content:"";position:absolute;left:0;top:.45em;width:.7em;height:.7em;background:var(--cyan)}
.login-brand .wall{max-width:24rem;margin-top:auto}
.login-main{padding:var(--s5) var(--gut);display:grid;align-content:center;justify-items:center}
.login-card{width:100%;max-width:28rem}
.login-card h2{font-size:1.75rem}
.login-card .sub{color:var(--text-2)}
.pw-wrap{position:relative}
.pw-wrap input{padding-right:3.25rem}
.pw-toggle{position:absolute;right:4px;top:4px;bottom:4px;width:44px;border:0;background:transparent;color:var(--text-2);cursor:pointer;display:grid;place-items:center;border-radius:var(--r)}
.pw-toggle svg{width:22px;height:22px}
.pw-toggle .eye-off{display:none}
.pw-toggle.on .eye-on{display:none}
.pw-toggle.on .eye-off{display:block}
.resend-link{display:block;width:100%;margin-top:var(--s3);padding:.75rem 0;background:none;border:0;border-top:1px solid var(--line);color:var(--link);font:700 1rem Arial,Helvetica,sans-serif;text-align:left;cursor:pointer;text-decoration:underline;text-underline-offset:.15em}
.resend-panel{display:none;margin-top:var(--s2);padding:var(--s3);background:var(--bg-2);border-left:6px solid var(--brand)}
.resend-panel.open{display:block}
.resend-panel h3{font-size:1.125rem}
.resend-panel p{color:var(--text-2);font-size:1rem}
.login-foot{margin-top:var(--s4);color:var(--text-2)}
@media (min-width:900px){.login-page{grid-template-columns:5fr 7fr}.login-brand{padding:var(--s6) var(--s5);min-height:100vh}.login-main{padding:var(--s6)}}