/*
Theme Name: iduia
Theme URI: https://iduia.ch/
Author: silent system gmbh
Description: Schlankes, barrierearmes Theme für iduia GmbH. Farbwelt B «Papier, Tinte, Kupfer» (Standard) und A «Anthrazit und Gold», umschaltbar über data-farbwelt am html-Element. Roboto lokal, auch für Titel. Startseite: sechs Bildschirme mit Jahresband und Regionskarte (BAU-8).
Version: 1.2.0
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: iduia
License: proprietary
*/

/* =====================================================================
   Schichten: 1 Tokens · 2 Basis · 3 Bausteine · 4 Seiten · 5 Bewegung · 6 Reduced Motion
   Farben stehen ausschliesslich als Tokens in Schicht 1 (Hex nur dort).
   Abgeleitete Flächen und Linien werden mit color-mix() aus den Tokens gebildet.
   ===================================================================== */

/* =====================================================================
   1 TOKENS
   ===================================================================== */

/* Variante A «Anthrazit und Gold, geschärft» (Standard), Werte aus docs/redesign-2026/04-zielbild.md, Abschnitt 4 */
:root{
  --papier:#F7F5F0;
  --weiss:#FFFFFF;
  --nacht:#1B2530;
  --anthrazit:#24303D;
  --text-2:#4A525C;
  --gold:#B48C50;
  --gold-text:#7E5E2C;
  --gold-hell:#E3C58F;
  --hell-text:#D5DAE0;
  --terra:#A4635F;

  /* Rollen (zeigen auf die Palette oben) */
  --text:var(--anthrazit);
  --flaeche:var(--papier);
  --karte:var(--weiss);
  --dunkel:var(--nacht);
  --dunkel-text:var(--hell-text);
  --dunkel-titel:var(--weiss);
  --akzent:var(--gold);
  --akzent-text:var(--gold-text);
  --akzent-hell:var(--gold-hell);
  --btn-bg:var(--gold);
  --btn-text:var(--nacht);
  --netz-punkt:var(--hell-text);
  --netz-knoten:var(--gold-hell);
  --linie:color-mix(in srgb,var(--text) 14%,transparent);
  --linie-dunkel:color-mix(in srgb,var(--weiss) 14%,transparent);
  --schatten:0 1px 2px color-mix(in srgb,var(--nacht) 6%,transparent),0 8px 24px color-mix(in srgb,var(--nacht) 6%,transparent);

  /* Schrift */
  --schrift-text:'Roboto',system-ui,-apple-system,'Segoe UI',sans-serif;
  --schrift-titel:var(--schrift-text);
  --titel-groesse:3.2rem; --titel-zeile:1.05; --titel-gewicht:700;

  /* Masse */
  --radius:2px; --max:1200px; --gap:clamp(1rem,3vw,2rem); --kopf:76px;
}

/* Variante B «Papier, Tinte, Kupfer», Werte aus 04-zielbild.md, Abschnitt 4 */
html[data-farbwelt="b"]{
  --papier:#F4F1EA;
  --weiss:#FFFFFF;
  --nacht:#141A22;
  --tinte:#1E2430;
  --grau:#5C6470;
  --kupfer:#9A5B3C;
  --kupfer-hell:#D9A074;
  --jura:#4D6B5E;
  --hell-text:#B8C0CC;

  --text:var(--tinte);
  --text-2:var(--grau);
  --dunkel-titel:var(--papier);
  --akzent:var(--kupfer);
  --akzent-text:var(--kupfer);
  --akzent-hell:var(--kupfer-hell);
  --akzent-2:var(--jura);
  --btn-bg:var(--kupfer-hell);
  --netz-knoten:var(--kupfer-hell);
  --terra:var(--kupfer);

  --schrift-titel:'Source Serif 4',Georgia,'Times New Roman',serif;
  --titel-groesse:3rem; --titel-zeile:1.05; --titel-gewicht:600;
}

/* Schrift A (Roboto) auch für Titel in Farbwelt B: Entscheid 07-konsolidiertes-konzept.md, Abschnitt 5 (BAU-2).
   Die Farbwerte des Blocks oben bleiben unverändert; die Serife wird damit nicht mehr geladen. */
html[data-farbwelt="b"]{--schrift-titel:var(--schrift-text);--titel-gewicht:400}

/* =====================================================================
   2 BASIS
   ===================================================================== */
@font-face{font-family:'Roboto';font-style:normal;font-weight:300;font-display:swap;src:url(assets/fonts/roboto-300.woff2) format('woff2')}
@font-face{font-family:'Roboto';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/roboto-400.woff2) format('woff2')}
@font-face{font-family:'Roboto';font-style:normal;font-weight:500;font-display:swap;src:url(assets/fonts/roboto-500.woff2) format('woff2')}
@font-face{font-family:'Roboto';font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/roboto-700.woff2) format('woff2')}
/* Serife für Variante B (SIL OFL, Dateien sind ein Handgriff, siehe docs/redesign-2026/bau-1-schrift.md). Fehlen die Dateien, greift der System-Fallback Georgia / Times New Roman / serif. */
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400;font-display:swap;src:url(assets/fonts/serif-400.woff2) format('woff2')}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/serif-600.woff2) format('woff2')}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--schrift-text);font-size:1.0625rem;line-height:1.65;color:var(--text);background:var(--flaeche);font-weight:400}
img,svg,video,iframe{max-width:100%;height:auto;display:block}
a{color:var(--text);text-decoration-color:var(--akzent);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--akzent-text)}
:focus-visible{outline:3px solid var(--akzent);outline-offset:3px}
h1,h2,h3,h4{font-weight:500;line-height:1.2;color:var(--text);margin:0 0 .6em;letter-spacing:-.01em}
h1,h2{font-family:var(--schrift-titel);font-weight:var(--titel-gewicht)}
h1{font-size:clamp(2.1rem,4.6vw,3.6rem);letter-spacing:-.02em}
h2{font-size:clamp(1.7rem,3.2vw,var(--titel-groesse));line-height:var(--titel-zeile)}
h3{font-size:1.25rem}
p{margin:0 0 1.1em}
ul{padding-left:1.2em}
.screen-reader-text,.skip-link:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.skip-link:focus{position:fixed;top:.5rem;left:.5rem;z-index:1000;background:var(--nacht);color:var(--weiss);padding:.7rem 1rem}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gap)}
main{display:block;padding-top:0}

/* Eyebrow: Akzentlinie + Versal-Sperrschrift */
.eyebrow{display:block;font-family:var(--schrift-text);font-size:.8rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--akzent-text);margin-bottom:1rem}
.eyebrow::before{content:"";display:block;width:2.2rem;height:2px;background:var(--akzent);margin-bottom:.7rem}
.is-dark .eyebrow{color:var(--akzent-hell)}
.lead{font-size:clamp(1.12rem,1.6vw,1.3rem);font-weight:300;line-height:1.5;color:var(--text-2);max-width:46rem}
.is-dark .lead{color:var(--dunkel-text)}

/* Buttons */
.btn,.wp-block-button__link{position:relative;display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.5rem;border-radius:var(--radius);background:var(--btn-bg);color:var(--btn-text);text-decoration:none;font-weight:500;letter-spacing:.01em;border:2px solid var(--btn-bg);transition:background .2s,color .2s}
.btn:hover,.wp-block-button__link:hover{background:transparent;color:var(--akzent-text)}
.is-dark .btn{color:var(--btn-text)}
.is-dark .btn:hover{color:var(--akzent-hell)}
.btn.is-ghost,.is-dark .btn.is-ghost{background:transparent;color:var(--dunkel-titel);border-color:color-mix(in srgb,var(--dunkel-titel) 55%,transparent)}
.btn.is-ghost:hover,.is-dark .btn.is-ghost:hover{border-color:var(--dunkel-titel);color:var(--dunkel-titel)}
.btn-link{font-weight:500;text-decoration:none;border-bottom:2px solid var(--akzent);padding-bottom:2px}
.btn-link::after{content:" →"}

/* Header: fest, hell, volle Breite (wie Prototyp K1); rechts Region und Telefon */
.site-header{position:sticky;left:0;right:0;top:0;z-index:50;height:auto;min-height:var(--kopf);background:color-mix(in srgb,var(--weiss) 94%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--linie);transition:background .35s,border-color .35s,box-shadow .35s}
.admin-bar .site-header{top:32px}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.4rem 1rem;height:auto;min-height:var(--kopf);max-width:none;padding:.35rem clamp(1.25rem,4vw,3.5rem)}
.brand{display:block;width:124px;flex:none}
.brand img{width:100%}
.brand .logo-negativ{display:none}
.nav-toggle{display:none;background:none;border:1px solid var(--linie);padding:.55rem .8rem;font:inherit;font-size:.9rem;color:var(--text);cursor:pointer;border-radius:var(--radius)}
.primary-nav ul{list-style:none;margin:0;padding:0;display:flex;flex:1;min-width:0;flex-wrap:wrap;justify-content:flex-end;gap:.2rem 1.15rem}
.primary-nav a{display:block;padding:.4rem 0;text-decoration:none;font-weight:500;font-size:.95rem;color:var(--text);border-bottom:2px solid transparent;transition:color .35s,border-color .35s}
.primary-nav a:hover,.primary-nav .current-menu-item>a,.primary-nav .current-page-ancestor>a,.primary-nav .current_page_parent>a{border-bottom-color:var(--akzent)}
.primary-nav .sub-menu{display:none}
.primary-nav{display:flex;align-items:center;flex:1;min-width:0;flex-wrap:wrap;justify-content:flex-end;gap:clamp(.6rem,1.6vw,1.6rem)}
.kopf-kontakt{margin:0;display:flex;align-items:center;gap:1.1rem;font-size:.9rem;white-space:nowrap}
.kopf-kontakt span{color:var(--text-2)}
.kopf-kontakt a{font-weight:500;text-decoration:none;color:var(--akzent-text)}
@media (max-width:1240px) and (min-width:981px){.kopf-kontakt{display:none}}
.site-header.is-scrolled{box-shadow:0 6px 24px color-mix(in srgb,var(--nacht) 6%,transparent)}
@media (max-width:980px){
  .nav-toggle{display:block}
  .primary-nav{position:absolute;left:0;right:0;top:100%;background:var(--weiss);border-bottom:1px solid var(--linie);display:none}
  .primary-nav.is-open{display:block}
  .kopf-kontakt{padding:0 var(--gap) 1.2rem}
  .primary-nav ul{flex-direction:column;padding:.5rem var(--gap) 1.2rem}
  .primary-nav a{padding:.7rem 0;border-bottom:1px solid var(--linie)}
  .nav-open .site-header{background:var(--weiss)}
  html:not(.js) .nav-toggle{display:none}
  html:not(.js) .primary-nav{display:block;position:static;border-bottom:0}
  html:not(.js) .kopf-kontakt{white-space:normal}
}

/* Footer */
.site-footer{background:var(--dunkel);color:var(--dunkel-text);padding:clamp(3rem,7vw,4.5rem) 0 2rem;font-size:.95rem}
.site-footer a{color:var(--dunkel-titel);text-decoration:none}
.site-footer a:hover{color:var(--akzent-hell)}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;gap:2rem}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr}}
.site-footer h2{font-family:var(--schrift-text);font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--akzent-hell);font-weight:500;line-height:1.3;margin-bottom:1rem}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.45rem}
.footer-logo{width:130px;margin-bottom:1.2rem}
.footer-seg{color:var(--dunkel-text)}
.footer-bottom{margin-top:3rem;padding-top:1.4rem;border-top:1px solid var(--linie-dunkel);display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.85rem}
.social{display:inline-flex;align-items:center;gap:.5rem}
.social svg{width:20px;height:20px;fill:currentColor}

/* =====================================================================
   3 BAUSTEINE
   ===================================================================== */

/* Sektionen */
.section{padding:clamp(3.5rem,8vw,6.5rem) 0}
.section.is-light{background:var(--weiss)}
.section.is-dark{background:var(--dunkel);color:var(--dunkel-text)}
.is-dark h1,.is-dark h2,.is-dark h3{color:var(--dunkel-titel)}
.is-dark a{color:var(--dunkel-titel)}
.sec-kopf{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:1rem 2rem;margin-bottom:2.8rem}
.sec-kopf h2{max-width:24ch;margin:0}
.sec-kopf p{margin:0}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,6vw,5rem);align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr}}
.zitat{font-family:var(--schrift-titel);font-size:clamp(1.6rem,3vw,2.3rem);font-weight:300;line-height:1.2;color:var(--text);border-left:3px solid var(--akzent);padding-left:1.2rem;margin:1.4rem 0}

/* Heller Seitenkopf (Unterseiten), ohne Netz */
.page-hero{position:relative;background:var(--papier);color:var(--text);padding:clamp(3rem,7vw,5.5rem) 0 clamp(2.6rem,6vw,4.2rem);border-bottom:1px solid var(--linie)}
.page-hero h1{color:var(--text);margin:0;max-width:22ch;font-size:clamp(2.3rem,5.4vw,4.2rem);letter-spacing:-.03em}
.page-hero .tagline{margin:.9rem 0 0;font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:300;line-height:1.5;color:var(--text-2);max-width:44rem}
.breadcrumb{font-size:.85rem;margin-bottom:1rem;color:var(--text-2)}
.breadcrumb a{color:var(--text);text-decoration:none}
.breadcrumb a:hover{color:var(--akzent-text)}
.single-meta{margin:.9rem 0 0;font-size:.9rem;color:var(--text-2)}

/* Content-Bereich */
.content{padding:clamp(3rem,7vw,5.5rem) 0}
.content .wrap>*{max-width:46rem}
.content .wrap>.alignwide,.content .wrap>.iduia-wide,.content .wrap>.wp-block-columns,.content .wrap>.wp-block-group.alignwide{max-width:none}
.content h2{margin-top:2.2em;font-size:clamp(1.5rem,2.6vw,2.2rem)}
.content h2:first-child{margin-top:0}
.content ul li{margin-bottom:.35em}
.content ul li::marker{color:var(--akzent)}

/* Kacheln, Leistungen (Liste) */
.kacheln{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1px;background:var(--linie);border:1px solid var(--linie)}
.kachel{background:var(--karte);padding:2rem 1.8rem;position:relative}
.kachel .nr{display:block;font-size:.8rem;letter-spacing:.2em;color:var(--akzent-text);font-weight:500;margin-bottom:1.2rem}
.kachel h3{margin-bottom:.5rem}
.kachel p{color:var(--text-2);margin:0}
.leistungen{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.4rem}
.leistung{display:flex;flex-direction:column;background:var(--karte);border:1px solid var(--linie);border-top:3px solid var(--akzent);padding:1.8rem 1.7rem 1.6rem;text-decoration:none;color:inherit;transition:box-shadow .2s,transform .2s}
.leistung:hover{box-shadow:var(--schatten);transform:translateY(-2px);color:inherit}
.leistung .nr{font-size:.8rem;letter-spacing:.2em;color:var(--akzent-text);font-weight:500}
.leistung h3{margin:.8rem 0 .6rem;font-size:1.2rem}
.leistung p{color:var(--text-2);font-size:.98rem;flex:1}
.leistung .mehr{font-weight:500;font-size:.95rem;color:var(--text)}
.leistung .mehr::after{content:" →";color:var(--akzent-text)}
.neu{display:inline-block;margin-left:.5rem;font-family:var(--schrift-text);font-size:.7rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;background:var(--terra);color:var(--weiss);padding:.15rem .45rem;vertical-align:middle}

.iduia-platzhalter{border:2px dashed var(--linie);background:repeating-linear-gradient(45deg,var(--karte),var(--karte) 12px,var(--papier) 12px,var(--papier) 24px);color:var(--text-2);padding:1.6rem;text-align:center;font-size:.95rem}
.iduia-platzhalter strong{display:block;color:var(--text);margin-bottom:.3rem}
.video.iduia-platzhalter{background:var(--dunkel);border-color:var(--linie-dunkel);color:var(--dunkel-text)}
.video.iduia-platzhalter strong{color:var(--dunkel-titel)}
.portrait{float:right;width:min(280px,40%);aspect-ratio:4/5;margin:0 0 1.5rem 2rem;display:flex;flex-direction:column;justify-content:center}
@media (max-width:640px){.portrait{float:none;width:100%;margin:0 0 1.5rem}}

/* Logowand */
.logowall{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}
.logo-kachel{aspect-ratio:3/2;display:flex;align-items:center;justify-content:center;padding:1.4rem 1.6rem;background:var(--karte);border:1px solid var(--linie);border-radius:6px;transition:box-shadow .2s,transform .2s}
.logo-kachel:hover{box-shadow:var(--schatten);transform:translateY(-2px)}
.logo-kachel img{max-width:100%;max-height:78px;width:auto;height:auto;object-fit:contain}
.logo-name{font-weight:600;text-align:center;line-height:1.3;color:inherit}

/* Video mit Zwei-Klick-Lösung */
.video{position:relative;aspect-ratio:16/9;background:var(--dunkel);overflow:hidden;color:var(--dunkel-titel)}
.video button{all:unset;position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.8rem;cursor:pointer;text-align:center;padding:1.5rem;color:var(--dunkel-titel)}
.video button:focus-visible{outline:3px solid var(--akzent-hell);outline-offset:-6px}
.video .play{width:72px;height:72px;border-radius:50%;background:var(--btn-bg);display:grid;place-items:center}
.video .play::after{content:"";border-left:20px solid var(--btn-text);border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:5px}
.video small{max-width:34rem;color:var(--dunkel-text);font-size:.82rem;line-height:1.4}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-caption{margin-top:.7rem;font-size:.95rem}
.video-caption strong{display:block}
.filme{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}
.testimonial{margin-top:.9rem}
.testimonial .t-name{margin:0;font-weight:600;font-size:1.05rem}
.testimonial .t-rolle{margin:.1rem 0 0;font-size:.9rem;color:var(--text-2)}
.testimonial .t-zitat{margin:.9rem 0 0;padding:0 0 0 1rem;border-left:3px solid var(--akzent);font-size:.98rem;color:var(--text);quotes:none}
.testimonial .t-zitat p{margin:0}
.testimonial .ph{color:var(--text-2);font-style:italic}
.testimonial .t-zitat.t-leer{border-left:3px dashed var(--linie);font-size:.88rem}
.t-transkript{margin-top:.8rem;font-size:.9rem}
.t-transkript summary{cursor:pointer;color:var(--akzent-text);font-weight:500}
.t-transkript p{margin:.6rem 0 0;color:var(--text-2)}

/* Team */
.team{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.4rem;margin:1.5rem 0 2.5rem}
.person{border:1px solid var(--linie);padding:1.6rem;background:var(--karte)}
.person h3{margin-bottom:.2rem}
.person .rolle{color:var(--akzent-text);font-size:.9rem;font-weight:500;margin-bottom:.9rem}
.person p{font-size:.97rem;color:var(--text-2)}
.person .zust{font-size:.93rem}

/* Timeline */
.timeline{list-style:none;padding:0;margin:1.5rem 0;border-left:2px solid var(--linie)}
.timeline li{position:relative;padding:0 0 1.4rem 1.6rem}
.timeline li::before{content:"";position:absolute;left:-7px;top:.45em;width:12px;height:12px;border-radius:50%;background:var(--karte);border:2px solid var(--akzent)}
.timeline .jahr{display:block;font-weight:500;color:var(--text);font-size:.95rem}

/* Kontakt-Block (einziger Ort mit Netz-Canvas) */
.kontakt-sec{position:relative;overflow:hidden;isolation:isolate;background:var(--dunkel)}
.kontakt-sec .wrap{position:relative;z-index:2}
.kontakt-sec h2{font-size:clamp(1.8rem,3.6vw,2.8rem);letter-spacing:-.02em}
.netz{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;pointer-events:none}
.kontaktblock{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;align-items:center}
@media (max-width:860px){.kontaktblock{grid-template-columns:1fr}}
.kontaktdaten{list-style:none;margin:0;padding:0;font-size:1.15rem}
.kontaktdaten li{padding:.7rem 0;border-bottom:1px solid var(--linie-dunkel)}
.kontaktdaten span{display:block;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dunkel-text)}
.kontaktdaten a{text-decoration:none;font-weight:500;font-size:clamp(1.2rem,2vw,1.5rem)}
.content .kontaktdaten li{border-bottom-color:var(--linie)}
.content .kontaktdaten span{color:var(--text-2)}

/* Kurse */
.kursfilter{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;background:var(--karte);border:1px solid var(--linie);padding:1.2rem;margin-bottom:1.6rem}
.kursfilter label{display:flex;flex-direction:column;font-size:.85rem;font-weight:500;gap:.3rem}
.kursfilter select{font:inherit;padding:.55rem .7rem;border:1px solid var(--linie);border-radius:var(--radius);background:var(--weiss);min-width:12rem}
.kursfilter button{font:inherit}
.kursliste{display:grid;gap:1rem}
.kurs{display:grid;grid-template-columns:8.5rem 1fr auto;gap:1.4rem;align-items:center;border:1px solid var(--linie);padding:1.3rem 1.5rem;background:var(--karte)}
@media (max-width:720px){.kurs{grid-template-columns:1fr}}
.kurs .datum{font-weight:700;font-size:1.05rem;line-height:1.25}
.kurs .datum small{display:block;font-weight:400;color:var(--text-2);font-size:.85rem}
.kurs h3{margin:0 0 .3rem;font-size:1.15rem}
.kurs .meta{font-size:.9rem;color:var(--text-2)}
.tag{display:inline-block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--akzent);color:var(--akzent-text);padding:.12rem .45rem;margin-right:.35rem}
.leer{padding:1.6rem;background:var(--karte);border:1px solid var(--linie);color:var(--text-2)}

/* Formular */
.formular{display:grid;gap:1.1rem;max-width:38rem}
.formular .zeile{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:640px){.formular .zeile{grid-template-columns:1fr}}
.formular label{display:flex;flex-direction:column;gap:.35rem;font-weight:500;font-size:.95rem}
.formular input,.formular textarea,.formular select{font:inherit;font-weight:400;padding:.75rem .85rem;border:1px solid var(--text-2);border-radius:var(--radius);background:var(--weiss);color:var(--text)}
.formular input:focus,.formular textarea:focus{border-color:var(--text)}
.formular .check{flex-direction:row;align-items:flex-start;gap:.6rem;font-weight:400}
.formular .check input{margin-top:.3rem}
.formular .pflicht{color:var(--akzent-text)}
.formular .hp{position:absolute;left:-9999px}
.hinweis{padding:1rem 1.2rem;border-left:4px solid var(--akzent);background:var(--karte);margin:1rem 0}
.hinweis.is-fehler{border-left-color:var(--terra)}
.hinweis.is-ok{border-left-color:var(--text)}

/* Blog */
.beitraege{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.6rem}
.beitrag{border-top:3px solid var(--akzent);padding-top:1.2rem}
.beitrag .meta{font-size:.85rem;color:var(--text-2);margin-bottom:.5rem}
.beitrag h3{font-size:1.2rem}
.beitrag h3 a{text-decoration:none}
.pagination{margin-top:2.5rem;display:flex;gap:.6rem;flex-wrap:wrap}
.pagination .page-numbers{padding:.4rem .8rem;border:1px solid var(--linie);text-decoration:none}
.pagination .current{background:var(--text);color:var(--weiss);border-color:var(--text)}

/* Leistungsrad (Seite Leistungen, statisch, ohne Rotation und Timer) + redaktionelle Abschnitte */
.rad-wrap{margin:1rem 0 clamp(3rem,7vw,6rem);padding:clamp(2rem,5vw,4rem) 0;background:radial-gradient(60% 70% at 50% 50%,var(--weiss) 0%,var(--papier) 70%);position:relative;overflow:hidden}
.rad{position:relative;max-width:1180px;margin:0 auto}
.rad-kreis{position:relative;width:min(560px,86vw);aspect-ratio:1;margin:0 auto}
.rad-kreis svg{width:100%;height:100%;overflow:visible;display:block}
.rad-ring{fill:none;stroke:var(--linie);stroke-width:1;stroke-dasharray:2 7}
.rad-ring-innen{fill:var(--weiss);stroke:var(--linie);stroke-width:1}
.rad-seg{cursor:pointer;outline:none}
.rad-seg path{fill:var(--weiss);stroke:var(--linie);stroke-width:1.2;transition:fill .45s,stroke .45s}
.rad-seg text{font-size:26px;font-weight:400;letter-spacing:-.02em;fill:var(--text-2);transition:fill .4s;pointer-events:none}
.rad-seg:hover path,.rad-seg:focus-visible path{fill:color-mix(in srgb,var(--akzent) 18%,var(--weiss));stroke:var(--akzent)}
.rad-seg.aktiv path{fill:var(--btn-bg);stroke:var(--akzent-text)}
.rad-seg.aktiv text{fill:var(--btn-text);font-weight:500}
.rad-seg:focus-visible path{stroke-width:3}
.rad-neu{fill:var(--terra)}
.rad-mitte{position:absolute;left:50%;top:50%;width:33%;transform:translate(-50%,-50%);text-align:center;display:flex;flex-direction:column;align-items:center;gap:.25rem;pointer-events:none}
.rad-m-nr{font-size:clamp(1.8rem,3.4vw,2.8rem);font-weight:200;letter-spacing:-.04em;color:var(--akzent-text);line-height:1}
.rad-m-titel{font-size:clamp(.82rem,1.25vw,1.02rem);font-weight:600;color:var(--text);line-height:1.2}
.rad-m-tag{font-size:clamp(.68rem,.95vw,.8rem);color:var(--text-2);line-height:1.3;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rad-label{position:absolute;width:15.5rem;transform:translateY(-50%);font-size:.98rem;line-height:1.3;color:var(--text);text-decoration:none;padding:.3rem 0;transition:color .3s}
.rad-label.r{margin-left:.4rem}
.rad-label.l{transform:translate(-100%,-50%);text-align:right;margin-left:-.4rem}
.rad-label span{display:block;font-size:.72rem;letter-spacing:.18em;color:var(--akzent-text)}
.rad-label em{font-style:normal;font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;background:var(--terra);color:var(--weiss);padding:.08rem .35rem;vertical-align:middle}
.rad-label::after{content:"";display:block;height:1px;margin-top:.35rem;background:var(--akzent);transform:scaleX(0);transition:transform .45s cubic-bezier(.2,.75,.2,1)}
.rad-label.r::after{transform-origin:left}.rad-label.l::after{transform-origin:right}
.rad-label:hover,.rad-label.aktiv{color:var(--akzent-text)}
.rad-label.aktiv::after,.rad-label:hover::after{transform:scaleX(1)}
.rad-liste{display:none}
@media (max-width:1100px){
  .rad-label{display:none}
  .rad-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.3rem 1.4rem;list-style:none;margin:2rem auto 0;padding:0 1rem;max-width:760px}
  .rad-liste a{display:flex;gap:.7rem;align-items:baseline;padding:.6rem 0;border-bottom:1px solid var(--linie);color:var(--text);text-decoration:none;font-size:.98rem}
  .rad-liste a span{font-size:.75rem;letter-spacing:.14em;color:var(--akzent-text)}
  .rad-liste a.aktiv{color:var(--akzent-text)}
}
@media (max-width:520px){.rad-m-tag{display:none}.rad-mitte{width:40%}}
.feld-sek{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.25fr);gap:clamp(2rem,6vw,6rem);padding:clamp(4rem,9vw,7.5rem) clamp(1.2rem,4vw,3.5rem);background:var(--papier);scroll-margin-top:5rem;position:relative}
.feld-sek.ist-hell{background:var(--weiss)}
.fs-sticky{position:sticky;top:calc(var(--kopf) + 1.5rem)}
.fs-nr{display:block;font-size:clamp(5rem,11vw,9.5rem);font-weight:200;letter-spacing:-.06em;line-height:.85;color:var(--akzent);margin-bottom:1rem}
.feld-sek h2{font-size:clamp(1.8rem,3.2vw,2.8rem);font-weight:var(--titel-gewicht);letter-spacing:-.025em;line-height:1.08;color:var(--text);margin:0 0 1rem;hyphens:auto;-webkit-hyphens:auto}
.feld-sek h2 .neu{margin-left:.6rem;font-size:.66rem}
.fs-tag{font-size:clamp(1.05rem,1.5vw,1.25rem);color:var(--akzent-text);line-height:1.45;margin:0 0 1.8rem;max-width:26rem}
.fs-ikone .ikone{width:150px;stroke:var(--text);stroke-width:2}
.fs-ikone .ikone .gold{stroke:var(--akzent)}
.fs-ikone .ikone .punkt{fill:var(--akzent)}
.fs-ikone .ikone .fuell{fill:color-mix(in srgb,var(--akzent) 18%,transparent)}
.fs-rechts{position:relative;padding-left:clamp(1.2rem,3vw,2.6rem)}
.fs-linie{position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--linie)}
.fs-linie i{position:absolute;left:0;top:0;width:1px;height:100%;background:var(--akzent);transform:scaleY(var(--p,0));transform-origin:top}
.fs-intro{font-size:clamp(1.15rem,1.7vw,1.45rem);font-weight:300;line-height:1.55;color:var(--text);margin:0 0 2.4rem}
.fs-h{font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:var(--akzent-text);font-weight:500;margin:0 0 .8rem}
.fs-punkte{list-style:none;margin:0 0 2.6rem;padding:0}
.fs-punkte li{display:grid;grid-template-columns:2rem 1fr;align-items:baseline;padding:1rem 0;border-top:1px solid var(--linie);font-size:1.05rem;color:var(--text);transition:padding .35s,color .35s}
.fs-punkte li:last-child{border-bottom:1px solid var(--linie)}
.fs-punkte li span{font-size:.85rem;color:var(--akzent-text);font-weight:600}
.fs-punkte li:hover{padding-left:.6rem;color:var(--akzent-text)}
.fs-aktion{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 2rem}
.fs-zurueck{font-size:.9rem;color:var(--text-2);text-decoration:none}
.fs-zurueck:hover{color:var(--akzent-text)}
@media (max-width:900px){.feld-sek{grid-template-columns:1fr}.fs-sticky{position:static}.fs-ikone{display:none}}

/* Fachwissen */
.fw-hinweis{background:var(--btn-bg);color:var(--btn-text);text-align:center;font-size:.85rem;padding:.5rem 1rem;font-weight:500}
.fw-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.fw-filter .tag{text-decoration:none}
.fw-filter .tag.ist-aktiv{background:var(--btn-bg);color:var(--btn-text);border-color:var(--btn-bg)}
.fw-karten{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.6rem}
.fw-karte{display:flex;flex-direction:column;gap:.6rem;border-top:3px solid var(--akzent);background:var(--karte);padding:1.3rem 1.3rem 1.1rem;text-decoration:none;color:var(--text);box-shadow:var(--schatten);transition:transform .2s,box-shadow .2s}
.fw-karte:hover{transform:translateY(-3px);box-shadow:0 2px 4px color-mix(in srgb,var(--nacht) 8%,transparent),0 14px 30px color-mix(in srgb,var(--nacht) 10%,transparent)}
.fw-karte h3{font-family:var(--schrift-titel);font-size:1.25rem;margin:0}
.fw-karte p{margin:0;color:var(--text-2);font-size:.95rem}
.fw-k-kopf{display:flex;justify-content:space-between;font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--akzent-text)}
.fw-k-fuss{margin-top:auto;font-weight:500;color:var(--akzent-text)}
.fw-k-fuss::after{content:" →"}
.fw-entwurf{font-size:.78rem;color:var(--akzent-text);font-style:normal}
.fw-text .fw-kurz{background:var(--karte);border-left:4px solid var(--akzent);padding:1.2rem 1.5rem;margin:0 0 2rem}
.fw-kurz-t,.fw-merk-t,.fw-quellen-t{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--akzent-text);font-weight:500;margin:0 0 .6rem}
.fw-kurz ul{margin:0;padding-left:1.1rem}
.fw-text .fw-merk{margin:2.4rem 0;padding:1.3rem 1.6rem;background:var(--dunkel);color:var(--dunkel-titel);border:0}
.fw-merk .fw-merk-t{color:var(--akzent-hell)}
.fw-merk p:last-child{margin:0;font-size:1.1rem;font-weight:300}
.fw-quellen{border-top:1px solid var(--linie);margin-top:2rem;padding-top:1.2rem;font-size:.9rem;color:var(--text-2)}
.fw-autor{font-size:.85rem;color:var(--text-2);margin-top:1.5rem}
.fw-voll .btn-link{margin-left:1rem}

/* Über uns: Layout im Theme (vorher Inline-Style im Seiteninhalt) */
.iduia-about-cover{margin:0 0 2.5rem}
.iduia-about-cover img{width:100%;height:auto}
.iduia-about-cover .iduia-platzhalter{aspect-ratio:3/2;display:flex;flex-direction:column;justify-content:center}
.iduia-about-cover figcaption{margin-top:.5rem;color:var(--text-2);font-size:.8rem}
.iduia-about-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,5vw,5rem);margin:0 0 2rem;align-items:start}
.iduia-about-intro .lead{font-size:clamp(1.3rem,2.2vw,1.85rem);line-height:1.4;color:var(--text);border-left:3px solid var(--akzent);padding-left:1.2rem;max-width:none}
.iduia-about-section{padding:3rem 0;border-top:1px solid var(--linie)}
.iduia-about-section>h2{margin:0 0 1.2rem}
.iduia-about-section>p{max-width:48rem}
.iduia-about-story{display:grid;grid-template-columns:1fr 2fr;gap:clamp(1.5rem,5vw,5rem)}
.iduia-about-story h2{margin:0}
.iduia-about-story .timeline{margin-top:0}
.iduia-about .iduia-founder>h2{margin:0 0 1rem}
.iduia-founder-summary{display:grid;grid-template-columns:1.1fr 1fr;gap:0 clamp(1.5rem,5vw,5rem);padding:0 0 2rem}
.iduia-founder-summary .rolle{grid-column:1/-1;color:var(--akzent-text);font-weight:500}
.iduia-founder-summary a{overflow-wrap:anywhere}
.iduia-about .team{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;margin:1.5rem 0 0}
.iduia-about .team-bau{grid-template-columns:1fr}
.iduia-about .person{padding:0 0 1rem;border:0;border-bottom:2px solid var(--akzent);background:transparent;min-width:0}
.iduia-about .person img{width:100%;height:auto;margin-bottom:1.2rem}
.iduia-about .person .iduia-platzhalter{aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:center;margin-bottom:1.2rem}
.iduia-about .person h3{font-size:1.35rem;margin-top:0}
.iduia-about .person a{overflow-wrap:anywhere}
.iduia-about .person p{line-height:1.65}
.iduia-about .team-bau .person{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(0,1.5fr);column-gap:1.3rem;align-content:start}
.iduia-about .team-bau .person img,.iduia-about .team-bau .person .iduia-platzhalter{grid-column:1;grid-row:1/7;max-width:360px}
.iduia-about .team-bau .person>:not(img):not(.iduia-platzhalter){grid-column:2}
@media (max-width:1000px){.iduia-about .team-bau .person{display:block}.iduia-about .team-bau .person img{max-width:200px}}
@media (max-width:760px){
  .iduia-about-intro,.iduia-about-story{grid-template-columns:1fr;gap:1rem}
  .iduia-about .team,.iduia-about .team-bau{grid-template-columns:1fr;gap:2.5rem}
  .iduia-about .person img{max-width:400px}
  .iduia-about-section{padding:2rem 0}
  .iduia-founder-summary{grid-template-columns:1fr;gap:0}
  .iduia-founder-summary .rolle{grid-column:auto}
  .iduia-about .team-bau .person img{max-width:280px}
}

/* Karte und Mandatsbuch (BAU-3) */
.referenzkarte{margin:clamp(2rem,5vw,4rem) 0}.referenzkarte svg{display:block;width:100%;height:auto;border:1px solid var(--linie);background:var(--papier)}.referenzkarte figcaption{margin:.65rem 0 0;color:var(--text-2);font-size:.82rem}.referenzkarte:focus-within figcaption{color:var(--text);font-weight:600}.referenzkarte .ort:focus{outline:none}.referenzkarte .ort:focus-visible{outline:3px solid var(--akzent);outline-offset:5px}.referenzkarte .ort:focus .ort-halo{stroke-width:6}.referenz-zahlen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:2rem 0 4rem;background:var(--linie);border:1px solid var(--linie)}.referenz-zahlen>div{display:flex;align-items:baseline;gap:1rem;padding:clamp(1.1rem,3vw,2rem);background:var(--weiss)}.referenz-zahlen strong{font-family:var(--schrift-titel);font-size:clamp(2.5rem,6vw,5rem);font-weight:400;color:var(--akzent-text)}.referenz-zahlen span{color:var(--text-2)}.referenz-zahlen>p{grid-column:1/-1;margin:0;padding:.7rem 1rem;background:var(--papier);color:var(--text-2);font-size:.82rem}.mandatsbuch{margin:1.5rem 0 4rem;border-top:2px solid var(--text)}.mandatsbuch ol{list-style:none;margin:0;padding:0}.mandatsbuch li{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(9rem,.5fr);gap:.3rem 2rem;padding:1rem 0;border-bottom:1px solid var(--linie)}.mandatsbuch strong{font-weight:600}.mandatsbuch .lage{display:block;margin-top:.15rem;color:var(--text-2);font-size:.86rem}.mandat-art{color:var(--text-2);font-size:.82rem;letter-spacing:.06em;text-transform:uppercase}.mandat-detail,.mandat-freigabe{grid-column:1/-1;margin:.25rem 0 0;font-size:.86rem}.mandat-detail{color:var(--akzent-text)}.mandat-freigabe{color:var(--text-2)}.fallbeispiele{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.5rem 0 4rem}.fallbeispiele .iduia-platzhalter{display:grid;min-height:10rem;place-items:center}.logowall .logo-kachel img{max-height:5rem;max-width:100%;object-fit:contain}
@media(max-width:700px){.referenzkarte{width:100%;margin-left:0}.referenz-zahlen,.fallbeispiele{grid-template-columns:1fr}.referenz-zahlen>p{grid-column:auto}.mandatsbuch li{grid-template-columns:1fr}.mandat-detail,.mandat-freigabe{grid-column:auto}.fallbeispiele .iduia-platzhalter{min-height:7rem}}

/* =====================================================================
   4 SEITEN
   ===================================================================== */


/* ---------- Bausteine der früheren Startseite (BAU-2), die Unterseiten weiter brauchen ----------
   Seit BAU-8 nutzt die Startseite keinen davon mehr. Es bleiben: Jahresband (.gj, Leistungsseiten), Arbeitsfelder (.af-*, Übersicht
   Leistungen), Stempel und Wege (.do-*, Lagen und Fallbeispiel), Kursblatt (.kb, Leistungsseiten), Schluss (.sl, Leistungsseiten).
   Entfernt sind Gemeindejahr-Kopf, Dossier-Reiter, Licht und Fensterlicht, Region mit Mandatsbuch, Menschen, Fachwissen-Karte. */
.gj,.sl,.ls{--max:1320px;--gap:clamp(1.25rem,4vw,3.5rem);--linie-stark:color-mix(in srgb,var(--text) 32%,transparent)}
.sl{padding:clamp(4.5rem,9vw,8.5rem) 0}
.knopf{display:inline-flex;align-items:center;padding:.95rem 1.4rem;background:var(--text);color:var(--flaeche);text-decoration:none;font-weight:500;font-size:.98rem;border:2px solid var(--text);border-radius:var(--radius);transition:background .2s,color .2s}
.knopf:hover{background:transparent;color:var(--text)}
.knopf.leer{background:transparent;color:var(--text)}
.knopf.leer:hover{background:var(--text);color:var(--flaeche)}
/* Jahresband der Leistungsseiten: Zwölfer-Raster, Kupferlinie bei --heute (Anteil 0–1, serverseitig) */
.gj{position:relative;overflow:hidden;background:var(--flaeche);padding:0 var(--gap)}
.gj-raster{position:absolute;inset:0 var(--gap);display:grid;grid-template-columns:repeat(12,1fr);pointer-events:none}
.gj-raster span{border-left:1px solid var(--linie)}
.gj-raster span:last-child{border-right:1px solid var(--linie)}
.gj-vergangen{position:absolute;top:0;bottom:0;left:var(--gap);width:calc((100% - 2 * var(--gap)) * var(--heute));background:color-mix(in srgb,var(--akzent) 3%,transparent);transform-origin:left}
.gj-heute{position:absolute;top:0;bottom:0;left:calc(var(--gap) + (100% - 2 * var(--gap)) * var(--heute));width:2px;margin-left:-1px;background:var(--akzent);transform-origin:top}
.gj-heute span{position:absolute;top:1.1rem;left:.6rem;white-space:nowrap;font-size:.75rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--akzent-text);background:var(--flaeche);padding:.15rem .4rem}
.gj.spaet .gj-heute span{left:auto;right:.6rem}
.gj-band{position:relative;padding-bottom:clamp(2.5rem,5vw,4rem)}
.gj-monate{list-style:none;margin:0 0 .2rem;padding:0;display:grid;grid-template-columns:repeat(12,1fr);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2);border-bottom:1px solid var(--linie-stark)}
.gj-monate li{display:flex}
.gj-monate button{flex:1;min-height:2.4rem;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;border-bottom:3px solid transparent;padding:.45rem .5rem;text-align:left;cursor:pointer}
.gj-monate button:disabled{cursor:default;color:inherit;opacity:1}
.gj-monate button:not(:disabled):hover{color:var(--text);border-bottom-color:var(--linie-stark)}
.gj-monate button[aria-pressed="true"]{color:var(--akzent-text);border-bottom-color:var(--akzent)}
.gj-spur{border-bottom:1px solid var(--linie);padding-top:.4rem}
.gj-spur h3{margin:0;font-family:var(--schrift-text);font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;line-height:1.3;color:var(--text)}
.gj-spur h3 small{font-size:inherit;font-weight:400;letter-spacing:.04em;text-transform:none;color:var(--text-2);margin-left:.35rem}
.gj-spur ul{list-style:none;margin:0;padding:0;position:relative;height:2.7rem}
.gj-spur li{position:absolute;top:.3rem;bottom:.4rem;left:calc(var(--s) / 12 * 100%);width:calc((var(--e) - var(--s)) / 12 * 100%);padding:.2rem .55rem;background:var(--weiss);border:1px solid var(--linie-stark);border-left:3px solid var(--text);font-size:.78rem;line-height:1.15;display:flex;align-items:center;overflow:hidden}
.gj-spur li small{display:none}
.gj-spur li.jetzt{border-color:var(--akzent);border-left-color:var(--akzent);background:color-mix(in srgb,var(--akzent) 6%,var(--weiss));font-weight:500}
.gj-spur li.jetzt::after{content:"jetzt";margin-left:auto;padding-left:.4rem;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--akzent-text)}
.gj-spur li.gj-punkt{width:auto;background:none;border:0;padding:0 0 0 .9rem;overflow:visible;white-space:nowrap}
.gj-spur li.gj-punkt::before{content:"";position:absolute;left:-5px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--text)}
.gj-spur li.gj-kurs::before{background:var(--akzent);width:12px;height:12px;margin-top:-6px;left:-6px}
.gj-spur li.gj-links{padding:0 .9rem 0 0;transform:translateX(-100%)}
.gj-spur li.gj-links::before{left:auto;right:-5px}
.gj-spur li.gj-links.gj-kurs::before{right:-6px}
.gj-spur li.gj-punkt.jetzt{background:none;font-weight:500}
.gj-spur li.gj-punkt.jetzt::after{content:none}
.gj-spur li.gj-leer{position:static;display:block;border:0;background:none;padding:.7rem 0;color:var(--text-2)}
.gj-hinweis{font-size:.8rem;color:var(--text-2);margin:.7rem 0 0}
.gj-legende{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;font-size:.8rem;color:var(--text-2);margin:.8rem 0 0}
.gj-k-kurs::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--akzent);margin-right:.45rem}
.gj-stand{position:relative;margin:1.4rem 0 0;padding:1rem 0 0;border-top:1px solid var(--linie-stark);font-size:.92rem;color:var(--text-2);max-width:var(--max);text-shadow:0 0 4px var(--flaeche),0 0 8px var(--flaeche)}
.gj-stand b{color:var(--text);font-weight:500}
/* Arbeitsfelder der Übersicht Leistungen, gleich breit */
.af-felder{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--text)}
.af-feld{display:flex;flex-direction:column;min-width:0;padding:clamp(2rem,3.5vw,3rem) clamp(1.2rem,2.6vw,2.6rem) 0}
.af-feld:first-child{padding-left:0}
.af-feld:last-child{padding-right:0}
.af-feld+.af-feld{border-left:1px solid var(--linie)}
.af-rubrik{font-size:.78rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--akzent-text);margin:0 0 1rem}
.af-feld h3{font-family:var(--schrift-text);font-size:clamp(1.9rem,3vw,2.8rem);font-weight:300;letter-spacing:-.03em;line-height:1.08;margin:0 0 1rem}
.af-feld>p{color:var(--text-2);margin:0}
.af-feld>p b{color:var(--text);font-weight:500}
/* Stempel und Wege einer Lage (Leistungsseiten «Was dann auf dem Tisch liegt», Fallbeispiel) */
.do-stempel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:1.8rem 0 0;background:color-mix(in srgb,var(--akzent) 45%,transparent);border:2px solid var(--akzent);border-radius:3px;max-width:56rem}
.do-stempel div{min-width:0;padding:.7rem 1rem;background:var(--weiss)}
.do-stempel dt{font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--akzent-text)}
.do-stempel dd{margin:.25rem 0 0;font-size:1rem;line-height:1.35;color:var(--text)}
.do-wege{display:grid;grid-template-columns:1fr 1fr;margin-top:clamp(1.8rem,3vw,2.6rem);border-top:1px solid var(--text)}
.do-weg{min-width:0;padding:1.4rem clamp(1.2rem,3vw,2.6rem) 0 0}
.do-weg+.do-weg{border-left:1px solid var(--linie);padding:1.4rem 0 0 clamp(1.2rem,3vw,2.6rem)}
.do-weg-art{font-size:.75rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--akzent-text);margin:0 0 .5rem}
.do-weg h4{font-size:clamp(1.3rem,2vw,1.7rem);font-weight:400;letter-spacing:-.015em;line-height:1.2;margin:0 0 .6rem}
.do-weg p{color:var(--text-2);margin:0 0 .8rem;max-width:34rem}
.do-weg .do-weg-wer{font-size:.92rem}
.do-weg-wer span{color:var(--text);font-weight:500}
/* Kursblatt (vergangene Kurse fallen serverseitig weg) */
.kb{display:grid;grid-template-columns:5.5rem 1fr;gap:1.4rem;padding:1.4rem 0;border-top:1px solid var(--linie)}
.kb:last-of-type{border-bottom:1px solid var(--linie)}
.kb-blatt{align-self:start;margin:0;text-align:center;background:var(--weiss);border:1px solid var(--text)}
.kb-blatt b{display:block;padding:.6rem 0 .25rem;font-size:2.4rem;font-weight:300;line-height:1;letter-spacing:-.03em}
.kb-blatt span{display:block;padding:.25rem 0;font-size:.7rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;background:var(--text);color:var(--flaeche)}
.kb h4{margin:0 0 .35rem;font-size:1.2rem;font-weight:500;line-height:1.25}
.kb h4 a{text-decoration:none}
.kb p{margin:0;font-size:.92rem;color:var(--text-2)}
.kb .kb-anmeldung{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem 1.2rem;margin-top:.6rem}
.kb-anmeldung a{color:var(--text)}
.kb-bald{font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--akzent-text)}
/* Schluss (Nacht) der Leistungsseiten */
.sl-gitter{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:3rem 5rem;align-items:end}
.sl h2{max-width:14ch;margin:0;font-family:var(--schrift-text);font-size:clamp(2.6rem,6vw,5.6rem);font-weight:300;letter-spacing:-.045em;line-height:.98}
.sl .sl-telefon{display:inline-block;margin-top:1.6rem;font-size:clamp(2.2rem,5vw,3.8rem);font-weight:300;letter-spacing:-.02em;line-height:1.15;color:var(--akzent-hell);text-decoration:none;border-bottom:2px solid var(--akzent-hell)}
.sl .sl-telefon:hover{color:var(--dunkel-titel)}
.sl-schalk{margin:1.2rem 0 0;font-size:1.1rem;color:var(--dunkel-text)}
.sl-angaben{display:grid;gap:1.4rem}
.sl-angaben p{margin:0;color:var(--dunkel-text)}
.sl-angaben b{display:block;font-weight:500;color:var(--dunkel-titel)}
@media (max-width:980px){
  .sl-gitter{grid-template-columns:1fr}
  .af-felder{grid-template-columns:1fr}
  .af-feld,.af-feld:first-child,.af-feld:last-child{padding:2rem 0 0}
  .af-feld+.af-feld{margin-top:2.5rem;border-left:0;border-top:1px solid var(--linie)}
  .do-stempel{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:700px){
  /* Jahresband wird Liste, jede Zeile mit eigenem Zwölftel-Strich (wie K1) */
  .gj-monate button{padding:.45rem 0;text-align:center}
  .gj-lang{display:none}
  .gj-heute span{top:.6rem}
  .gj-spur{padding:.6rem 0}
  .gj-spur h3{margin-bottom:.3rem}
  .gj-spur ul{height:auto}
  .gj-spur li,.gj-spur li.gj-punkt,.gj-spur li.gj-links{position:relative;left:auto;top:auto;bottom:auto;width:auto;display:block;padding:.25rem 0 .8rem;font-size:.9rem;white-space:normal;background:none;border:0;overflow:visible;transform:none}
  .gj-spur li small{display:inline;color:var(--text-2)}
  .gj-spur li::before,.gj-spur li.gj-punkt::before,.gj-spur li.gj-links::before,.gj-spur li.gj-kurs::before{content:"";position:absolute;top:auto;bottom:.3rem;left:calc(var(--s) / 12 * 100%);right:auto;width:max(8px,calc((var(--e) - var(--s)) / 12 * 100%));height:5px;margin:0;border-radius:0;background:var(--text)}
  .gj-spur li.jetzt::before,.gj-spur li.gj-kurs::before{background:var(--akzent)}
  .gj-spur li.jetzt{background:none}
  .gj-spur li.jetzt::after{content:" · jetzt";margin:0;padding:0;font-size:.75rem}
  .do-wege{grid-template-columns:1fr}
  .do-weg,.do-weg+.do-weg{padding:1.4rem 0 0;border-left:0}
  .do-weg+.do-weg{margin-top:1.4rem;border-top:1px solid var(--linie)}
  .kb{grid-template-columns:4.4rem 1fr;gap:1rem}
  .kb-blatt b{font-size:1.9rem}
}
@media (max-width:420px){
  .do-stempel{grid-template-columns:1fr}
}

/* ---------- Startseite (BAU-8): Prospekt B (LESBAR-3B) mit dem Jahresband aus «Ruhe» (LESBAR-1) ----------
   Sechs Bildschirme, ein Raster (.wrap, 1200 px), je eine Überschrift, ein Absatz, ein Link. Keine Bewegung, keine Versalien,
   kein Gewicht 300, nichts unter 15 px. Fliesstext 18 px / 1.55, Zeilen höchstens 34 em (≈ 68 Zeichen). Nur Rollen-Tokens.
   Kopf und Fuss werden nur auf der Startseite auf dieselben Untergrenzen gehoben (body:has(.pr-start), nicht .home: die Vorschau-Stubs
   geben jeder Seite .home, und ein body_class-Filter würde beim Rendern mehrerer Seiten in einem Lauf mitwandern). Unterseiten bleiben, wie sie sind. */
.pr{display:flex;align-items:center;min-height:min(54rem,calc(100svh - var(--kopf)));padding:6rem 0;background:var(--papier);font-size:1.125rem;line-height:1.55}
.pr:nth-of-type(even){background:var(--weiss)}
.pr>.wrap{width:100%}
.pr h1,.pr h2{font-family:var(--schrift-text);font-weight:500;letter-spacing:-.015em;line-height:1.1;color:var(--text);max-width:17em;margin:0 0 2.5rem;text-wrap:balance}
.pr h1{font-size:4rem}
.pr h2{font-size:3.5rem}
.pr p{max-width:34em;margin:0 0 1.5rem}
.pr p:last-child{margin-bottom:0}
.pr b{font-weight:500}
.pr a{color:var(--text)}
.pr a:hover{color:var(--akzent-text)}
.pr-link{font-weight:500;text-decoration:none;border-bottom:2px solid var(--akzent);padding-bottom:2px}
.pr-link::after{content:"\00a0→"}

/* 1 Aussage: Unterzeile mit Datum und Monatssatz */
.pr-stand{font-size:1.5rem;line-height:1.4;font-weight:500}
.pr .pr-stand{margin-bottom:2rem}
.pr-stand time{color:var(--akzent-text)}
.pr-stand time::after{content:"\00a0·"}

/* 2 Jahresband: je Spur eine Zeile (Name, Balken, Klartext), darüber die Monate; Kupfer = jetzt, Tintenlinie = heute */
.pr-band{margin-top:3rem;border-top:2px solid var(--text)}
.pr-spuren{list-style:none;margin:0;padding:0}
.pr-band-zeile{display:grid;grid-template-columns:11rem minmax(0,2fr) minmax(0,1fr);gap:0 2rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--linie)}
.pr-band-monate{padding:.5rem 0}
.pr-monate{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));font-size:1rem;color:var(--text-2)}
.pr-monate li{padding-left:.35rem;border-left:1px solid var(--linie)}
.pr-monate .pr-heute{color:var(--akzent-text);font-weight:500}
.pr-spur-name{font-size:1.25rem;line-height:1.3}
.pr-balken{position:relative;display:block;height:1.25rem;background:color-mix(in srgb,var(--text) 6%,transparent)}
.pr-balken span{position:absolute;top:0;bottom:0;left:calc(var(--s) / 12 * 100%);width:calc((var(--e) - var(--s)) / 12 * 100%);background:color-mix(in srgb,var(--text) 30%,transparent);border-left:2px solid var(--weiss)}
.pr-balken .pr-jetzt{background:var(--akzent)}
.pr-heute-linie{position:absolute;top:-.5rem;bottom:-.5rem;left:calc(var(--heute) * 100%);width:2px;background:var(--text)}
.pr-spur-text{font-size:1rem;line-height:1.45}
.pr .pr-weitere{margin-top:1.75rem}

/* 3 Drei Felder: drei gleich grosse Zeilen, darunter bei der Beratung die vier Felder als Kleinzeile */
.pr-feldliste{list-style:none;margin:3.5rem 0 0;padding:0}
.pr-feldliste>li{display:grid;grid-template-columns:7fr 5fr;gap:.5rem 2rem;align-items:baseline;padding:1.6rem 0;border-top:1px solid var(--linie)}
.pr-feldliste>li:last-child{border-bottom:1px solid var(--linie)}
.pr-feld{font-size:2.5rem;line-height:1.15;font-weight:500;letter-spacing:-.01em;text-decoration:none}
.pr-feld::after{content:"\00a0→";color:var(--akzent-text)}
.pr-feld-satz{font-size:1.25rem;color:var(--text-2)}
.pr-unterfelder{grid-column:1/-1;list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1.75rem;font-size:1.0625rem;line-height:1.5}
.pr-unterfelder a{text-decoration-thickness:1px}

/* 4 Region und 5 Menschen: Text links, Bild rechts */
.pr-zwei{display:grid;grid-template-columns:7fr 5fr;gap:4rem;align-items:center}
.pr-region .pr-zwei{grid-template-columns:4fr 8fr;align-items:start}
.pr-region h2{max-width:none}
/* Die Karte (900 × 560) braucht mindestens 750 px Breite, damit ihre Beschriftung (18 px im Bild) nicht unter 15 px fällt;
   auf breiten Bildschirmen läuft sie darum bis zu 6 rem über den rechten Rand des Rasters. */
@media (min-width:1300px){.pr-region .pr-karte{margin-right:-6rem}}
.pr-bild{margin:0}
.pr-bild img{width:100%;height:auto}
.pr-karte figcaption{margin-top:.75rem;font-size:1rem;color:var(--text-2)}
.pr-foto img{aspect-ratio:4/5;object-fit:cover;object-position:67% 30%}
.pr-foto .iduia-platzhalter{aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:center;font-size:1rem}
.pr-person{display:grid;grid-template-columns:6rem minmax(0,1fr);gap:1.5rem;align-items:center;margin:0 0 1.5rem}
.pr-pfoto{margin:0}
.pr-pfoto img,.pr-pfoto .iduia-platzhalter{width:6rem;height:6rem;object-fit:cover;object-position:50% 22%}
.pr-pfoto .iduia-platzhalter{overflow:hidden;font-size:1rem;line-height:1.2}
.pr-netz{list-style:none;margin:0 0 2rem;padding:0;font-size:1.125rem}
.pr-netz li{padding:.6rem 0;border-top:1px solid var(--linie)}
.pr-netz li:last-child{border-bottom:1px solid var(--linie)}
.pr-netz span{color:var(--text-2)}
.pr-netz b::after{content:"\00a0·"}

/* 6 Kontakt: Telefon gross, darunter Kurs und Fachbeitrag als je eine Zeile */
.pr-telefon{font-size:3rem;line-height:1.1;font-weight:500;text-decoration:none;border-bottom:3px solid var(--akzent)}
.pr .pr-telefon{color:var(--text)}
.pr-zeilen{list-style:none;margin:3rem 0 0;padding:0;max-width:52rem}
.pr-zeilen li{display:grid;grid-template-columns:12rem 1fr;gap:.25rem 1.5rem;padding:1rem 0;border-top:1px solid var(--linie)}
.pr-zeilen li:last-child{border-bottom:1px solid var(--linie)}
.pr-zeilen li>span:first-child{color:var(--akzent-text);font-weight:500}
.pr-zeilen a{font-weight:500}
.pr-zeilen li>span+a+span{grid-column:2;color:var(--text-2)}

/* Kopf und Fuss auf der Startseite: nichts unter 15 px, keine Versalien */
body:has(.pr-start) .kopf-kontakt,body:has(.pr-start) .nav-toggle{font-size:.95rem}
body:has(.pr-start) .site-footer,body:has(.pr-start) .footer-bottom{font-size:1rem}
body:has(.pr-start) .site-footer h2{font-size:1rem;letter-spacing:0;text-transform:none}
body:has(.pr-start) .site-footer{padding:3.5rem 0 2rem}
body:has(.pr-start) .footer-bottom{margin-top:2.5rem}

@media (max-width:980px){
  .pr h1{font-size:3.5rem}
  .pr h2{font-size:3rem}
  .pr-zwei,.pr-region .pr-zwei{grid-template-columns:1fr;gap:3rem}
  .pr-foto img{aspect-ratio:auto}
}
/* Unter 860 px wird das Jahresband eine Liste: Name und Klartext je Spur, Monate und Balken entfallen */
@media (max-width:860px){
  .pr-band-monate,.pr-balken{display:none}
  .pr-band-zeile{grid-template-columns:minmax(0,1fr);gap:.2rem;padding:.9rem 0}
}
@media (max-width:640px){
  .pr{display:block;min-height:0;padding:4rem 0}
  .pr h1,.pr h2{font-size:3rem;letter-spacing:-.02em;margin-bottom:1.75rem;hyphens:manual}
  .pr-stand{font-size:1.25rem}
  .pr-band{margin-top:2rem}
  .pr-feldliste{margin-top:2.5rem}
  .pr-feldliste>li{grid-template-columns:1fr;padding:1.25rem 0}
  .pr-feld{font-size:1.75rem}
  .pr-feld-satz{font-size:1.125rem}
  .pr-person{grid-template-columns:5rem minmax(0,1fr);gap:1rem}
  .pr-pfoto img,.pr-pfoto .iduia-platzhalter{width:5rem;height:5rem}
  .pr-telefon{font-size:2.25rem}
  .pr-zeilen li{grid-template-columns:1fr}
  .pr-zeilen li>span+a+span{grid-column:1}
}


/* ---------- Seitenkopf hell, Leistung, Tagesband/Protokoll (BAU-5) ----------
   Der helle Seitenkopf ist .page-hero (oben, ohne Netz). Hier die Leistung darunter:
   Jahresband in .ls-bandkasten (Klassen .gj-* aus dem Block oben), Radios ohne Timer,
   Tagesband als Liste mit Kupferstrich. Keine Farbe ausserhalb der Tokens. */
.ls{padding:clamp(3.2rem,7vw,5.5rem) 0}
.ls-kopf{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(15rem,.7fr);gap:1.6rem 3rem;align-items:start}
.ls-entwurf,.ls-annahme,.ls-leer{max-width:46rem;margin:.8rem 0 0;font-size:.92rem;line-height:1.45;color:var(--text-2)}
.ls-personen{display:grid;gap:1rem}
.ls-person{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:.75rem;align-items:center}
.ls-person img,.ls-person .iduia-platzhalter{width:4.5rem;height:4.5rem;object-fit:cover;margin:0}
.ls-person .iduia-platzhalter{font-size:.68rem;line-height:1.25;padding:.3rem}
.ls-rolle{margin:0;font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--akzent-text)}
.ls-name{margin:.1rem 0 .15rem;font-size:1.05rem;font-weight:500;line-height:1.25;color:var(--text)}
.ls-person p{margin:0;font-size:.9rem;line-height:1.4}
.ls-person a{overflow-wrap:anywhere}
.ls-wahl{display:flex;flex-wrap:wrap;gap:0 1.4rem;margin:1.2rem 0 0;padding:0;border:0;border-bottom:1px solid var(--linie-stark)}
.ls-wahl-tab{position:relative;display:inline-flex;align-items:center;margin:0 0 -1px;padding:.75rem 0 .6rem;font-size:1rem;font-weight:500;color:var(--text-2);border-bottom:3px solid transparent;cursor:pointer}
.ls-wahl-tab:hover{color:var(--text)}
.ls-radio{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.ls-wahl-tab:has(.ls-radio:checked){color:var(--text);border-bottom-color:var(--akzent)}
.ls-wahl-tab:has(.ls-radio:focus-visible){outline:3px solid var(--akzent);outline-offset:3px}
@supports selector(:has(*)){
  .ls-baender .ls-bandpanel{display:none}
  .ls-baender:has(#ls-band-gemeinde:checked) #ls-panel-gemeinde,
  .ls-baender:has(#ls-band-kmu:checked) #ls-panel-kmu{display:block}
}
.ls-bandkasten.gj{padding:1.6rem var(--gap) 0}
.ls-bandtitel{margin:0 0 .3rem;font-size:clamp(1.45rem,2.4vw,2rem)}
.ls-teile{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:2rem 3rem}
.ls-punkte{list-style:none;margin:.4rem 0 0;padding:0;counter-reset:ls}
.ls-punkte li{position:relative;padding:.6rem 0 .6rem 2.4rem;border-bottom:1px solid var(--linie);overflow-wrap:anywhere}
.ls-punkte li::before{content:counter(ls,decimal-leading-zero);counter-increment:ls;position:absolute;left:0;top:.7rem;font-size:.75rem;font-weight:500;letter-spacing:.08em;color:var(--akzent-text)}
.ls-zwischentitel{margin:2.2rem 0 .6rem;font-size:1.15rem}
.ls-beratung{list-style:none;margin:0;padding:0;border-top:1px solid var(--text)}
.ls-beratung li{padding:.75rem 0;border-bottom:1px solid var(--linie)}
.ls-beratung a{font-weight:500;text-decoration:none}
.ls-beratung span{display:block;margin-top:.15rem;font-size:.92rem;color:var(--text-2)}
.ls-weise{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem 2rem;margin-top:1.4rem}
.ls-weise article{min-width:0;padding-top:.9rem;border-top:2px solid var(--akzent)}
.ls-weise h3{margin:0 0 .45rem;font-size:1.15rem}
.ls-weise p{margin:0;font-size:.98rem;color:var(--text-2)}
.ls-lage{padding:1.5rem 0 1.8rem;border-top:1px solid var(--text)}
.ls-lage h3{margin:0 0 .5rem;font-family:var(--schrift-text);font-size:clamp(1.35rem,2.2vw,1.8rem);font-weight:400}
.ls-lage-lead{max-width:42rem;margin:0 0 .4rem;color:var(--text-2)}
.ls-sieb{list-style:none;margin:1rem 0 0;padding:0;border-top:1px solid var(--text)}
.ls-sieb li{padding:.9rem 0;border-bottom:1px solid var(--linie)}
.ls-sieb a{font-weight:500;font-size:1.12rem;text-decoration:none}
.ls-sieb a span{display:inline-block;min-width:2.1rem;font-size:.75rem;font-weight:500;letter-spacing:.08em;color:var(--akzent-text)}
.ls-sieb p{margin:.25rem 0 0;font-size:.95rem;color:var(--text-2)}
.ls-mehr{margin:auto 0 0;padding-top:1.2rem}
.tb-liste{list-style:none;position:relative;margin:1.3rem 0 0;padding:0}
.tb-liste::before{content:"";position:absolute;left:4.5rem;top:.4rem;bottom:.4rem;width:2px;background:var(--akzent)}
.tb-liste li{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:.35rem 1.1rem;padding:.8rem 0;border-bottom:1px solid var(--linie)}
.tb-liste time{font-size:.95rem;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.4;color:var(--akzent-text)}
.tb-liste b{display:block;font-size:1.05rem;font-weight:500;color:var(--text)}
.tb-liste p{margin:.15rem 0 0;font-size:.95rem;line-height:1.45;color:var(--text-2)}
.tb-zwischentitel{margin:2rem 0 .4rem;font-size:1.2rem}
.tb-achse{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin:.8rem 0 0;padding:0}
.tb-achse li{min-width:0;padding-top:.75rem;border-top:2px solid var(--akzent)}
.tb-achse b{display:block;font-size:1.05rem;font-weight:500}
.tb-achse span{display:block;margin-top:.25rem;font-size:.9rem;color:var(--text-2)}
.tb-betrieb{list-style:none;margin:.4rem 0 0;padding:0;border-top:1px solid var(--text)}
.tb-betrieb li{padding:.65rem 0;border-bottom:1px solid var(--linie);font-weight:500}
@media (max-width:860px){
  .ls-kopf,.ls-weise{grid-template-columns:1fr}
}
@media (max-width:700px){
  .tb-achse{grid-template-columns:1fr}
  .tb-liste::before{left:.55rem}
  .tb-liste li{grid-template-columns:3.4rem minmax(0,1fr);gap:.3rem .8rem}
}

/* ---------- Fallbeispiel (BAU-7) ----------
   Ein Blatt aus dem Dossier auf Papier: Stempel wie die Lagen (.do-stempel), darunter Ausgangslage, Auftrag, Ergebnis
   nebeneinander, unter 860 px untereinander. Monat im Jahresband und Verweis als Fusszeile des Blatts. Nur Tokens. */
.fb-fall{max-width:72rem;margin-top:1.4rem;padding:clamp(1.3rem,3vw,2.4rem);background:var(--weiss);border-top:2px solid var(--akzent)}
.fb-art{margin:0 0 .45rem;font-size:.75rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--akzent-text)}
.fb-betreff{margin:0;font-family:var(--schrift-text);font-size:clamp(1.35rem,2.2vw,1.8rem);font-weight:400}
.fb-stempel{margin-top:1.2rem}
.fb-teile{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem 0;margin-top:1.6rem}
.fb-teil{min-width:0;padding:0 clamp(1rem,2.4vw,2rem) 0 0}
.fb-teil+.fb-teil{padding-left:clamp(1rem,2.4vw,2rem);border-left:1px solid var(--linie)}
.fb-teil h4{margin:0 0 .5rem;font-size:.75rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--akzent-text)}
.fb-teil p{margin:0;font-size:1rem;line-height:1.6;color:var(--text);overflow-wrap:anywhere;hyphens:auto}
.fb-jahr{margin:1.6rem 0 0;padding-top:.9rem;border-top:1px solid var(--linie);font-size:.95rem;line-height:1.5;color:var(--text-2)}
.fb-jahr b{font-weight:500;color:var(--text)}
.fb-verweis{margin:.9rem 0 0;font-size:.95rem}
.fb-verweis span{margin-right:.6rem;font-size:.75rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--akzent-text)}
@media (max-width:860px){
  .fb-teile{grid-template-columns:1fr}
  .fb-teil,.fb-teil+.fb-teil{padding:0;border-left:0}
  .fb-teil+.fb-teil{padding-top:1.2rem;border-top:1px solid var(--linie)}
}

/* ---------- Beratung und Interim: Untermenü und vier Felder (BAU-6) ----------
   Untermenü ohne Skript: offen bei :hover und :focus-within, unter 980 px als eingerückte Liste.
   Die vier Felder sind eine zweite Kartenreihe unter den drei Arbeitsfeldern, gleiche Schrift und Linien. Nur Tokens. */
.primary-nav .current-menu-ancestor>a{border-bottom-color:var(--akzent)}
.primary-nav .menu-item-has-children{position:relative}
.primary-nav .menu-item-has-children>a::after{content:"";display:inline-block;width:.36em;height:.36em;margin:0 0 .22em .5em;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
@media (min-width:981px){
  .primary-nav .sub-menu{position:absolute;top:100%;left:-1.1rem;z-index:60;display:none;flex:none;flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;gap:0;min-width:16.5rem;padding:.35rem 1.1rem .5rem;background:var(--weiss);border:1px solid var(--linie);border-top:2px solid var(--akzent);box-shadow:0 10px 28px color-mix(in srgb,var(--nacht) 10%,transparent)}
  .primary-nav .menu-item-has-children:hover>.sub-menu,.primary-nav .menu-item-has-children:focus-within>.sub-menu{display:flex}
  .primary-nav .sub-menu a{padding:.6rem 0;border-bottom:1px solid var(--linie);white-space:nowrap}
  .primary-nav .sub-menu li:last-child>a{border-bottom-color:transparent}
  .primary-nav .sub-menu a:hover,.primary-nav .sub-menu .current-menu-item>a{color:var(--akzent-text);border-bottom-color:var(--linie)}
  .primary-nav .sub-menu li:last-child>a:hover{border-bottom-color:transparent}
}
@media (max-width:980px){
  .primary-nav .menu-item-has-children>a::after{content:none}
  .primary-nav .sub-menu{display:block;margin:0;padding:0 0 .2rem 1.1rem;border-left:2px solid var(--akzent)}
  .primary-nav .sub-menu a{padding:.55rem 0;font-size:.92rem;font-weight:400}
}
.bf{margin-top:clamp(2.5rem,4.5vw,3.5rem);border-top:1px solid var(--text)}
.af-felder>.bf{grid-column:1/-1;grid-row:2;min-width:0}
.af-felder>.bf+.af-feld{border-left:1px solid var(--linie)}
.bf-kopf{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3rem 1.4rem;margin:0;padding:1.4rem 0 0;font-family:var(--schrift-text);font-size:1rem;font-weight:400;line-height:1.4}
.bf-kopf .af-rubrik{margin:0}
.bf-unter{font-size:.92rem;color:var(--text-2)}
.bf-felder{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.bf-feld{position:relative;min-width:0;padding:1.3rem clamp(1rem,2vw,2rem) .4rem}
.bf-feld:first-child{padding-left:0}
.bf-feld:last-child{padding-right:0}
.bf-feld+.bf-feld{border-left:1px solid var(--linie)}
.bf-stich{margin:0 0 .7rem;font-size:.75rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--text-2)}
.bf-stich span{margin-right:.35rem;color:var(--akzent-text)}
.bf-titel{margin:0 0 .6rem;font-family:var(--schrift-text);font-size:clamp(1.45rem,2.1vw,1.95rem);font-weight:300;letter-spacing:-.025em;line-height:1.12}
.bf-titel a{text-decoration:none;color:var(--text)}
.bf-titel a::after{content:"";position:absolute;inset:0}
.bf-feld:hover .bf-titel a{color:var(--akzent-text)}
.bf-satz{margin:0;color:var(--text-2)}
.bf-satz::after{content:" →";color:var(--akzent-text)}
.site-footer .footer-feld{padding-left:.9rem}
@media (max-width:980px){
  .af-felder>.bf{grid-row:auto}
  .af-felder>.bf+.af-feld{margin-top:2.5rem;border-left:0;border-top:1px solid var(--linie)}
  .bf-felder{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bf-feld,.bf-feld:first-child,.bf-feld:last-child{padding:1.3rem 1.2rem 1.2rem 0}
  .bf-feld:nth-child(2n){padding:1.3rem 0 1.2rem 1.2rem}
  .bf-feld:nth-child(n+3){border-top:1px solid var(--linie)}
  .bf-feld:nth-child(3){border-left:0}
}
@media (max-width:620px){
  .bf-felder{grid-template-columns:1fr}
  .bf-feld,.bf-feld:first-child,.bf-feld:last-child,.bf-feld:nth-child(2n){padding:1.1rem 0 1.1rem}
  .bf-feld+.bf-feld{border-left:0;border-top:1px solid var(--linie)}
}

/* =====================================================================
   5 BEWEGUNG (nur mit .js am html-Element; ohne JS ist alles sichtbar)
   ===================================================================== */
/* Scroll-Reveal: nur mit .js ausgeblendet; Sicherheitsnetz: kommt das Skript nicht (kein .js-bereit), wird nach 2 s alles eingeblendet */
.js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity .9s cubic-bezier(.2,.75,.2,1),transform .9s cubic-bezier(.2,.75,.2,1);transition-delay:var(--d,0s)}
.js [data-reveal].is-visible{opacity:1;transform:none}
.js:not(.js-bereit) [data-reveal]{animation:notfall 0s 2s forwards}
@keyframes notfall{to{opacity:1;transform:none}}
.leistung[data-reveal].is-visible{transition:opacity .9s cubic-bezier(.2,.75,.2,1) var(--d,0s),transform .45s cubic-bezier(.2,.75,.2,1),box-shadow .3s,border-color .3s}
.timeline li::before{transition:background .4s .3s}
.timeline li.is-visible::before{background:var(--akzent)}

.js .ikone *{stroke-dasharray:var(--l,600);stroke-dashoffset:var(--l,600)}
.js .ikone .punkt{stroke-dasharray:none;stroke-dashoffset:0}
.js .feld-sek.sichtbar .ikone *{animation:zeichnen 1.8s cubic-bezier(.3,.7,.2,1) forwards}
.js .feld-sek.sichtbar .ikone .gold{animation-delay:.45s}
@keyframes zeichnen{to{stroke-dashoffset:0}}
/* Jahresband der Leistungsseiten: vergangene Fläche wächst von Januar bis heute (1.6 s), die Kupferlinie zeichnet sich, danach «jetzt».
   Nur mit .js. Die Startseite (BAU-8) hat keine Bewegung. */
.js .gj-vergangen{animation:gjBreit 1.6s cubic-bezier(.2,.7,.2,1) both}
.js .gj-heute{animation:gjHoch 1s cubic-bezier(.2,.7,.2,1) .2s both}
.js .gj-heute span,.js .gj-spur li.jetzt{animation:gjAuf .6s ease 1.4s both}
@keyframes gjBreit{from{transform:scaleX(0)}}
@keyframes gjHoch{from{transform:scaleY(0)}}
@keyframes gjAuf{from{opacity:0}}
/* Leistungsrad: Mitte wechselt, Punkte der Abschnitte blenden ein */
.rad-mitte.wechsel>*{animation:mitteein .5s cubic-bezier(.2,.75,.2,1) both}
@keyframes mitteein{from{transform:translateY(6px)}to{transform:none}}
.js .feld-sek .fs-punkte li{opacity:0;transform:translateX(18px);transition:opacity .6s,transform .7s cubic-bezier(.2,.75,.2,1),padding .35s,color .35s;transition-delay:calc(var(--k) * .07s),calc(var(--k) * .07s),0s,0s}
.js .feld-sek.sichtbar .fs-punkte li{opacity:1;transform:none}

/* =====================================================================
   6 REDUCED MOTION (einziger Ort mit erzwungenen Regeln)
   ===================================================================== */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js [data-reveal],.js .feld-sek .fs-punkte li{opacity:1!important;transform:none!important;filter:none!important}
  .js .ikone *{stroke-dasharray:none!important;stroke-dashoffset:0!important}
  .logo-kachel:hover,.fw-karte:hover,.leistung:hover{transform:none}
  /* Jahresband: Endzustände (ohne .js ohnehin, hier ausdrücklich) */
  .gj-vergangen,.gj-heute{transform:none!important}
  .gj-heute span,.gj-spur li.jetzt{opacity:1!important}
}

@media print{.site-header,.site-footer,.nav-toggle,.btn,.netz{display:none}main{padding-top:0}}

/* Newsletter-Anmeldung (Mautic-Anbindung, 20.10.2026) */
.newsletter-band{background:var(--flaeche);border-top:1px solid var(--linie)}
.newsletter-band-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--gap);align-items:start}
.newsletter-band h2{font-size:1.5rem;margin:.2rem 0 .6rem}
.newsletter-band p{color:var(--text-2);margin:0}
.formular-kompakt{max-width:none}
@media (max-width:820px){.newsletter-band-inner{grid-template-columns:1fr}}