/* v11 · Gestaltungsgrundlage (Claude, 05.10.2026)
   Liegt über style.css. Raster, Schriftstufen, Abstände und der neu gesetzte Startbereich.
   Grundsatz: wenige Grössen, klare Achsen, Ruhe um die eine Idee, die Leerstelle. */

:root{
  /* Satzspiegel: Inhalt höchstens 1600 px breit, Ränder wachsen auf breiten Bildschirmen mit */
  --rand:max(clamp(20px,4.6vw,72px),calc((100vw - 1600px)/2));
  /* Abstände in einer Reihe */
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;--s7:96px;--s8:128px;
  --abschnitt:clamp(88px,9vw,152px);
  /* Schriftstufen */
  --t-mega:clamp(56px,7.4vw,128px);
  --t-gross:clamp(44px,5.2vw,92px);
  --t-mittel:clamp(30px,2.9vw,48px);
  --t-lead:clamp(19px,1.45vw,23px);
  --t-text:clamp(16px,1.12vw,18px);
  --t-klein:14px;
  --t-label:12px;
  /* Flächen und Linien */
  --haar:color-mix(in srgb,var(--tinte) 16%,transparent);
  --haar-dunkel:color-mix(in srgb,var(--papier) 18%,transparent);
  --flaeche:color-mix(in srgb,var(--tinte) 4%,var(--papier));
  --rot-hauch:color-mix(in srgb,var(--rot) 13%,var(--papier));
  --ease:cubic-bezier(.2,.7,.1,1);
}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{font-size:var(--t-text);line-height:1.62;font-feature-settings:"kern","liga"}
h1,h2,h3{text-wrap:balance}
p,li,dd{text-wrap:pretty}

/* ---------- Kopfzeile ---------- */
.kopf{border-bottom:1px solid var(--haar)}
@media (min-width:601px){.kopf{height:72px;gap:var(--s5)}.kopf.kompakt{height:60px}}
.kopf__name{font-size:30px;letter-spacing:-.01em}
.kopf nav{gap:clamp(20px,2.4vw,40px);font-size:15px}
.kopf nav a{position:relative;padding-block:6px}
.kopf nav a:hover{text-decoration:none}
.kopf nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.kopf nav a:hover::after,.kopf nav a[aria-current]::after{transform:scaleX(1)}
.kopf .knopf--klein{padding:12px 20px;font-size:15px;gap:28px}

/* ---------- Startbereich: Plakat und Claim im ersten Bild ---------- */
.buehne{display:flex;flex-direction:column;min-height:calc(100svh - 72px)}
.umfeldzeile{padding:var(--s2) var(--rand) 0;min-height:56px;font-size:var(--t-label);letter-spacing:.08em;text-transform:uppercase}
.umfeldzeile>p{opacity:.7}
.umschalter{gap:4px;border:1px solid var(--haar);padding:3px;border-radius:999px;text-transform:none;letter-spacing:0}
.umschalter>span{display:none}
.umschalter button{border-radius:999px;padding:7px 16px;font-size:14px;min-height:36px;transition:background .3s var(--ease),color .3s var(--ease)}
.plakat{flex:1 1 0;height:auto;min-height:clamp(280px,44svh,560px);margin:var(--s3) var(--rand) var(--s4)}
.plakat__zeile{letter-spacing:-.012em;color:var(--tinte)}

/* Die Leerstelle ist sichtbar: ein warmer Hauch von Rot mit feiner Kontur. Offen wird sie ganz rot. */
.leerstelle__kontur{opacity:1;fill:var(--rot-hauch);stroke:color-mix(in srgb,var(--rot) 55%,transparent);stroke-width:1.2px;vector-effect:non-scaling-stroke;transition:fill .6s var(--ease),stroke .6s var(--ease)}
.leerstelle.offen .leerstelle__kontur,.leerstelle.benannt .leerstelle__kontur,.leerstelle.schreibt .leerstelle__kontur{fill:var(--rot);stroke:var(--rot)}
.hinweis{font-family:var(--display);font-weight:700;font-size:clamp(22px,1.9vw,32px);letter-spacing:-.005em;color:color-mix(in srgb,var(--rot) 80%,var(--tinte));padding:4px 0}
.hinweis__linie{display:none}
.leerstelle.offen .hinweis,.leerstelle.benannt .hinweis{color:inherit}
#leer-erklaerung{font-size:15px;line-height:1.45;max-width:22ch}
.benennen{font-size:14px;font-weight:600;color:color-mix(in srgb,var(--rot) 80%,var(--tinte));border-bottom-color:currentColor}
.leerstelle.offen .benennen,.leerstelle.benannt .benennen{color:inherit}

/* Band mit Claim: gehört zum ersten Bild. Claim über die ganze Breite, darunter Person und die drei Standbeine. */
.band{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);padding:clamp(28px,3vw,48px) var(--rand) clamp(24px,2.4vw,36px)}
.band__gedanke{grid-column:1/-1;font-size:var(--t-klein);letter-spacing:.02em;margin-bottom:var(--s3);opacity:.85}
.band__zeile{display:contents}
.band h1{grid-column:1/-1;font-size:clamp(48px,5.7vw,108px);line-height:.9;letter-spacing:-.022em}
.band h1 span:last-child{color:var(--rot)}
.band__person{grid-column:1/span 4;grid-row:3;max-width:none;margin-top:clamp(28px,3vw,44px);padding-top:var(--s3);border-top:1px solid var(--haar-dunkel);align-self:stretch}
.band__person p{font-size:15px;line-height:1.6;max-width:34ch}
.band__person strong{font-size:19px;display:inline-block;margin-bottom:4px}
.band__person .textlink{margin-top:var(--s2)}
.standbeine{grid-column:5/-1;grid-row:3;margin-top:clamp(28px,3vw,44px);border-top:1px solid var(--haar-dunkel);grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3)}
.standbeine a{min-height:76px;padding:var(--s3) 0 0;align-items:start;font:600 clamp(20px,1.75vw,30px)/1.1 var(--display);transition:color .3s var(--ease)}
.standbeine a>span:last-child{font-size:20px;transition:transform .35s var(--ease)}
.standbeine a:hover{color:var(--rot)}
.standbeine a:hover span:first-child{text-decoration:none}
.standbeine a:hover>span:last-child{transform:translate(3px,-3px)}

@media (max-width:1000px){
  .kopf nav{font-size:13px}
  .band h1{font-size:clamp(44px,9vw,72px)}
}
@media (max-width:600px){
  .umfeldzeile{padding:var(--s2) 16px 0}
  .umschalter{width:100%;justify-content:space-between}
  .umschalter button{flex:1;padding:7px 8px;font-size:13px}
  .plakat{min-height:clamp(320px,52svh,460px);margin:var(--s2) 16px var(--s3)}
  .band{display:block;padding:28px 20px 30px}
  .band h1{font-size:clamp(42px,12vw,56px)}
  .standbeine{grid-template-columns:1fr;gap:0}
  .standbeine a{min-height:60px;padding:14px 0;align-items:center;font-size:24px}
  .band__person p{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.kopf nav a::after,.leerstelle__kontur{transition:none}}

/* ---------- Bilder: Menschen in ruhigen Rechtecken, Material in der Leerstellen-Form ---------- */
.bildmarke{position:absolute;left:14px;bottom:14px;z-index:3;padding:5px 11px;font-size:11px;letter-spacing:.03em;line-height:1.3;color:var(--tinte);background:color-mix(in srgb,var(--papier) 84%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:999px;pointer-events:none}
.aktion{padding-top:clamp(40px,4vw,64px)}
.aktionsbild__zeichnung--foto{padding:0;background:none;border-radius:3px;overflow:hidden}
.aktionsbild__foto{display:block;width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;object-position:50% 40%}
.aktionsbild figcaption{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);padding:var(--s3) 0 0;font-size:var(--t-klein)}
.aktionsbild figcaption>span{grid-column:1/span 4;font-size:var(--t-label)}
.aktionsbild figcaption p{grid-column:5/-1;font:600 clamp(20px,1.7vw,28px)/1.2 var(--display);letter-spacing:-.005em}
.portrait--foto{position:relative;overflow:hidden;border-radius:3px}
.portrait__foto{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%}
.film{border:0;border-radius:3px;background:var(--tinte)}
.film__szene--foto{opacity:1;object-fit:cover;filter:saturate(.92)}
.film::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(20,18,15,0) 45%,rgba(20,18,15,.5))}
.film__play,.film__zeit{z-index:2}
.film__zeit{color:var(--papier)}
.begleitung__bild{position:relative;max-width:none}
.begleitung__bild img{display:block;aspect-ratio:4/3;object-fit:cover;border-radius:3px}
@media (max-width:600px){.aktionsbild__foto{aspect-ratio:4/3}.aktionsbild figcaption>span,.aktionsbild figcaption p{grid-column:1/-1}.aktionsbild figcaption p{margin-top:8px}}

/* =====================================================================
   Systemdurchgang über alle Abschnitte
   Rot nur für das «Etwas»: Leerstelle, «besprechbar.», Hauptangebot, Film, Hover.
   ===================================================================== */
.paletten{display:none}
.abschnitt{padding:var(--abschnitt) var(--rand)}
.kapitel{font-size:var(--t-label);letter-spacing:.1em;padding-top:var(--s2);border-top:1px solid var(--haar);margin-bottom:clamp(40px,4.6vw,72px)}
.kapitel span:last-child{opacity:.6}
.dunkel .kapitel{border-top-color:var(--haar-dunkel);color:inherit}
h2{font-size:var(--t-gross);line-height:.95;letter-spacing:-.02em;max-width:16ch}
.klein{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.dunkel .klein{color:inherit}

/* Knöpfe und Links: eine Hauptaktion, ein Linkstil */
.knopf{gap:28px;padding:16px 24px;border:0;font-size:15px;transition:background .3s var(--ease),color .3s var(--ease)}
.knopf:hover{background:var(--rot);color:var(--tinte)}
.textlink,.angebot__links a,.begleitung__link,.vita__mehr a,.mail{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:3px;transition:color .3s var(--ease),border-color .3s var(--ease)}
.textlink:hover,.angebot__links a:hover,.begleitung__link:hover,.vita__mehr a:hover,.mail:hover{color:var(--rot)}
.angebot__links a,.begleitung__link{min-height:0}

/* Belegzeile: sechs Belege in einem ruhigen Raster */
.belegzeile{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--s3);row-gap:0;padding:0;margin-top:var(--s5);border-top:1px solid var(--haar);border-bottom:0}
.belegzeile a{justify-content:space-between;min-height:60px;font-size:15px;border-bottom:1px solid var(--haar)}
.belegzeile a span{color:inherit;opacity:.5;transition:opacity .3s,transform .35s var(--ease)}
.belegzeile a:hover{text-decoration:none;color:var(--rot)}
.belegzeile a:hover span{opacity:1;transform:translate(2px,-2px)}

/* 01 Erkennen */
.erkennen__raster{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3)}
.erkennen__titel{grid-column:1/span 5}
.erkennen__raster>div:last-child{grid-column:7/-1}
.tinte-hinweis{font-size:var(--t-klein);opacity:.7;margin-top:var(--s3)}
.anzeichen li{font-size:var(--t-lead);line-height:1.4;border-top:1px solid var(--haar);padding-top:var(--s3)}
.anzeichen li:first-child{border-top:1px solid var(--haar);padding-top:var(--s3)}
.anzeichen__knopf:after{color:inherit;opacity:.5;font-weight:300;font-size:24px;top:2px}
.beleg{border-left:2px solid var(--tinte);margin-top:var(--s5)}
.beleg p{font-size:15px}
.beleg a{font-size:var(--t-klein)}

/* 02 Verstehen: kompakter, klare Achsen */
.arbeitsweise>h2{max-width:18ch}
.bewegung{margin-top:clamp(48px,5vw,80px)}
.arbeit--eins{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);align-items:center}
.arbeit--eins .arbeit__bilder{grid-column:1/span 6;height:auto;display:grid;grid-template-columns:1.25fr 1fr;gap:var(--s3);align-items:end}
.arbeit--eins .arbeit__text{grid-column:8/-1}
.foto,.foto--karten,.foto--modell{position:static;width:auto}
.foto img,.foto--modell img{height:auto;aspect-ratio:1;border:0;object-fit:cover}
.foto figcaption,.foto--modell figcaption{padding:var(--s2) 0 0;text-align:left;font-size:13px;opacity:.75}
.arbeit__text h3{font-size:var(--t-mittel);line-height:1.02}
.arbeit__text>p:last-child,.arbeit__schluss>p:not(.haltung){font-size:var(--t-text);line-height:1.65;opacity:.88}
.arbeit--zwei{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);margin:clamp(64px,6vw,104px) 0;padding-top:clamp(48px,5vw,80px);border-top:1px solid var(--haar-dunkel)}
.arbeit--zwei .arbeit__text{grid-column:1/span 5}
.arbeit--zwei .kartengeste{grid-column:7/-1}
.arbeit--drei{padding-top:clamp(48px,5vw,80px);border-top:1px solid var(--haar-dunkel)}
.arbeit--drei h3{font-size:var(--t-gross);line-height:.95;letter-spacing:-.02em}
.arbeit__schluss{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3)}
.arbeit__schluss>p:not(.haltung){grid-column:1/span 5}
.arbeit__schluss .haltung{grid-column:8/-1;color:inherit}
.kartenform{min-height:320px}
.kartenknopf{border-radius:0;font-size:15px}
.kartenknopf:hover{background:var(--papier);color:var(--tinte)}

/* 03 Vertrauen */
.simonraster{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);align-items:start}
.portrait{grid-column:1/span 5;width:auto;margin:0}
.simontext{grid-column:7/-1}
.simontext h2{margin-bottom:var(--s4)}
.simontext>p{font-size:var(--t-text);line-height:1.65;max-width:58ch}
.vita{font-size:15px;line-height:1.5;border-top:1px solid var(--haar);padding:0;margin:var(--s4) 0 var(--s3)}
.vita li{padding:12px 0;border-bottom:1px solid var(--haar)}
.vita__mehr{margin:0 0 var(--s4);font-size:15px}
.belegleiste{grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--s3);margin-top:clamp(64px,6vw,104px);padding:var(--s3) 0;border-block:1px solid var(--haar)}
.belegleiste>p{grid-column:1/span 3;font-size:var(--t-label);letter-spacing:.1em;opacity:.7}
.belegleiste a{grid-column:span 3;font-size:16px}
.belegleiste small{font-size:13px;opacity:.75}
.filmplatz{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);margin-top:clamp(64px,6vw,104px);padding-top:0;border-top:0}
.filmplatz__kopf{grid-column:1/span 4}
.filmplatz>div:last-child{grid-column:5/-1}
.filmplatz__kopf h3{font-size:var(--t-mittel);line-height:1.02}
.filmplatz__kopf>p:last-child{font-size:var(--t-text)}
.film__beschreibung{font-size:13px;opacity:.7}
.stimmen{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);margin-top:clamp(64px,6vw,104px)}
.stimmen>.stimme--echt{grid-column:span 6;padding:var(--s3) 0 var(--s5);border-top:1px solid var(--tinte)}
.stimmen>.stimme--gross{grid-column:1/-1;padding-bottom:var(--s6)}
.stimmen p{font-weight:500;font-size:clamp(24px,2vw,32px);line-height:1.18;margin:var(--s2) 0 var(--s3);hanging-punctuation:first}
.stimme--gross p{font-size:clamp(32px,3.4vw,56px);line-height:1.08;max-width:30ch}
.stimmen small{font-size:14px;font-weight:600}
.stimmen .platzhalter{font-size:var(--t-label);letter-spacing:.1em;opacity:.65}

/* 04 Entscheiden */
.angebote__kopf{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);margin-bottom:var(--s6)}
.angebote__kopf h2{grid-column:1/span 7}
.angebote__kopf>p{grid-column:8/-1;font-size:var(--t-text);line-height:1.65}
.angebot{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3);padding:var(--s5) 0;border-top:1px solid var(--haar)}
.angebot>.angebot__nr{grid-column:1}
.angebot>div:nth-child(2){grid-column:2/span 5}
.angebot__details{grid-column:8/-1}
.angebot__nr{border:1px solid currentColor;width:44px;height:40px;font-size:18px}
.angebot__art{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.angebot h3{font-size:var(--t-mittel);line-height:1.02;letter-spacing:-.01em}
.angebot__links{font-size:15px;gap:var(--s2) var(--s4);margin-top:var(--s4)}
.angebot__details,.angebot details,.angebot__umfang button{font-size:16px;line-height:1.6}
.angebot__details dl>div{grid-template-columns:110px 1fr;gap:var(--s2);padding:10px 0;border-top:1px solid var(--haar);margin:0}
.angebot__details dt{font-size:var(--t-label);letter-spacing:.08em;text-transform:uppercase;opacity:.7;padding-top:3px}
.danach{border-left:2px solid currentColor;padding-left:var(--s3);margin-top:var(--s4)}
.danach strong,.angebot__umfang>strong{font-size:var(--t-label);letter-spacing:.08em;text-transform:uppercase}
.angebot--programm{padding:clamp(36px,4vw,64px) clamp(24px,3vw,48px);margin:0 0 var(--s4);border-radius:3px}
.angebot--programm h3{font-size:var(--t-gross);line-height:.95}
.angebot--programm .angebot__details dl>div{border-top-color:color-mix(in srgb,currentColor 25%,transparent)}
.angebot--programm .angebot__art,.angebot--programm .angebot__details dt{opacity:.85}
.angebote__hinweis{font-size:15px;margin:var(--s4) 0 var(--s6);opacity:.8}
.ablauf{border-top:1px solid var(--haar);padding-top:var(--s6)}
.ablauf>h3{font-size:var(--t-mittel);line-height:1.02;max-width:20ch}
.ablauf li>span{border-color:var(--tinte);border-radius:999px;width:40px;height:40px;font-size:13px}
.ablauf.gezeichnet li>span{background:var(--tinte);color:var(--papier)}
.ablauf li:not(:last-child):before{background:var(--tinte);opacity:.25;top:20px}
.ablauf h4{font-size:17px}
.ablauf li p{font-size:15px;max-width:30ch}

/* 05 Einzelberatung */
.begleitung{border-top:0}
.begleitung__raster{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3)}
.begleitung__kopf{grid-column:1/span 6}
.begleitung__text{grid-column:8/-1;font-size:var(--t-text);line-height:1.65;padding-top:0}
.begleitung__text>p:first-child{font-size:var(--t-lead);line-height:1.5}
.begleitung dl>div{grid-template-columns:110px 1fr;padding:10px 0;border-top:1px solid var(--haar);margin:0}
.begleitung dt,.begleitung__danach strong{font-size:var(--t-label);letter-spacing:.08em;text-transform:uppercase;opacity:.75}
.begleitung__danach{border-left:2px solid var(--tinte)}
.begleitung__hinweis{font-size:15px;opacity:.8}
.begleitung__link{display:inline-flex;gap:28px;padding:16px 24px;border:0;background:var(--tinte);color:var(--papier);font-size:15px;margin-top:var(--s4)}
.begleitung__link:hover{background:var(--rot);color:var(--tinte)}

/* 06 Anfragen */
.anfrageraster{grid-template-columns:repeat(12,minmax(0,1fr));gap:0 var(--s3)}
.anfrageraster>div:first-child{grid-column:1/span 5}
.anfrageraster>form{grid-column:7/-1}
.anfrageraster h2{font-size:var(--t-gross)}
.anfrageraster>div>p{font-size:var(--t-text)}
.mail{font-size:clamp(20px,1.6vw,26px);color:inherit;border-bottom-color:var(--haar-dunkel)}
.formular__hinweis{color:inherit;opacity:.7;border-bottom-color:var(--haar-dunkel)}
.formular label{font-size:var(--t-label);letter-spacing:.08em;text-transform:uppercase}
.formular input,.formular select,.formular textarea{font-size:18px;letter-spacing:0;text-transform:none;border-bottom-color:color-mix(in srgb,var(--papier) 45%,transparent);transition:border-color .3s var(--ease)}
.formular input:focus,.formular select:focus,.formular textarea:focus{outline:0;border-bottom-color:var(--rot)}
.formular .knopf{background:var(--papier);color:var(--tinte)}
.formular .knopf:hover{background:var(--rot)}

@media (max-width:900px){
  .erkennen__titel,.erkennen__raster>div:last-child,.arbeit--eins .arbeit__bilder,.arbeit--eins .arbeit__text,
  .arbeit--zwei .arbeit__text,.arbeit--zwei .kartengeste,.arbeit__schluss>p:not(.haltung),.arbeit__schluss .haltung,
  .portrait,.simontext,.filmplatz__kopf,.filmplatz>div:last-child,.angebotsliste .angebot>div:nth-child(2),.angebot__details,
  .angebote__kopf h2,.angebote__kopf>p,.begleitung__kopf,.begleitung__text,.anfrageraster>div:first-child,.anfrageraster>form,.belegleiste>p,.belegleiste a{grid-column:1/-1}
  .stimmen>.stimme--echt{grid-column:1/-1}
  .angebot>.angebot__nr{grid-column:1/-1;margin-bottom:var(--s2)}
  .belegzeile{grid-template-columns:1fr}
  .arbeit--eins .arbeit__text,.arbeit--zwei .kartengeste,.simontext,.angebot__details,.begleitung__text,.anfrageraster>form,.filmplatz>div:last-child,.arbeit__schluss .haltung{margin-top:var(--s5)}
  .portrait{max-width:520px}
}

/* Feinschliff nach dem ersten Durchgang */
.arbeitsweise>h2{max-width:22ch}
.stimme--gross p{max-width:44ch}
.angebot--programm .programmform{display:none}

/* Fusszeile: Spalten, grosser Name, ruhige Rechtszeile */
.fuss--v11{display:block;padding:clamp(64px,7vw,112px) var(--rand) var(--s4);background:var(--papier);border-top:1px solid var(--haar)}
.fuss__spalten{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--s5) var(--s3)}
.fuss__spalten>div{grid-column:span 2;display:flex;flex-direction:column;gap:10px;font-size:15px}
.fuss__spalten>div:first-child{grid-column:span 3}
.fuss__spalten>.fuss__satz{grid-column:9/-1;align-items:flex-start;gap:var(--s3)}
.fuss__satz p{font:600 clamp(24px,2.2vw,34px)/1.1 var(--display);letter-spacing:-.005em;max-width:16ch}
.fuss--v11 .fuss__titel{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.6;margin-bottom:6px}
.fuss--v11 .fuss__spalten a:not(.knopf){text-decoration:none;width:fit-content;border-bottom:1px solid transparent;transition:border-color .3s var(--ease),color .3s var(--ease)}
.fuss--v11 .fuss__spalten a:not(.knopf):hover{color:var(--rot);border-bottom-color:currentColor}
.fuss--v11 .fuss__spalten p{font-size:15px;opacity:.8}
.fuss__name{display:block;margin-top:clamp(56px,6vw,96px);font:800 clamp(72px,16.5vw,300px)/.8 var(--display);letter-spacing:-.03em;text-decoration:none;white-space:nowrap}
.fuss__name span{color:var(--rot)}
.fuss__unten{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s2) var(--s5);margin-top:var(--s4);padding-top:var(--s2);border-top:1px solid var(--haar)}
.fuss--v11 small{flex-basis:auto;margin:0;font-size:12px;opacity:.7}
@media (max-width:900px){
  .fuss__spalten>div,.fuss__spalten>div:first-child{grid-column:span 6}
  .fuss__spalten>.fuss__satz{grid-column:1/-1}
}
@media (max-width:600px){.fuss__spalten>div,.fuss__spalten>div:first-child{grid-column:1/-1}}
.fuss--v11>a.fuss__name{font:800 clamp(72px,16.5vw,300px)/.8 var(--display);letter-spacing:-.03em}
.fuss--v11 .fuss__satz p{font:600 clamp(24px,2.2vw,34px)/1.1 var(--display);opacity:1}
.fuss--v11>a.fuss__name{font-size:min(22.6vw,410px);line-height:.86;padding-bottom:.06em}
.fuss__unten{margin-top:var(--s3)}

/* ---------- Bewegung (js/v11.js), nur ohne reduzierte Bewegung ---------- */
html{scroll-behavior:smooth}
section[id],article[id],div[id]{scroll-margin-top:84px}
.kopf{transition:background .4s var(--ease),height .24s,padding .24s}
.kopf.v11-gescrollt{background:color-mix(in srgb,var(--grund) 86%,transparent);-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2)}
.v11-bewegung .v11-bild{overflow:hidden;clip-path:inset(7% 0 7% 0 round 3px);transition:clip-path 1.3s var(--ease)}
.v11-bewegung .v11-bild img{transform:scale(1.08);transition:transform 1.6s var(--ease)}
.v11-bewegung .v11-bild.da{clip-path:inset(0 0 0 0 round 3px)}
.v11-bewegung .v11-bild.da img{transform:none}
.v11-bewegung .film.v11-bild.da:hover img{transform:scale(1.025);transition-duration:.8s}
.v11-bewegung .v11-linie{position:relative;border-top-color:transparent}
.v11-bewegung .v11-linie::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:currentColor;opacity:.18;transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease)}
.v11-bewegung .v11-linie.da::before{transform:none}
.v11-bewegung .v11-auf{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease) var(--v11-verz,0ms),transform .9s var(--ease) var(--v11-verz,0ms)}
.v11-bewegung .v11-auf.da{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@media (min-width:901px){.erkennen__titel{position:sticky;top:112px;align-self:start}}
/* Programm: die Pilotzahl als ruhiger Anker in der linken Spalte */
.angebot__pilot{display:flex;align-items:flex-end;gap:var(--s3);margin-top:clamp(40px,5vw,80px);padding-top:var(--s3);border-top:1px solid color-mix(in srgb,currentColor 30%,transparent);font-size:16px;line-height:1.4;max-width:30ch}
.angebot__pilot span{font:800 clamp(88px,9vw,148px)/.78 var(--display);letter-spacing:-.03em}

/* ---------- Runde 11b: das «Etwas» als warmer Schein statt Sprechblase ---------- */
.leerstelle__kontur{fill:color-mix(in srgb,var(--rot) 26%,transparent);stroke:none;filter:blur(22px);transition:fill .7s var(--ease),filter .7s var(--ease)}
.leerstelle.offen .leerstelle__kontur,.leerstelle.benannt .leerstelle__kontur,.leerstelle.schreibt .leerstelle__kontur{fill:var(--rot);stroke:none;filter:blur(6px)}
.hinweis{color:color-mix(in srgb,var(--rot) 72%,var(--tinte))}
.benennen{color:var(--tinte);border-bottom-color:color-mix(in srgb,var(--tinte) 40%,transparent)}
.leerstelle.offen .benennen,.leerstelle.benannt .benennen{border-bottom-color:currentColor}
/* Rückkehr der Form im Anfrageteil: derselbe Schein auf Dunkel */
.rueckkehr svg{fill:color-mix(in srgb,var(--rot) 55%,transparent);filter:blur(26px)}
.rueckkehr>span{color:var(--papier)}
/* Karten ziehen: keine helle Blase, die Karten liegen direkt auf dem dunklen Grund */
.kartenform{background:transparent;min-height:300px}
.kartenruecken{box-shadow:0 10px 24px rgba(0,0,0,.35)}
.kartenprogramm{display:flex;flex-direction:column;align-items:center;gap:var(--s3);margin-top:var(--s4)}
.knopf--hell{background:var(--papier);color:var(--tinte)}
.knopf--hell:hover{background:var(--rot);color:var(--tinte)}
/* Umfeld-Abschnitt ohne Resilienz-Satz: Text läuft breiter */
.arbeit__schluss>p:not(.haltung){grid-column:1/span 7}
/* Band: Person ohne zweiten Anfrage-Link */
.band__person p{margin:0}
/* Programm: «Pilotschule werden» statt nackter Zahl */
.angebot__pilot{display:block;max-width:34ch}
.angebot__pilot p{margin:0}
.angebot__pilot .angebot__pilot-titel{font:600 clamp(30px,2.8vw,44px)/1.02 var(--display);letter-spacing:-.01em;margin-bottom:var(--s2)}
.angebot__pilot p:not([class]){font-size:17px;line-height:1.55}
.angebot__pilot .angebot__pilot-fakt{margin-top:var(--s3);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;font-weight:600}
/* Umfeld: Titel links, Text rechts unten */
.arbeit--drei{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3)}
.arbeit--drei>.klein{grid-column:1/-1}
.arbeit--drei>h3{grid-column:1/span 7}
.arbeit--drei>.arbeit__schluss{grid-column:8/-1;align-self:end;display:block;margin:0}
.arbeit--drei .arbeit__schluss>p{max-width:none}
.rueckkehr svg{fill:color-mix(in srgb,var(--rot) 78%,transparent)}
@media (max-width:900px){.arbeit--drei>h3,.arbeit--drei>.arbeit__schluss{grid-column:1/-1}.arbeit--drei>.arbeit__schluss{margin-top:var(--s3)}}

/* Standbeine ohne Pfeil: die Titelschrift gilt für den ganzen Link */
.standbeine a>span:last-child{font:inherit}

/* ---------- «Sichtbar machen»: zwei Rechtecke wie im Magazin, Methoden als Liste ---------- */
.arbeit--eins{align-items:start}
.arbeit--eins .arbeit__bilder{grid-column:1/span 6;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:start;gap:0}
.arbeit--eins .foto--karten{grid-column:1/span 4;grid-row:1}
.arbeit--eins .foto--modell{grid-column:4/span 3;grid-row:1;margin-top:clamp(120px,16vw,300px);z-index:2}
.arbeit--eins .foto img{border-radius:3px;border:0}
.arbeit--eins .foto--karten img{aspect-ratio:4/5;object-position:50% 50%}
.arbeit--eins .foto--modell img{aspect-ratio:1;object-position:40% 50%;box-shadow:0 0 0 clamp(8px,.8vw,12px) var(--dunkel)}
.arbeit--eins .foto figcaption{display:flex;gap:12px;align-items:baseline;padding-top:14px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.arbeit--eins .foto--modell figcaption{padding-left:clamp(8px,.8vw,12px)}
.arbeit--eins .foto figcaption span{opacity:.55}
.arbeit--eins .arbeit__text{grid-column:8/-1;padding-top:clamp(24px,4vw,72px)}
.arbeit--eins .arbeit__text>p:not(.klein){font-size:var(--t-lead);line-height:1.5;opacity:.92}
.methoden{list-style:none;margin:var(--s5) 0 0;padding:0;border-top:1px solid var(--haar-dunkel)}
.methoden li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:var(--s3);align-items:baseline;padding:16px 0;border-bottom:1px solid var(--haar-dunkel)}
.methoden strong{font:600 clamp(20px,1.55vw,26px)/1.1 var(--display);letter-spacing:-.005em}
.methoden span{font-size:15px;line-height:1.45;opacity:.72}
@media (max-width:900px){
  .arbeit--eins .arbeit__bilder,.arbeit--eins .arbeit__text{grid-column:1/-1}
  .arbeit--eins .foto--karten{grid-column:1/span 5}
  .arbeit--eins .foto--modell{grid-column:3/span 4;margin-top:55%}
}
@media (max-width:600px){.methoden li{grid-template-columns:1fr;gap:4px}}
@media (max-width:600px){
  .arbeit--eins .arbeit__bilder{grid-template-columns:1fr;row-gap:var(--s3)}
  .arbeit--eins .foto--karten{grid-column:1;grid-row:1}
  .arbeit--eins .foto--karten img{aspect-ratio:4/3}
  .arbeit--eins .foto--modell{grid-column:1;grid-row:2;width:78%;justify-self:end;margin-top:0}
  .arbeit--eins .foto--modell img{box-shadow:none}
  .arbeit--eins .foto--modell figcaption{padding-left:0}
}

/* Fragekarte: Papierkarte im Format der Tierkarten, die Frage in der Titelschrift */
.fragekarte{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:18px 18px 22px;border-radius:9px;background:var(--papier);color:var(--tinte);box-shadow:0 14px 30px rgba(0,0,0,.4);transform:rotate(-3deg);text-align:left}
.fragekarte__label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;opacity:.6}
.fragekarte__label::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--rot);margin-right:8px;vertical-align:1px}
.fragekarte__text{margin:0;font:600 clamp(21px,1.75vw,26px)/1.12 var(--display);letter-spacing:-.005em;text-wrap:balance}
.kartengeste[data-modus=fragen] .kartenstapel{width:230px}
@media (max-width:600px){.kartengeste[data-modus=fragen] .kartenstapel{width:200px}.fragekarte__text{font-size:20px}}
.fragekarte__text{font-size:clamp(24px,2.05vw,31px);line-height:1.08}
@media (max-width:600px){.fragekarte__text{font-size:23px}}

/* =====================================================================
   Markenzeichen: eine einzige rote Form (assets/form.svg, gleiche Formel wie die Leerstelle)
   Sie steht im Kopfbereich, als Punkt hinter «Simon Frey», in jedem Knopf, bei den Nummern,
   auf dem Filmknopf, am Schluss der Anfrage und als Seitensymbol.
   ===================================================================== */
:root{--zeichen:url(../assets/zeichen.svg)}
/* Grundzustand der Leerstelle: die Form, kräftig rot, klare Kante */
.leerstelle__kontur{fill:var(--rot);stroke:none;filter:none}
.hinweis{color:var(--tinte)}
.benennen{color:var(--tinte);border-bottom-color:currentColor}
.leerstelle.offen .leerstelle__kontur,.leerstelle.benannt .leerstelle__kontur,.leerstelle.schreibt .leerstelle__kontur{fill:color-mix(in srgb,var(--rot) 90%,var(--tinte));filter:none}
/* Logo- und Namenspunkt */
.kopf__name span,.fuss__name span{display:inline-block;width:.3em;height:.215em;margin-left:.05em;color:transparent;overflow:hidden;vertical-align:0;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
/* Knöpfe: die Form statt Pfeil, beim Überfahren dreht sie sich leicht */
.knopf span[aria-hidden=true],.begleitung__link span[aria-hidden=true]{display:inline-block;flex:none;width:15px;height:11px;font-size:0;color:transparent;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transition:transform .45s var(--ease),background .3s var(--ease)}
.knopf:hover span[aria-hidden=true],.begleitung__link:hover span[aria-hidden=true]{background:var(--tinte);transform:scale(1.3) rotate(-10deg)}
/* Nummern sitzen in der Form */
.angebot__nr{width:54px;height:39px;border:0;border-radius:0;background:var(--tinte);color:var(--papier);font-size:17px;-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.angebot--programm .angebot__nr{background:var(--tinte);color:var(--rot)}
.ablauf li>span{width:50px;height:36px;border:0;border-radius:0;-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.ablauf li:not(:last-child):before{top:18px}
/* Schluss der Anfrage: dieselbe Form wie oben */
.rueckkehr svg{fill:var(--rot);filter:none}
.rueckkehr>span{color:var(--tinte)}
/* Kleine Marken: Fragekarte */
.fragekarte__label::before{width:12px;height:9px;border-radius:0;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.kopf__name span,.fuss__name span{width:.25em;height:.18em;margin-left:.04em}

/* =====================================================================
   Spiel mit der Form. Das Zeichen bleibt an den Markenstellen exakt gleich
   (Logopunkt, Knöpfe, Seitensymbol, Leerstelle, Nummern). Hier darf die Form sich bewegen:
   gedreht, angeschnitten, als Umriss, Ton in Ton, mehrfach. Jede Stelle sagt etwas.
   ===================================================================== */

/* Systemisch hinschauen: Mensch, Zusammenarbeit und Rahmenbedingungen überlagern sich */
.arbeit--drei>h3{grid-row:2}
.arbeit--drei>.system{grid-column:8/-1;grid-row:2/span 2;margin:0;align-self:center}
.arbeit--drei>.arbeit__schluss{grid-column:1/span 6;grid-row:3;align-self:start;margin-top:var(--s4)}
.system svg{display:block;width:100%;height:auto;overflow:visible}
.system use{fill:none;stroke:var(--papier);stroke-width:1.3px;vector-effect:non-scaling-stroke;opacity:.85}
.system text{fill:var(--papier);font:600 21px/1 var(--display);letter-spacing:.01em;text-anchor:middle;opacity:.85}
.system .system__kern use{fill:var(--rot);stroke:none;opacity:1}
.system__teil{transition:transform 1.6s var(--ease)}
.v11-bewegung .system:not(.da) .system__teil--1{transform:translate(-46px,-26px)}
.v11-bewegung .system:not(.da) .system__teil--2{transform:translate(46px,-26px)}
.v11-bewegung .system:not(.da) .system__teil--3{transform:translate(0,40px)}
.system__kern{transition:opacity .8s var(--ease) .9s}
.v11-bewegung .system:not(.da) .system__kern{opacity:0}

/* Einzelberatung: zwei Formen, einander gegenüber */
.gegenueber{display:block;width:clamp(110px,9vw,150px);height:auto;margin-bottom:var(--s4);overflow:visible}
.gegenueber__a{fill:var(--rot)}
.gegenueber__b{fill:none;stroke:var(--tinte);stroke-width:1.4px;vector-effect:non-scaling-stroke}
.gegenueber__ga{transition:transform 1.2s var(--ease)}
.v11-bewegung .gegenueber:not(.da) .gegenueber__ga{transform:translate(-22px,4px)}

/* Programm: grosse Form Ton in Ton, angeschnitten */
.angebot--programm{position:relative;overflow:hidden;isolation:isolate}
.angebot--programm::after{content:"";position:absolute;z-index:-1;width:min(52vw,760px);aspect-ratio:1.4;left:-9%;bottom:-30%;background:color-mix(in srgb,var(--rot) 78%,var(--tinte));opacity:.32;-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transform:rotate(-16deg);pointer-events:none}

/* Erkennen: ein warmer Hauch der Form hinter dem Titel */
.erkennen__titel{isolation:isolate}
.erkennen__titel::before{content:"";position:absolute;z-index:-1;width:clamp(240px,25vw,420px);aspect-ratio:1.4;left:-7%;top:-18%;background:var(--rot-hauch);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transform:rotate(10deg)}

/* Karten ziehen: die Form als dunkler Tisch unter dem Stapel */
.kartenform{position:relative;isolation:isolate}
.kartenform::before{content:"";position:absolute;z-index:-1;inset:4% -4%;background:color-mix(in srgb,var(--papier) 7%,var(--dunkel));-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transform:rotate(-7deg)}

/* Grosse Stimme: die Form als Zitatzeichen */
.stimme--gross blockquote::before{content:"";display:block;width:62px;height:44px;margin:0 0 var(--s3);background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transform:rotate(-9deg)}

@media (max-width:900px){
  .arbeit--drei>.system,.arbeit--drei>.arbeit__schluss{grid-column:1/-1}
  .arbeit--drei>.system{grid-row:3;max-width:460px;margin-top:var(--s4)}
  .arbeit--drei>.arbeit__schluss{grid-row:4}
  .angebot--programm::after{width:110%;bottom:-12%}
}
@media (prefers-reduced-motion:reduce){.system__teil,.gegenueber__ga,.system__kern{transition:none}}

/* Leerstelle darf auf dem Handy über den Rand laufen, ohne seitliches Scrollen */
.buehne{overflow-x:clip}

/* =====================================================================
   Formsprache nach dem Zeichen «Widerhalt» (06.10.2026)
   Regel: Zeichen = exakt die Form (Maske --zeichen). Fotos = ruhige Rechtecke mit 3 px.
   Bedienelemente = gerade Kanten oder Pille. Keine weiteren Klecksformen.
   ===================================================================== */
/* Marken: exakt das Zeichen */
.angebot__nr,.ablauf li>span,.play,.wortflug{border:0;border-radius:0;-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.play{width:62px;height:45px;background:var(--rot);color:var(--tinte);font-size:15px}
.hoerknopf:hover .play{background:var(--tinte);color:var(--papier)}
.wortflug{width:150px;height:110px}
.programm__punkt{flex:0 0 13px;height:10px;border:0;border-radius:0;background:currentColor;opacity:.35;-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transition:opacity .3s var(--ease)}
.angebot__umfang button[aria-pressed=true] .programm__punkt{opacity:1}
/* Fotos: Rechtecke */
.foto img,.begleitung__bild img,.angebot__bild,.us-faecher__ersatz{border-radius:3px}
/* Kleinteile */
.kartenruecken:after{border-radius:5px}
.form-echo{border-radius:3px}

/* ---------- Abschluss-Details (Zeichen «Widerhalt») ---------- */
/* «Erkennen»: kein Hauch hinter dem Titel, der Titel steht frei */
.erkennen__titel::before{content:none}
/* Kapitelzeilen beginnen mit dem Zeichen */
.kapitel span:first-child{display:inline-flex;align-items:center;gap:10px}
.kapitel span:first-child::before{content:"";flex:none;width:12px;height:9px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
/* Gegenüber: Umriss deutlicher */
.gegenueber__b{stroke-width:1.8px;stroke:var(--tinte)}
/* Auswahl und Fokus */
::selection{background:var(--rot);color:var(--tinte)}
:focus-visible{outline:2px solid var(--rot);outline-offset:4px}
.dunkel :focus-visible{outline-color:var(--rot)}
.knopf:focus-visible{outline-offset:3px}
/* Film auf dem Handy: Titel und Text untereinander */
@media (max-width:900px){.filmplatz__kopf{display:block}.filmplatz__kopf>p:last-child{margin-top:var(--s2)}}

/* ---------- Astras Abschluss-Audit (06.10.2026) ---------- */
/* 1 · Benennen auf dem Handy: keine grosse Vorschau, sichtbarer Übernehmen-Knopf */
.wortfrage button[type=submit]{min-width:44px;min-height:44px;font-size:18px;background:var(--tinte);color:var(--papier)}
@media (max-width:600px){.wortvorschau{display:none}}
/* 3 · Logopunkt auf der Grundlinie und gross genug, um das Zeichen zu erkennen */
.kopf .kopf__name{display:inline-block;min-height:0;line-height:1;padding:7px 0}
.kopf__name span{width:.33em;height:.245em;margin-left:.05em;vertical-align:0}
.zeichenpunkt{display:inline-block;width:.27em;height:.2em;margin-left:.04em;vertical-align:0;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
/* 5 · Liste im Programm */
.angebot__umfang li{display:flex;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid color-mix(in srgb,currentColor 25%,transparent);font-size:16px;line-height:1.45}
.angebot__umfang .programm__punkt{opacity:1}
/* 12 · Keine zusätzliche Zitatform neben den Guillemets */
.stimme--gross blockquote::before{content:none}
/* 13 · Standbeine: beim Überfahren nur Farbe, kein Springen */
.standbeine a:hover>span:last-child,.standbeine a>span:last-child{transform:none}
@media (max-width:600px){
  /* 6 · Eine Titelgrösse für alle Kapitel, keine festen Umbrüche */
  .abschnitt h2,.arbeitsweise>h2,.simontext h2,.angebote__kopf h2,.anfrageraster h2,.begleitung h2{font-size:44px;line-height:.98}
  .abschnitt h2 br,.abschnitt h3 br,.begleitung h2 br,.anfrageraster h2 br{display:none}
  /* 9 · Kürzere Wege zwischen den Abschnitten */
  :root{--abschnitt:64px}
  .kapitel{margin-bottom:32px}
  /* 10 · Kapitelzeile: Bezeichnung zusammen, Zusatz darunter */
  .kapitel{flex-direction:column;align-items:flex-start;gap:6px}
  .kapitel span:last-child{text-align:left}
}
/* Übernehmen-Knopf trägt das Zeichen */
.wortfrage button[type=submit]{display:grid;place-items:center;padding:0;width:44px;flex:none}
.wortfrage button[type=submit] .zeichenpunkt{width:18px;height:13px;margin:0}
@media (max-width:600px){
  /* Benennen auf dem Handy: ruhiges Feld unter der Form statt Gedränge darin */
  .leerstelle.schreibt .leerstelle__inhalt{position:absolute;inset:auto 0 auto auto;top:calc(100% + 10px);width:min(320px,calc(100vw - 32px));padding:16px;background:var(--papier);color:var(--tinte);box-shadow:0 12px 32px rgba(28,26,23,.18);border-radius:3px;z-index:5}
  .leerstelle.schreibt .wortfrage>div{border-bottom-color:var(--tinte)}
}
.wortfrage input:focus-visible{outline:none}
.wortfrage>div:focus-within{border-bottom-width:2px}
/* Fragekarten: das Zeichen auf der obersten Rückseite */
.kartenruecken--oben::before{content:"";position:absolute;left:50%;top:50%;width:34px;height:25px;margin:-12px 0 0 -17px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}

/* ---------- Kopfbereich: «Das Unsichtbare.» benennen (06.10.2026) ---------- */
#leer-erklaerung{display:none!important}
.wortvorschau{display:none!important}
.leerstelle.schreibt .leerstelle__kontur{fill:var(--rot)}
.leerstelle.schreibt .hinweis{display:block;cursor:default}
.hinweis{font-size:clamp(24px,2.1vw,34px)}
.leerstelle.schreibt .leerstelle__inhalt{inset:20% 14% 14%;gap:8px;justify-content:center}
.wortfrage label{font-size:16px;font-weight:500;margin-bottom:6px;text-align:center}
.wortfrage>div{border-bottom:2px solid var(--tinte)}
.wortfrage input{font-size:20px;color:var(--tinte)}
.wortfrage input::placeholder{color:var(--tinte);opacity:.55}
@media (min-width:601px){.leerstelle:not(.benannt) .wort-abbrechen{display:none}}
.leerstelle.benannt .hinweis{font-size:14px;font-family:var(--text);font-weight:600;letter-spacing:.06em;text-transform:uppercase;opacity:.75}
/* Das Wort im Claim */
.claim__wort--eigen{color:var(--papier);text-decoration:underline;text-decoration-color:var(--rot);text-decoration-thickness:.07em;text-underline-offset:.12em}
.claim__wort--neu{animation:claim-neu 1.1s var(--ease)}
@keyframes claim-neu{0%{opacity:0;filter:blur(6px)}100%{opacity:1;filter:none}}
@media (prefers-reduced-motion:reduce){.claim__wort--neu{animation:none}}
@media (max-width:600px){.benennen{font-size:14px;font-weight:600}}
.band h1 .claim__wort{color:inherit}
.band h1 .claim__wort--eigen{color:var(--papier);text-decoration-color:var(--rot)}
@media (max-width:600px){.leerstelle.benannt .hinweis{font-size:10px;letter-spacing:.03em}.leerstelle.benannt .etikett{margin:2px 0}}
@media (hover:none){.leerstelle .benennen:focus-visible{outline:none}}

/* «Sichtbar machen»: drei echte Karten statt Tischfoto, warmes Foto der Methode */
.arbeit--eins .foto--karten{grid-column:1/span 4}
.kartentrio{position:relative;aspect-ratio:4/5;display:block}
.kartentrio img{position:absolute;width:52%;height:auto;aspect-ratio:512/714;object-fit:cover;border-radius:10px!important;box-shadow:0 24px 50px rgba(0,0,0,.5)}
.kartentrio img:nth-child(1){left:2%;top:14%;transform:rotate(-9deg)}
.kartentrio img:nth-child(2){left:44%;top:10%;transform:rotate(7deg)}
.kartentrio img:nth-child(3){left:22%;top:22%;transform:rotate(-1.5deg);z-index:2}
.arbeit--eins .foto--modell img{aspect-ratio:4/5;object-position:50% 60%;box-shadow:none}
.arbeit--eins .foto--modell{margin-top:clamp(160px,20vw,360px)}
.v11-bewegung .foto--karten.v11-bild{clip-path:none}
.v11-bewegung .foto--karten .kartentrio img{transition:transform 1.4s var(--ease),opacity 1s var(--ease)}
.v11-bewegung .foto--karten:not(.da) .kartentrio img{opacity:0;transform:rotate(0) translateY(30px)}
@media (max-width:600px){.kartentrio{aspect-ratio:1.05}.kartentrio img{width:44%}.kartentrio img:nth-child(1){left:6%}.kartentrio img:nth-child(2){left:50%}.kartentrio img:nth-child(3){left:28%}}
.kartentrio{aspect-ratio:1/1.02}
.kartentrio img{width:56%;aspect-ratio:512/714!important;height:auto!important}
.kartentrio img:nth-child(1){left:0;top:6%}
.kartentrio img:nth-child(2){left:44%;top:2%}
.kartentrio img:nth-child(3){left:20%;top:14%}
.arbeit--eins .foto--karten figcaption{margin-top:-4%}
@media (max-width:600px){.kartentrio{aspect-ratio:1.15}.kartentrio img{width:42%}.kartentrio img:nth-child(1){left:4%;top:6%}.kartentrio img:nth-child(2){left:54%;top:4%}.kartentrio img:nth-child(3){left:29%;top:12%}.arbeit--eins .foto--karten figcaption{margin-top:0}}

/* ---------- Hören und lesen: Folgen direkt auf der Seite ---------- */
.hoeren{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-top:clamp(64px,6vw,104px);padding-top:var(--s4);border-top:1px solid var(--haar)}
.hoeren__kopf{grid-column:1/span 4}
.hoeren__kopf h3{font:600 var(--t-mittel)/1.02 var(--display);letter-spacing:-.01em;margin:0 0 var(--s2)}
.hoeren__kopf>p:last-child{font-size:15px;opacity:.75;max-width:30ch}
.folgen{grid-column:5/-1;list-style:none;margin:0;padding:0;border-top:1px solid var(--haar)}
.folge{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s3);align-items:center;padding:var(--s3) 0;border-bottom:1px solid var(--haar)}
.folge__play{position:relative;width:64px;height:47px;border:0;padding:0;background:transparent;cursor:pointer}
.folge__zeichen{position:absolute;inset:0;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;transition:transform .4s var(--ease),background .3s}
.folge__play::after{content:"";position:absolute;left:50%;top:50%;margin:-8px 0 0 -5px;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent var(--tinte)}
.folge.spielt .folge__play::after{width:12px;height:16px;margin:-8px 0 0 -6px;border:0;border-left:4px solid var(--tinte);border-right:4px solid var(--tinte)}
.folge__play:hover .folge__zeichen{transform:scale(1.08) rotate(-6deg)}
.folge.spielt .folge__zeichen{animation:folge-atmen 3.2s var(--ease) infinite}
@keyframes folge-atmen{50%{transform:scale(1.06)}}
.folge__titel{margin:0;font:600 clamp(22px,1.8vw,28px)/1.1 var(--display);letter-spacing:-.005em}
.folge__meta{margin:4px 0 0;font-size:14px;opacity:.7}
.folge__leiste{display:flex;align-items:center;gap:var(--s2);margin-top:10px}
.folge__pos{flex:1;height:18px;margin:0;background:transparent;-webkit-appearance:none;appearance:none;--p:0%;cursor:pointer}
.folge__pos::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--rot) var(--p),var(--haar) var(--p))}
.folge__pos::-moz-range-track{height:2px;background:var(--haar)}
.folge__pos::-moz-range-progress{height:2px;background:var(--rot)}
.folge__pos::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-5px;border-radius:50%;background:var(--tinte)}
.folge__pos::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:var(--tinte)}
.folge__pos:disabled{opacity:.35;cursor:default}
.folge__pos:disabled::-webkit-slider-thumb{opacity:0}
.folge__zeit{font-size:13px;font-variant-numeric:tabular-nums;opacity:.75;white-space:nowrap;min-width:9ch;text-align:right}
.folge__quelle,.lesen__link{font-size:14px;font-weight:600;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px;white-space:nowrap}
.folge__quelle:hover,.lesen__link:hover{color:var(--rot)}
.folge__quelle::after,.lesen__link::after{content:" ↗";font-weight:400}
.lesen{grid-column:5/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px var(--s3);align-items:end;margin-top:var(--s5);padding:var(--s3) 0;border-top:1px solid var(--tinte)}
.lesen .klein{grid-column:1/-1;margin:0 0 6px}
.lesen__titel{margin:0;font:600 clamp(20px,1.6vw,26px)/1.15 var(--display)}
.lesen__meta{margin:0;font-size:14px;opacity:.7;grid-column:1}
.lesen__link{grid-column:2;grid-row:2/span 2;align-self:center}
@media (max-width:900px){.hoeren__kopf,.folgen,.lesen{grid-column:1/-1}.folgen{margin-top:var(--s4)}}
@media (max-width:600px){.folge{grid-template-columns:auto minmax(0,1fr);gap:var(--s2)}.folge__quelle{grid-column:2;justify-self:start}.folge__play{width:54px;height:40px}.lesen{grid-template-columns:1fr}.lesen__link{grid-column:1;grid-row:auto;justify-self:start;margin-top:8px}}
@media (prefers-reduced-motion:reduce){.folge.spielt .folge__zeichen{animation:none}}
.hoeren .klein,.lesen .klein{color:var(--tinte);opacity:.65}
.folge__quelle::after,.lesen__link::after{content:none}

/* ---------- Leerstelle: Randschrift und ruhiges Inneres (06.10.2026) ---------- */
.leerstelle__kontur{overflow:visible}
.leerstelle__form{fill:var(--rot);transition:fill .5s var(--ease)}
.leerstelle__kontur{fill:none}
.leerstelle__rand{fill:var(--tinte);font-family:var(--text);font-weight:600;letter-spacing:.14em;text-transform:uppercase;pointer-events:none}
.leerstelle.offen .leerstelle__form,.leerstelle.benannt .leerstelle__form,.leerstelle.schreibt .leerstelle__form{fill:var(--rot)}
/* Die sichtbare Überschrift übernimmt die Randschrift; der Knopf bleibt für Screenreader */
.leerstelle .hinweis{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;padding:0}
/* Inneres: eine Frage, ein Feld */
.leerstelle.schreibt .leerstelle__inhalt{inset:24% 17% 22%;gap:14px;justify-content:center}
.wortfrage label{font:600 clamp(24px,2.1vw,34px)/1.05 var(--display);letter-spacing:-.005em;text-align:center;margin:0 0 4px;color:var(--tinte)}
.wortfrage__zeile{display:flex;align-items:center;gap:10px;border-bottom:1.5px solid var(--tinte)!important}
.wortfrage input{flex:1;min-width:0;text-align:center;font:500 19px/1.2 var(--text);padding:8px 0 8px 40px;color:var(--tinte);background:transparent;border:0}
.wortfrage input::placeholder{color:var(--tinte);opacity:.5}
.wortfrage button[type=submit]{flex:none;display:grid;place-items:center;width:34px;height:34px;min-width:34px;min-height:34px;margin:0 0 4px;border-radius:50%;background:var(--tinte);color:var(--papier);padding:0;border:0;cursor:pointer;transition:transform .3s var(--ease)}
.wortfrage button[type=submit] svg{width:16px;height:16px}
.wortfrage button[type=submit]:hover{transform:translateX(2px)}
/* Benannt: das Wort gross, darunter leise «Wort ändern» */
.leerstelle.benannt .leerstelle__inhalt{inset:24% 14% 22%;gap:6px}
.leerstelle.benannt .benennen{font-size:13px;font-weight:600;border-bottom:1px solid currentColor;min-height:0;padding:2px 0}
.benennen{color:var(--tinte)}
@media (max-width:600px){
  .leerstelle:not(.schreibt):not(.benannt) .benennen{font:600 clamp(18px,5vw,22px)/1.1 var(--display);border:0;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
  .leerstelle.schreibt .leerstelle__inhalt{inset:auto 0 auto auto}
  .leerstelle.schreibt .wortfrage label{font-size:22px}
  .wortfrage input{padding-left:0;text-align:left}
}
.kartentrio img:nth-child(1){left:4%;top:7%}
.kartentrio img:nth-child(2){left:42%}
.kartentrio img:nth-child(3){left:22%}
@media (max-width:600px){
  .kartentrio{aspect-ratio:1.45}
  .kartentrio img{width:40%}
  .arbeit--eins .foto--karten figcaption{margin-top:0}
  .arbeit--eins .foto--modell{margin-top:var(--s4)!important;width:82%}
  .arbeit--eins .arbeit__bilder{row-gap:0}
}

/* ---------- Auftritt im Kopfbereich: leere Stelle, Form wächst, Rand schreibt sich, Frage erscheint ---------- */
.leerstelle__inhalt{transition:opacity .8s var(--ease),transform .8s var(--ease)}
.leerstelle.auftritt .leerstelle__inhalt{opacity:0;transform:translateY(10px)}
.leerstelle.auftritt.auftritt--frage .leerstelle__inhalt{opacity:1;transform:none}
.wortfrage__zeile{position:relative}
.leerstelle.auftritt .wortfrage__zeile{border-bottom-color:transparent!important}
.leerstelle.auftritt .wortfrage__zeile::after{content:"";position:absolute;left:0;right:0;bottom:-1.5px;height:1.5px;background:var(--tinte);transform:scaleX(0);transition:transform .9s var(--ease) .35s}
.leerstelle.auftritt.auftritt--frage .wortfrage__zeile::after{transform:none}
@media (prefers-reduced-motion:reduce){.leerstelle.auftritt .leerstelle__inhalt{opacity:1;transform:none}.leerstelle.auftritt .wortfrage__zeile{border-bottom-color:var(--tinte)!important}}
@media (max-width:600px){.plakat{min-height:clamp(440px,64svh,560px)}.leerstelle:not(.schreibt):not(.benannt) .benennen{font-size:22px}}

/* ---------- Band: Claim links, Person rechts, Angebote darunter (Claude und Astra, 06.10.2026) ---------- */
@media (min-width:901px){
  .band h1{grid-column:1/span 8;grid-row:2;align-self:end}
  .band__person{grid-column:9/-1;grid-row:2;align-self:end;margin:0 0 .6em;padding-top:var(--s3)}
  .standbeine{grid-column:1/-1;grid-row:3;margin-top:clamp(28px,3vw,44px)}
}
.standbeine a{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;min-height:0;padding:var(--s3) 0 var(--s2)}
.standbein__titel{font:600 clamp(20px,1.6vw,28px)/1.1 var(--display)}
.standbein__nutzen{font:400 15px/1.45 var(--text);opacity:.75;max-width:34ch}
.standbeine a:hover .standbein__titel{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.standbeine a>span:last-child{font:400 15px/1.45 var(--text)}
/* Dritter Zugang im Umschalter: Persönlich */
.umschalter__persoenlich{display:inline-flex;align-items:center;min-height:36px;padding:7px 16px;border-radius:999px;font-size:14px;text-decoration:none;color:inherit;border-left:1px solid var(--haar)}
.umschalter__persoenlich:hover{background:var(--rot);color:var(--tinte)}
@media (max-width:600px){.umschalter__persoenlich{padding:6px 10px;font-size:13px}.umschalter button{padding:7px 6px}}
@media (max-width:600px){.nur-gross{display:none}}
@media (max-width:600px){.plakat{min-height:clamp(400px,56svh,520px)}}

/* ---------- Schluss: dieselbe Form, «Besprechbar» am Rand, Ihr Wort darin ---------- */
.rueckkehr{position:relative;width:min(340px,80%);height:auto;aspect-ratio:520/420;margin-top:var(--s5)}
.rueckkehr svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;fill:none;filter:none}
.rueckkehr__form{fill:var(--rot);transform-origin:200px 150px;transform:scale(.92);transition:transform 1.4s cubic-bezier(.2,1.25,.3,1)}
.rueckkehr.da .rueckkehr__form{transform:none}
.rueckkehr__rand{fill:var(--papier);font-family:var(--text);font-weight:600;letter-spacing:.16em}
.rueckkehr__maske{transition:stroke-dashoffset 2.2s cubic-bezier(.4,0,.2,1) .4s}
.rueckkehr>span{position:absolute;left:11.5%;top:14.3%;width:77%;height:71.4%;display:grid;place-items:center;transform:none;color:var(--tinte);font:650 clamp(26px,2.6vw,38px)/1.05 var(--display);text-align:center;padding:0 12%;overflow-wrap:anywhere}
.rueckkehr>span:empty{display:none}
.anfrageraster .worterinnerung{margin-top:var(--s2);font-size:15px;opacity:.8}
.anfrageraster .worterinnerung:empty{display:none}
@media (prefers-reduced-motion:reduce){.rueckkehr__form{transform:none;transition:none}.rueckkehr__maske{transition:none}}

/* ---------- Umschalter mit drei gleichwertigen Reitern (06.10.2026) ---------- */
.umschalter{display:inline-flex;gap:2px;padding:4px;border:1px solid var(--haar);border-radius:999px;background:color-mix(in srgb,var(--papier) 70%,#fff)}
.umschalter button{flex:none;border:0;border-radius:999px;padding:8px 18px;min-height:38px;font:500 14px/1 var(--text);color:var(--tinte);background:transparent;cursor:pointer;transition:background .3s var(--ease),color .3s var(--ease)}
.umschalter button:hover{background:color-mix(in srgb,var(--tinte) 7%,transparent)}
.umschalter button[aria-pressed=true]{background:var(--tinte);color:var(--papier)}
.umschalter button:focus-visible{outline:2px solid var(--rot);outline-offset:2px}
@media (max-width:600px){
  .umschalter{display:flex;width:100%}
  .umschalter button{flex:1;padding:8px 6px;font-size:13px}
}
/* Form gleitet beim Reiterwechsel an ihren Platz */
.plakat.bereit .leerstelle{transition:left .9s cubic-bezier(.2,.7,.1,1),top .9s cubic-bezier(.2,.7,.1,1)}
@media (prefers-reduced-motion:reduce){.plakat.bereit .leerstelle{transition:none}}

/* =====================================================================
   04 Angebote, neu (Claude und Astra, 06.10.2026)
   Ein Hauptangebot als ruhige Fläche, die übrigen Formate als Zeilen mit aufklappbarem Inhalt,
   am Schluss eine Leiste mit Kapazität, Preis und Weg zur Offerte. Keine Fotos.
   ===================================================================== */
.angebote{background:var(--papier)}
.angebote__kopf{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);align-items:end;margin-bottom:var(--s6)}
.angebote__kopf h2{grid-column:1/span 6;margin:0}
.angebote__wahl{grid-column:8/-1;display:flex;flex-direction:column;gap:var(--s3);align-items:flex-start}
.angebote__wahl>p{margin:0;font-size:var(--t-text);line-height:1.6;max-width:44ch}
.umschalter--angebote{align-self:stretch;justify-content:space-between}
.umschalter--angebote button{flex:1}

/* Hauptangebot */
.haupt{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);padding:clamp(32px,3.6vw,56px) clamp(24px,3vw,48px);background:var(--rot-hauch);border-radius:3px;margin-bottom:var(--s6)}
.haupt__text{grid-column:1/span 6;display:flex;flex-direction:column;align-items:flex-start}
.haupt__label{display:inline-flex;align-items:center;gap:10px;margin:0 0 var(--s3);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;font-weight:600}
.zeichenmarke{flex:none;width:16px;height:12px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.haupt h3{font:700 clamp(36px,3.6vw,60px)/.98 var(--display);letter-spacing:-.015em;margin:0 0 var(--s3);max-width:16ch}
.haupt__lead{font-size:var(--t-lead);line-height:1.5;margin:0 0 var(--s3);max-width:40ch}
.haupt__meta{list-style:none;margin:0 0 var(--s4);padding:0;display:flex;flex-wrap:wrap;gap:6px 0;font-size:14px}
.haupt__meta li{display:inline-flex;align-items:center}
.haupt__meta li+li::before{content:"";width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.45;margin:0 12px}
.haupt__knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s4);margin-top:auto}
.haupt__knoepfe .knopf{margin:0}

/* Jahresband */
.jahr{grid-column:8/-1;margin:0;align-self:center;position:relative}
.jahr__liste{list-style:none;margin:0;padding:0;position:relative;height:150px}
.jahr__punkt{position:absolute;left:calc(var(--m) / 10 * 100%);transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;text-align:center}
.jahr__punkt--ort{bottom:58px}
.jahr__punkt--ort[data-ebene="2"]{bottom:96px}
.jahr__punkt--ort::after{content:"";order:3;width:26px;height:19px;margin-top:8px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.jahr__punkt--ort[data-ebene="2"]::after{margin-top:46px}
.jahr__punkt--online{bottom:22px}
.jahr__punkt--online::after{content:"";width:11px;height:11px;border-radius:50%;border:1.5px solid var(--tinte);background:var(--rot-hauch)}
.jahr__name{font:600 15px/1.1 var(--display);white-space:nowrap;letter-spacing:.01em}
.jahr__punkt--online .jahr__name,.jahr__monat,.jahr__art{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.jahr__achse{position:relative;display:flex;justify-content:space-between;border-top:1.5px solid var(--tinte);margin-top:-27px;padding-top:30px;font-size:12px;letter-spacing:.04em;opacity:.8}
.jahr__achse span{width:0;display:flex;justify-content:center;white-space:nowrap}
.jahr figcaption{display:flex;gap:var(--s3);margin-top:var(--s3);font-size:13px}
.jahr__legende{display:inline-flex;align-items:center;gap:8px}
.jahr__legende--ort::before{content:"";width:16px;height:12px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.jahr__legende--online::before{content:"";width:9px;height:9px;border-radius:50%;border:1.5px solid var(--tinte)}

/* Einzelberatung als Hauptangebot */
.haupt__anlaesse{grid-column:8/-1;align-self:center}
.haupt__klein,.format__klein{margin:0 0 var(--s2);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;font-weight:600;opacity:.7}
.haupt__anlaesse ul{list-style:none;margin:0;padding:0;border-top:1px solid color-mix(in srgb,var(--tinte) 18%,transparent)}
.haupt__anlaesse li{padding:14px 0;border-bottom:1px solid color-mix(in srgb,var(--tinte) 18%,transparent);font:600 clamp(20px,1.6vw,26px)/1.2 var(--display)}
.haupt__grenze{margin:var(--s3) 0 0;font-size:14px;line-height:1.55;opacity:.8;max-width:46ch}

/* Formate als Zeilen */
.formate{border-top:1px solid var(--tinte)}
.formate__titel{margin:0;padding:var(--s3) 0 var(--s2);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;font-weight:600;opacity:.7}
.format{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);row-gap:0;padding:var(--s4) 0;border-top:1px solid var(--haar);align-items:start}
.format__kopf{grid-column:1/span 5}
.format__art{margin:0 0 8px;font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.format__titel{margin:0;font:700 clamp(28px,2.4vw,40px)/1 var(--display);letter-spacing:-.01em}
.format__kern{grid-column:6/span 5}
.format__nutzen{margin:0 0 8px;font-size:var(--t-text);line-height:1.5}
.format__meta{margin:0;font-size:14px;opacity:.7}
.format__aktionen{grid-column:11/-1;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.format__aktionen .textlink{font-size:15px;white-space:nowrap}
.format__auf{display:inline-flex;align-items:center;gap:10px;background:none;border:0;padding:6px 0;font:500 14px/1 var(--text);color:inherit;cursor:pointer}
.format__plus{position:relative;width:14px;height:14px}
.format__plus::before,.format__plus::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;margin-top:-.75px;background:currentColor;transition:transform .35s var(--ease)}
.format__plus::after{transform:rotate(90deg)}
.format.offen .format__plus::after{transform:rotate(0)}
.format__mehr{grid-column:6/-1;display:grid;grid-template-columns:1fr 1fr;gap:var(--s4);margin-top:var(--s4);padding-top:var(--s3);border-top:1px dashed var(--haar)}
.format__mehr ul{margin:0;padding:0;list-style:none}
.format__mehr li{position:relative;padding:6px 0 6px 22px;font-size:15px;line-height:1.45}
.format__mehr li::before{content:"";position:absolute;left:0;top:13px;width:11px;height:8px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.format__mehr p{margin:0 0 var(--s2);font-size:15px;line-height:1.55}
.format__hinweis{opacity:.7;font-size:14px!important}
.format__stimmen{font-size:14px;font-weight:600}

/* Persönlich */
.persoenlich{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);align-items:baseline;padding:var(--s4) 0;border-top:1px solid var(--tinte);border-bottom:1px solid var(--tinte);margin-top:var(--s5);text-decoration:none;color:inherit;transition:color .3s var(--ease)}
.persoenlich__label{grid-column:1/span 2;font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.persoenlich__titel{grid-column:3/span 3;font:700 clamp(26px,2.2vw,36px)/1 var(--display)}
.persoenlich__text{grid-column:6/span 5;font-size:var(--t-text)}
.persoenlich__pfeil{grid-column:12;justify-self:end;font-size:20px;transition:transform .35s var(--ease)}
.persoenlich:hover{color:var(--rot)}
.persoenlich:hover .persoenlich__pfeil{transform:translate(3px,-3px)}

/* Rahmen */
.rahmen{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-top:var(--s6);padding:var(--s4) 0 0;border-top:1px solid var(--haar)}
.rahmen__satz{grid-column:1/span 5;margin:0;font:600 clamp(22px,1.8vw,28px)/1.2 var(--display)}
.rahmen__weg{grid-column:7/-1;display:flex;flex-direction:column;align-items:flex-start;gap:var(--s3)}
.rahmen__weg p{margin:0;font-size:var(--t-text);line-height:1.55;max-width:52ch}
.rahmen__weg .knopf{margin:0}

/* Einblenden der neuen Zeilen */

@media (max-width:900px){
  .angebote__kopf h2,.angebote__wahl,.haupt__text,.jahr,.haupt__anlaesse,.rahmen__satz,.rahmen__weg{grid-column:1/-1}
  .angebote__wahl{margin-top:var(--s3)}
  .jahr,.haupt__anlaesse{margin-top:var(--s5)}
  .format__kopf,.format__kern,.format__aktionen,.format__mehr{grid-column:1/-1}
  .format__kern{margin-top:var(--s2)}
  .format__aktionen{flex-direction:row;justify-content:space-between;align-items:center;margin-top:var(--s2)}
  .format__mehr{grid-template-columns:1fr}
  .persoenlich__label,.persoenlich__titel,.persoenlich__text{grid-column:1/span 11}
  .persoenlich__pfeil{grid-column:12;grid-row:2}
  .persoenlich__titel{margin:6px 0}
  .rahmen__weg{margin-top:var(--s3)}
}
@media (max-width:600px){
  .umschalter--angebote button{font-size:13px;padding:8px 4px}
  .haupt{padding:28px 20px}
  /* Jahresband als Liste */
  .jahr__liste{height:auto;display:grid;gap:0;border-left:1.5px solid var(--tinte);margin-left:6px}
  .jahr__punkt,.jahr__punkt--ort,.jahr__punkt--ort[data-ebene="2"],.jahr__punkt--online{position:relative;left:auto;bottom:auto;transform:none;flex-direction:row;align-items:center;gap:12px;padding:8px 0 8px 18px;text-align:left}
  .jahr__punkt::after{order:-1!important;margin:0 0 0 -27px!important}
  .jahr__punkt--online::after{margin-left:-24px!important}
  .jahr__monat{position:static;width:34px;height:auto;clip-path:none;font-size:13px;opacity:.7}
  .jahr__punkt--online .jahr__name{position:static;width:auto;height:auto;clip-path:none;font-weight:500}
  .jahr__name{font-size:17px}
  .jahr__achse{display:none}
}
.umschalter--angebote button{flex:1 1 auto;white-space:nowrap}
.haupt__meta{flex-direction:column;gap:4px}
.haupt__meta li+li::before{content:none}
.haupt__meta li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--rot);margin-right:10px}

/* Jahresband, sauber: alle Punkte auf der Linie, Namen darüber */
.jahr{--achse:44px}
.jahr__liste{height:150px}
.jahr__punkt,.jahr__punkt--ort,.jahr__punkt--ort[data-ebene="2"],.jahr__punkt--online{bottom:auto;top:auto}
.jahr__punkt--ort{bottom:calc(var(--achse) - 10px)}
.jahr__punkt--online{bottom:calc(var(--achse) - 6.5px)}
.jahr__punkt--ort::after,.jahr__punkt--ort[data-ebene="2"]::after{margin-top:0;order:3}
.jahr__punkt--ort .jahr__name{margin-bottom:10px}
.jahr__punkt--ort[data-ebene="2"] .jahr__name{margin-bottom:0}
.jahr__punkt--ort[data-ebene="2"]::before{content:"";order:2;width:1px;height:30px;margin:4px 0 4px;background:var(--tinte);opacity:.4}
.jahr__achse{position:absolute;left:0;right:0;bottom:calc(var(--achse) - 24px + 52px);margin:0;padding:0;border:0;height:0}
.jahr__liste::before{content:"";position:absolute;left:0;right:0;bottom:var(--achse);border-top:1.5px solid var(--tinte)}
.jahr__monate{display:flex;justify-content:space-between;margin-top:-30px;font-size:12px;letter-spacing:.04em;opacity:.8}
.jahr__achse{display:flex;justify-content:space-between;position:relative;bottom:auto;margin-top:calc(-1 * var(--achse) + 14px);font-size:12px;letter-spacing:.04em;opacity:.8;border:0;padding:0;height:auto}
.haupt__meta li+li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--rot);margin:0 10px 0 0;opacity:1}
@media (max-width:600px){
  .jahr__liste::before{content:none}
  .jahr__punkt--ort[data-ebene="2"]::before{content:none}
  .jahr__punkt--ort .jahr__name{margin-bottom:0}
}
.jahr__punkt--ort[data-ebene="2"]{bottom:calc(var(--achse) - 10px)}
@media (max-width:600px){
  .jahr{--achse:0px}
  .jahr__liste{height:auto;display:grid;gap:0;border-left:1.5px solid var(--tinte);margin-left:10px}
  .jahr__liste::before{content:none}
  .jahr__punkt,.jahr__punkt--ort,.jahr__punkt--ort[data-ebene="2"],.jahr__punkt--online{position:relative;left:auto;bottom:auto;top:auto;transform:none;flex-direction:row;align-items:center;gap:14px;padding:9px 0 9px 22px;text-align:left}
  .jahr__punkt--ort::after,.jahr__punkt--ort[data-ebene="2"]::after{order:-1;position:absolute;left:-14px;top:50%;margin:-9.5px 0 0!important;width:26px;height:19px}
  .jahr__punkt--online::after{order:-1;position:absolute;left:-7px;top:50%;margin:-6px 0 0!important}
  .jahr__punkt--ort[data-ebene="2"]::before{content:none}
  .jahr__monat{position:static;width:36px;height:auto;clip-path:none;font-size:13px;opacity:.7;flex:none}
  .jahr__name,.jahr__punkt--online .jahr__name{position:static;width:auto;height:auto;clip-path:none;margin:0!important;font:600 17px/1.2 var(--display)}
  .jahr__punkt--online .jahr__name{font-weight:500;opacity:.85}
  .jahr__achse{display:none}
  .jahr figcaption{margin-top:var(--s3)}
}
.jahr__punkt--ort[data-ebene="2"]::before{height:40px}

/* Formular, echt (06.10.2026) */
.formular__falle{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.formular__optional{text-transform:none;letter-spacing:0;opacity:.6;font-weight:400}
.formular__datenschutz{margin:var(--s3) 0 0;font-size:13px;opacity:.75;max-width:60ch}
.formular__datenschutz a{color:inherit}
.formular__antwort{min-height:1.5em;font-size:15px;margin-top:var(--s2)}
.formular__antwort--fehler{color:#FF9B8A}
.formular button[disabled]{opacity:.6;cursor:progress}
.formular input:user-invalid,.formular textarea:user-invalid{border-bottom-color:#FF9B8A}

/* Zwei helle Abschnitte hintereinander: weniger Leerraum dazwischen */
.vertrauen{padding-bottom:var(--s5)}
.stimmen>.stimme--echt{padding-bottom:var(--s3)}

/* Abnahme Astra (06.10.2026) */
h3.formate__titel{font:600 var(--t-label)/1.4 var(--text);letter-spacing:.1em;text-transform:uppercase;max-width:none}
/* Kontrast kleiner Beschriftungen mindestens 4.5:1 */
.kapitel span:last-child,.formate__titel,.format__art,.format__meta,.haupt__klein,.format__klein,.format__hinweis,.persoenlich__label,.umfeldzeile>p,.angebot__art,.stimmen .platzhalter,.belegleiste>p,.klein,.folge__meta,.folge__zeit,.lesen__meta,.foto figcaption,.formular__datenschutz,.fuss--v11 .fuss__titel,.fuss--v11 small,.tinte-hinweis{opacity:.86}
.format__hinweis{opacity:.86!important}
/* Lange eigene Wörter brechen um statt abgeschnitten zu werden */
.claim__wort,.etikett,.rueckkehr>span{overflow-wrap:anywhere;hyphens:auto}
.jahr__beispiel{margin:var(--s2) 0 0;font-size:13px;opacity:.86}
.arbeit--eins .foto figcaption span{opacity:.86}

/* ---------- 04 Angebote: drei Standbeine, immer alle sichtbar; der Reiter hebt hervor, was passt (06.10.2026) ---------- */
.saeulen{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--tinte);margin-top:var(--s5)}
.saeule{position:relative;display:flex;flex-direction:column;min-width:0;padding:var(--s4) clamp(20px,2.2vw,36px) var(--s5);border-left:1px solid var(--haar);transition:background-color .5s var(--ease)}
.saeule:first-child{border-left:0}
.saeule.passt{background:color-mix(in srgb,#fff 50%,var(--papier))}
.saeule::before{content:"";position:absolute;left:0;right:0;top:-2px;height:3px;background:var(--rot);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.saeule.passt::before{transform:none}
.saeule__kopf{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 var(--s4);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase}
.saeule__nr{display:inline-flex;align-items:center;gap:10px;font-weight:600}
.saeule__nr::before{content:"";width:22px;height:16px;background:var(--tinte);-webkit-mask:var(--zeichen) center/contain no-repeat;mask:var(--zeichen) center/contain no-repeat;opacity:.22;transition:background-color .4s,opacity .4s}
.saeule.passt .saeule__nr::before{background:var(--rot);opacity:1}
.saeule__fuer{opacity:.7;text-align:right}
.saeule__titel{font:700 clamp(34px,3.1vw,50px)/.98 var(--display);letter-spacing:-.015em;margin:0 0 var(--s3)}
.saeule__lead{font-size:var(--t-text);line-height:1.55;margin:0 0 var(--s4);max-width:36ch}
.saeule__inhalt{flex:1}
.saeule__klein{margin:0 0 10px;font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.65}
.saeule__liste,.saeule__fragen{list-style:none;margin:0 0 var(--s4);padding:0;border-top:1px solid var(--haar)}
.saeule__liste li{position:relative;display:flex;flex-direction:column;gap:2px;padding:12px 0 12px 24px;border-bottom:1px solid var(--haar);font-size:15px;line-height:1.45}
.saeule__liste li::before{content:"";position:absolute;left:0;top:18px;width:12px;height:9px;background:var(--rot);-webkit-mask:var(--zeichen) center/contain no-repeat;mask:var(--zeichen) center/contain no-repeat}
.saeule__liste strong{font-weight:600}
.saeule__liste span{opacity:.78}
.saeule__liste--kurz span{opacity:1}
.saeule__fragen li{padding:14px 0;border-bottom:1px solid var(--haar);font:600 clamp(21px,1.7vw,27px)/1.1 var(--display);letter-spacing:-.005em;text-wrap:balance}
.saeule__fakten{margin:0 0 var(--s4);font-size:14px;border-top:1px solid var(--haar)}
.saeule__fakten div{display:grid;grid-template-columns:7.6em minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--haar)}
.saeule__fakten dt{opacity:.65}
.saeule__fakten dd{margin:0;font-weight:500}
.saeule__knoepfe{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s3)}
.saeule__knoepfe .knopf{gap:24px}
.saeule__knoepfe .textlink{font-size:15px}
@media (max-width:1100px){.saeule__fakten div{grid-template-columns:1fr;gap:2px}}
@media (max-width:900px){
  .saeulen{grid-template-columns:1fr}
  .saeule{border-left:0;border-top:1px solid var(--haar);padding:var(--s4) 20px var(--s5)}
  .saeule:first-child{border-top:0}
  .saeule__fakten div{grid-template-columns:8em minmax(0,1fr);gap:12px}
}
@media (max-width:600px){.saeule{padding-inline:16px}.saeule__kopf{flex-direction:column;align-items:flex-start;gap:8px}.saeule__fuer{text-align:left}}
.auchmoeglich{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);align-items:baseline;padding:var(--s4) 0;border-top:1px solid var(--tinte);margin-top:var(--s5)}
.auchmoeglich__label{grid-column:1/span 2;font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.7;margin:0}
.auchmoeglich__titel{grid-column:3/span 3;font:700 clamp(24px,2vw,32px)/1.02 var(--display);letter-spacing:-.01em;margin:0}
.auchmoeglich__text{grid-column:6/span 5;margin:0;font-size:15px;line-height:1.55;max-width:52ch}
.auchmoeglich .textlink{grid-column:11/-1;justify-self:end;font-size:15px;white-space:nowrap}
@media (max-width:900px){.auchmoeglich{display:flex;flex-direction:column;align-items:flex-start;gap:12px}}

@media (prefers-reduced-motion:reduce){.saeule,.saeule::before{transition:none}}
.saeule__fragen{margin-bottom:var(--s2)}
.saeule__notiz{margin:0 0 var(--s4);font-size:14px;line-height:1.5;opacity:.75}

/* ---------- Zeichen in Knöpfen sparsam (Simon, 06.10.2026): nur «Anfragen» oben und «Anfrage senden» ---------- */
.knopf span[aria-hidden=true]{display:none}
.kopf .knopf span[aria-hidden=true],.formular button[type=submit] span[aria-hidden=true]{display:inline-block}
.knopf{justify-content:center}
.kopf .knopf,.formular button[type=submit]{justify-content:space-between}
/* Die Form am Schluss erscheint nur, wenn jemand oben ein Wort genannt hat. Sonst bleibt der Abschnitt ruhig. */
.anfrage:not(.mit-wort) .rueckkehr{display:none}

/* Sprunglinks zu den drei Standbeinen, nur wenn sie untereinander stehen */
.saeulen__sprung{display:none}
@media (max-width:900px){
  .saeulen__sprung{display:flex;flex-wrap:wrap;gap:8px;margin:var(--s4) 0 0}
  .saeulen__sprung a{display:inline-flex;align-items:center;min-height:40px;padding:8px 14px;border:1px solid var(--haar);border-radius:999px;font-size:14px;font-weight:500;text-decoration:none}
  .saeulen__sprung a:hover{border-color:var(--tinte)}
}
/* Kopfzeile der Standbeine: bei mittlerer Breite untereinander, damit die Titel auf einer Linie bleiben */
@media (min-width:901px) and (max-width:1280px){
  .saeule__kopf{flex-direction:column;align-items:flex-start;gap:6px;min-height:3.6em}
  .saeule__fuer{text-align:left}
  .saeule__knoepfe .knopf{padding-inline:18px;font-size:14px}
}
/* Die Frage in der Form ist länger geworden */
.leerstelle .wortfrage label{text-wrap:balance}
.benennen{text-wrap:balance}

/* ---------- Gegenprüfung Astra (06.10.2026) ---------- */
/* Handy: Das Etikett über den Sätzen bleibt sichtbar, der Reiter nennt Firmen und Institutionen ganz */
@media (max-width:600px){
  .umfeldzeile{flex-wrap:wrap;row-gap:12px}
  .umfeldzeile>p{display:block;order:2;width:100%;margin:2px 0 0}
  .umfeldzeile .umschalter{width:100%}
  .umfeldzeile .umschalter button{flex:1;white-space:normal;line-height:1.15;font-size:13px;padding:6px 8px}
  .umfeldzeile .nur-gross{display:inline}
}
/* Titel ohne einzelnes Wort auf der letzten Zeile */
h1,h2,h3,.saeule__titel,.standbein__titel{text-wrap:balance}

/* ---------- Handy: Frage und Eingabefeld direkt in der Form statt in einem schwebenden Kästchen (06.10.2026) ---------- */
@media (max-width:600px){
  .leerstelle.schreibt .leerstelle__inhalt{position:absolute;inset:20% 15% 16%;top:20%;width:auto;padding:0;background:none;box-shadow:none;border-radius:0;color:var(--tinte);z-index:auto;gap:8px;justify-content:center}
  .leerstelle.schreibt .wortfrage label{font:600 clamp(18px,5.2vw,21px)/1.05 var(--display);margin:0 0 4px}
  .leerstelle .wortfrage input{font-size:16px;padding:6px 0;text-align:center}
  .leerstelle .wortfrage button[type=submit]{width:34px;height:34px;min-width:34px;min-height:34px}
  .leerstelle.schreibt:not(.benannt) .wort-abbrechen{display:none}
  .leerstelle.schreibt.benannt .wortfrage label{font-size:16px}
  .leerstelle.schreibt.benannt .wort-abbrechen{min-height:32px;padding:4px 0;font-size:12px;display:block;margin:0 auto}
}

/* ---------- Feld schliessen: × links, Pfeil rechts; geschlossen bleibt die Frage in der Form (06.10.2026) ---------- */
.wortfrage .wort-zu{position:relative;flex:none;display:grid;place-items:center;width:30px;height:30px;min-width:30px;min-height:30px;margin:0 0 4px;padding:0;border:1.5px solid color-mix(in srgb,var(--tinte) 50%,transparent);border-radius:50%;background:transparent;color:var(--tinte);cursor:pointer;opacity:.8;transition:opacity .2s,transform .35s var(--ease),border-color .2s}
.wortfrage .wort-zu::before{content:"";position:absolute;inset:-8px}
.wortfrage .wort-zu:hover{opacity:1;border-color:var(--tinte);transform:rotate(90deg)}
.wortfrage .wort-zu svg{width:12px;height:12px}
.leerstelle .wortfrage input{padding-left:0;padding-right:0;text-align:center}
.leerstelle:not(.schreibt):not(.benannt) .benennen{font:600 clamp(22px,2.1vw,34px)/1.05 var(--display);letter-spacing:-.005em;color:var(--tinte);border:0;padding:0;min-height:0;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;text-wrap:balance;cursor:pointer}
.leerstelle:not(.schreibt):not(.benannt) .benennen:hover{text-decoration-thickness:2px}
.leerstelle:not(.schreibt) .leerstelle__inhalt{inset:24% 16% 22%}
@media (max-width:600px){
  .leerstelle .wortfrage__zeile{gap:6px}
  .leerstelle .wortfrage .wort-zu{width:28px;height:28px;min-width:28px;min-height:28px}
  .leerstelle .wortfrage button[type=submit]{width:32px;height:32px;min-width:32px;min-height:32px}
  .leerstelle:not(.schreibt):not(.benannt) .benennen{font-size:clamp(19px,5.4vw,22px)}
}
@media (prefers-reduced-motion:reduce){.wortfrage .wort-zu:hover{transform:none}}

/* Abspielzeichen gezeichnet statt als Zeichen ▶: iOS macht daraus sonst ein blaues Emoji (06.10.2026) */
.play{font-size:0}
.play::after{content:"";width:0;height:0;margin-left:3px;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent currentColor}

/* ---------- WhatsApp und LinkedIn als Symbole (06.10.2026) ---------- */
.kanaele{display:flex;flex-wrap:wrap;gap:10px;margin-top:var(--s3)}
.kanal{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:8px 16px 8px 12px;border:1px solid currentColor;border-radius:999px;text-decoration:none;font-size:15px;font-weight:500;line-height:1;color:inherit;transition:background-color .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease)}
.kanal svg{width:18px;height:18px;fill:currentColor;flex:none}
.kanal:hover{background:var(--rot);border-color:var(--rot);color:var(--tinte)}
.dunkel .kanal{border-color:color-mix(in srgb,var(--papier) 40%,transparent)}
.fuss--v11 .fuss__spalten .kanaele{margin:6px 0 4px;gap:8px}
.fuss--v11 .fuss__spalten a.kanal{border:1px solid var(--haar);font-size:14px;min-height:40px;padding:6px 14px 6px 10px}
.fuss--v11 .fuss__spalten a.kanal:hover{background:var(--rot);border-color:var(--rot);color:var(--tinte)}
.us-knoepfe .kanaele{flex-basis:100%;margin-top:4px}

/* ---------- Ansicht direkt in den Abschnitten 01 und 04 (Simon und Astra, 06.10.2026) ---------- */
.kapitel--wahl{align-items:center;flex-wrap:wrap;row-gap:10px}
.kapitel__wahl{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.kapitel__wahl-titel{opacity:.6}
.kapitel__knoepfe{display:flex;gap:2px;padding:3px;border:1px solid var(--haar);border-radius:999px}
.kapitel__knoepfe button{font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit;background:none;border:0;border-radius:999px;padding:6px 12px;min-height:32px;cursor:pointer;opacity:.75;transition:background-color .25s var(--ease),color .25s var(--ease),opacity .25s}
.kapitel__knoepfe button:hover{opacity:1}
.kapitel__knoepfe button[aria-pressed=true]{background:var(--tinte);color:var(--papier);opacity:1}
.dunkel .kapitel__knoepfe button[aria-pressed=true]{background:var(--papier);color:var(--tinte)}
.kapitel__auswahl{display:none}
@media (max-width:900px){
  .kapitel--wahl{flex-direction:column;align-items:stretch}
  .kapitel__wahl{flex-direction:column;align-items:stretch;gap:8px}
  .kapitel__wahl-titel{text-align:left}
  .kapitel__knoepfe{display:none}
  .kapitel__auswahl{display:block;position:relative}
  .kapitel__auswahl::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);pointer-events:none}
  .kapitel__auswahl select{width:100%;min-height:44px;padding:10px 40px 10px 16px;font:500 15px/1.2 var(--text);letter-spacing:0;text-transform:none;color:var(--tinte);background:transparent;border:1px solid var(--haar);border-radius:999px;-webkit-appearance:none;appearance:none}
}
.kapitel__wahl span:first-child::before,.kapitel__auswahl span::before{content:none}
.kapitel__wahl-titel{display:inline}
.leerstelle .benennen:focus-visible{outline:1.5px solid currentColor;outline-offset:5px;border-radius:4px}

/* ---------- Ruhiger Kopfbereich (06.10.2026, Simon, Claude und Astra) ----------
   Eine Hauptaussage, ein erklärender Satz, eine Wahl, eine Handlung. Keine automatische Bewegung.
   Darunter ein einzelner Alltagssatz, weitere nur auf Wunsch. Die Frage ist freiwillig. */
.held{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,6vw,120px);align-items:center;padding:clamp(48px,7vw,104px) var(--rand) clamp(48px,6vw,88px)}
.held h1{font:750 clamp(40px,5vw,72px)/1 var(--display);letter-spacing:-.018em;margin:0;max-width:14ch;color:var(--tinte)}
.claim__rot{color:var(--rot)}
.held__erkl{font-size:18px;line-height:1.55;max-width:44ch;margin:24px 0 0}
.held__fuer{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:32px}
.held__etikett,.satzteil__etikett{margin:0;font-size:var(--t-label);letter-spacing:.09em;text-transform:uppercase;color:color-mix(in srgb,var(--tinte) 78%,var(--papier))}
.umschalter--held{width:auto;justify-content:flex-start;background:transparent}
.umschalter--held button{font:500 15px/1.2 var(--text);padding:11px 16px;min-height:44px;transition:background-color .15s ease,color .15s ease}
.held__knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;margin-top:28px}
.held__knoepfe .knopf span[aria-hidden=true]{display:none}
.held__zeichen{display:block;width:clamp(160px,15vw,220px);height:auto;fill:var(--rot)}
.satzteil{padding:clamp(48px,6vw,96px) var(--rand) clamp(40px,5vw,72px);border-top:1px solid var(--haar)}
.satzteil__satz{font:700 clamp(40px,5vw,72px)/1.02 var(--display);letter-spacing:-.015em;margin:14px 0 16px;min-height:1.02em;text-wrap:balance}
.satzteil__dahinter{font-size:18px;margin:0}
.satzteil__knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:24px}
.satzteil__frage{font:600 15px/1 var(--text);border:1px solid var(--tinte);border-radius:999px;padding:14px 20px;min-height:44px;background:none;color:var(--tinte);cursor:pointer;transition:background-color .15s ease,color .15s ease}
.satzteil__frage[aria-expanded=true]{background:var(--tinte);color:var(--papier)}
.satzteil__anderer{font:600 15px/1 var(--text);background:none;border:0;border-bottom:1px solid currentColor;padding:6px 0;min-height:44px;cursor:pointer;color:var(--tinte)}
.satzteil__hinweis{margin:12px 0 0;font-size:14px;color:color-mix(in srgb,var(--tinte) 75%,var(--papier))}
.wortfrage--ruhig{display:flex;align-items:center;gap:12px;width:100%;max-width:440px;margin-top:16px;border-bottom:1.5px solid var(--tinte);text-align:left}
.wortfrage--ruhig:focus-within{border-bottom-width:2px}
.wortfrage--ruhig input{flex:1;min-width:0;border:0;background:none;font:500 18px/1.2 var(--text);padding:12px 0;text-align:left;color:var(--tinte)}
.wortfrage--ruhig input::placeholder{color:var(--tinte);opacity:.55}
.wortfrage--ruhig input:focus-visible{outline:none}
.wortfrage--ruhig button{flex:none;display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;margin:0 0 6px;border-radius:50%;border:0;background:var(--tinte);color:var(--papier);cursor:pointer}
.wortfrage--ruhig button svg{width:18px;height:18px}
.satzteil__zurueck{margin:22px 0 0;font:650 clamp(26px,2.6vw,40px)/1.05 var(--display);overflow-wrap:anywhere}
.satzteil__zurueck em{font-style:normal;color:var(--rot)}
.standbeine--hell{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3);margin-top:clamp(48px,6vw,88px);border-top:1px solid var(--haar)}
.standbeine--hell a{color:var(--tinte)}
@media (prefers-reduced-motion:reduce){.umschalter--held button,.satzteil__frage{transition:none}}
@media (max-width:700px){
  .held{grid-template-columns:1fr;gap:0;padding:28px 24px 40px}
  .held__zeichen{width:64px;order:-1;margin-bottom:20px}
  .held h1{font-size:40px}
  .held__erkl{font-size:17px}
  .umschalter--held{width:100%}
  .umschalter--held button{flex:1;font-size:13px;padding:8px 8px;white-space:normal;line-height:1.15}
  .satzteil{padding:40px 24px}
  .satzteil__satz{font-size:40px;min-height:2.04em}
  .standbeine--hell{grid-template-columns:1fr;gap:0}
}
/* Handy: Orientierung gut lesbar, kürzerer Anlauf (Astra, Runde 4) */
@media (max-width:700px){
  .held__etikett,.satzteil__etikett{font-size:13px;letter-spacing:.06em;color:color-mix(in srgb,var(--tinte) 88%,var(--papier))}
  .satzteil__hinweis{font-size:15px;color:color-mix(in srgb,var(--tinte) 88%,var(--papier))}
  .held{padding-bottom:28px}
  .satzteil{padding-top:32px}
  .standbeine--hell{margin-top:36px}
  .belegzeile{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 16px}
  .belegzeile a{min-width:0;overflow-wrap:anywhere;hyphens:auto}
  .belegzeile a{font-size:13.5px;line-height:1.35;padding:10px 0;min-height:44px}
}

/* ---------- Kopfbereich «Kehrseite» (06.10.2026, Simon, Claude und Astra) ----------
   Drei Sätze als Zitate. Jeder ist ein Streifen mit zwei Seiten: vorne das Gesagte, hinten auf Rot, was dahinterstecken könnte.
   Gedreht wird nur auf Klick oder Tippen, ein Satz nach dem anderen. Die rote Rückseite hat die weiche Rundung der Form. */
.kehrseite{position:relative;margin:0 var(--rand);padding:clamp(16px,2vw,30px) 0 clamp(22px,2.2vw,36px)}
.kehrseite__liste{list-style:none;margin:0;padding:0}
.kehr{position:relative;margin:0 0 .06em;font:750 clamp(32px,4.9vw,72px)/1.04 var(--display);letter-spacing:-.018em;color:var(--tinte);perspective:1400px;transition:opacity .4s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.js .kehrseite.laeuft .kehr:not(.da){opacity:0;transform:translateY(.14em)}
.kehr__vorn{position:relative;display:block;padding-left:.48em}
.kehr__q{position:absolute;left:0;color:var(--rot)}
.kehr__innen{display:inline-grid;max-width:100%;font:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;background:none;border:0;padding:0;margin:0;text-align:left;cursor:pointer;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.55,.05,.2,1)}
.kehr__vorn,.kehr__hinten{grid-area:1/1;-webkit-backface-visibility:hidden;backface-visibility:hidden}
.kehr__hinten{position:relative;transform:rotateX(180deg);background:var(--rot);color:var(--tinte);padding:0 .42em 0 .48em;border-radius:.62em .8em .7em .74em / .5em .62em .56em .6em}
.kehr.um .kehr__innen{transform:rotateX(180deg)}
.kehr__innen:hover .kehr__vorn{text-decoration:underline;text-decoration-color:var(--rot);text-decoration-thickness:.05em;text-underline-offset:.1em}
.kehr__innen:focus-visible{outline:2px solid var(--tinte);outline-offset:4px;border-radius:4px}
.kehrseite__hinweis{display:flex;align-items:center;gap:10px;margin:clamp(14px,1.6vw,22px) 0 0;font-size:14px;color:color-mix(in srgb,var(--tinte) 84%,var(--papier));transition:opacity .6s ease}
.js .kehrseite.laeuft .kehrseite__hinweis{opacity:0}
.kehrseite__punkt{width:22px;height:16px;flex:none;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.nur-touch{display:none}
@media (hover:none){.nur-maus{display:none}.nur-touch{display:inline}}
@media (prefers-reduced-motion:reduce){.kehr,.kehr__innen,.kehrseite__hinweis{transition:none!important}}
@media (max-width:700px){
  .kehrseite{margin:0 16px;padding:12px 0 22px}
  .kehr{font-size:clamp(26px,7.8vw,31px);line-height:1.08}
  .kehrseite__hinweis{font-size:13px;margin-top:12px}
  .band{padding-top:22px}
  .band__gedanke{font-size:13px;margin-bottom:8px}
}
@media (max-width:340px){.kopf nav{font-size:11.5px;letter-spacing:-.01em}.kopf nav a{padding-inline:1px;min-width:0}.kopf__name{font-size:24px}.kopf .knopf{padding-inline:10px}}
.umfeldzeile>p{font-size:13px;letter-spacing:.08em;color:color-mix(in srgb,var(--tinte) 85%,var(--papier));opacity:1}

/* ---------- «Vom Satz zum Gespräch» (06.10.2026, nach dem Kopfbereich «Kehrseite») ----------
   Zu jedem Satz drei Seiten: gesagt, was dahinterstecken könnte (dieselbe rote Rückseite wie oben), wie ich nachfrage. */
.vomsatz{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-bottom:clamp(56px,6vw,104px)}
.vomsatz__kopf{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:end;margin-bottom:clamp(32px,3.4vw,56px)}
.vomsatz__label{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin-bottom:var(--s3);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase}
.vomsatz__punkt{width:18px;height:13px;flex:none;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.vomsatz h2{grid-column:1/span 7}
.vomsatz__text{grid-column:8/-1;max-width:36ch;font-size:clamp(17px,1.3vw,20px);line-height:1.5;padding-bottom:.4em}
.vomsatz__raster{grid-column:1/-1;display:grid;grid-template-columns:subgrid;align-items:start}
.vomsatz__spalte{grid-column:span 4;border-top:1px solid var(--haar);padding-top:var(--s3)}
.vomsatz__was{margin-bottom:var(--s2);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.86}
.vomsatz__saetze{display:flex;flex-direction:column;align-items:flex-start}
.vomsatz__saetze button{position:relative;min-height:44px;padding:6px 0 6px 22px;border:0;background:none;color:var(--tinte);font:650 clamp(22px,1.8vw,30px)/1.12 var(--display);letter-spacing:-.005em;text-align:left;cursor:pointer;opacity:.42;transition:opacity .25s ease}
.vomsatz__saetze button::before{content:"";position:absolute;left:0;top:50%;width:13px;height:10px;margin-top:-5px;background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat;opacity:0;transform:scale(.4);transition:opacity .25s ease,transform .3s ease}
.vomsatz__saetze button[aria-pressed=true]{opacity:1}
.vomsatz__saetze button[aria-pressed=true]::before{opacity:1;transform:none}
.vomsatz__saetze button:hover{opacity:.8}
.vomsatz__saetze button:focus-visible{outline:2px solid var(--tinte);outline-offset:3px}
.vomsatz__dahinter{display:inline-block;max-width:100%;padding:.1em .42em .14em .48em;background:var(--rot);color:var(--tinte);font:750 clamp(26px,2.3vw,38px)/1.08 var(--display);letter-spacing:-.012em;border-radius:.62em .8em .7em .74em / .5em .62em .56em .6em}
.vomsatz__frage{font:650 clamp(26px,2.3vw,38px)/1.1 var(--display);letter-spacing:-.01em;text-wrap:balance}
.vomsatz .neu{animation:vomsatz-neu .45s ease}
@keyframes vomsatz-neu{from{opacity:0;transform:translateY(6px)}}
@media (prefers-reduced-motion:reduce){.vomsatz .neu{animation:none}.vomsatz__saetze button,.vomsatz__saetze button::before{transition:none}}
@media (max-width:900px){
  .vomsatz__kopf>*,.vomsatz__spalte{grid-column:1/-1}
  .vomsatz__text{margin-top:var(--s2)}
  .vomsatz__spalte{margin-bottom:var(--s3)}
}
@media (max-width:600px){
  .vomsatz{margin-bottom:48px}
  .vomsatz h2{font-size:clamp(38px,11.4vw,49px)}
  .vomsatz__saetze button{font-size:22px;padding-left:20px}
  .vomsatz__dahinter,.vomsatz__frage{font-size:27px}
}

/* ---------- Neuordnung der Startseite (06.10.2026 Nacht, Simon, Claude und Astra, nach Online-Recherche) ----------
   Reihenfolge: Kehrseite mit Fragezeile, Angebote, So arbeite ich, Über mich, Ablauf, Anfrage. */
/* Fragezeile unter der Kehrseite: Hinweis und Frage teilen sich denselben Platz, damit nichts springt */
.kehrseite__unten{display:grid;margin-top:clamp(14px,1.6vw,22px)}
.kehrseite__unten>*{grid-area:1/1;transition:opacity .35s ease,visibility .35s}
.kehrseite__unten .kehrseite__hinweis{margin:0;align-self:start}
.kehrseite__frage{visibility:hidden;opacity:0}
.kehrseite.mit-frage .kehrseite__hinweis{visibility:hidden;opacity:0}
.kehrseite.mit-frage .kehrseite__frage{visibility:visible;opacity:1}
@media (max-width:700px){.kehrseite__unten{margin-top:10px}}

/* Angebote rücken nach oben, Karten knapp: wann, Ziel, Rahmen, Knopf */
.saeule__warum{margin:0 0 var(--s3);font-size:15px;line-height:1.5}
.saeule__warum div{display:grid;grid-template-columns:3.6em minmax(0,1fr);gap:10px;padding:8px 0;border-top:1px solid var(--haar)}
.saeule__warum dt{font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.65;padding-top:3px}
.saeule__warum dd{margin:0}
.saeule__themen{margin:0 0 var(--s4);font:600 clamp(18px,1.4vw,22px)/1.25 var(--display);letter-spacing:-.003em}
.saeule__themen>span:first-child{display:block;margin-bottom:6px;font:400 var(--t-label)/1.2 var(--text);letter-spacing:.1em;text-transform:uppercase;opacity:.65}
.stimmen--angebote{margin-top:clamp(56px,5vw,88px)}

/* So arbeite ich: ein grosses Bild vom Tisch, ein Tag als Beispiel, zwei Werkzeuge */
.tisch{margin:clamp(32px,3.4vw,56px) 0 0}
.tisch img{display:block;width:100%;height:auto;aspect-ratio:21/9;object-fit:cover;object-position:50% 40%;border-radius:3px}
.tisch figcaption{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);padding-top:var(--s3)}
.tisch figcaption span{grid-column:1/span 4;font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.75}
.tisch figcaption p{grid-column:5/-1;font:600 clamp(20px,1.7vw,28px)/1.2 var(--display)}
.tagbeispiel{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-top:clamp(64px,6vw,104px);padding-top:var(--s4);border-top:1px solid var(--haar-dunkel)}
.tagbeispiel__kopf{grid-column:1/span 5}
.tagbeispiel__kopf h3{margin:var(--s2) 0 var(--s3);font-size:clamp(34px,3vw,48px)}
.tagbeispiel__kopf p:last-child{max-width:40ch;font-size:16px;line-height:1.6;opacity:.9}
.tagbeispiel__schritte{grid-column:7/-1;margin:0;padding:0;list-style:none;counter-reset:tag}
.tagbeispiel__schritte li{counter-increment:tag;display:grid;grid-template-columns:3em minmax(0,1fr);column-gap:var(--s2);padding:var(--s3) 0;border-top:1px solid var(--haar-dunkel)}
.tagbeispiel__schritte li::before{content:counter(tag,decimal-leading-zero);grid-row:span 2;font:500 15px/1.6 var(--display);color:var(--rot)}
.tagbeispiel__schritte strong{font:700 clamp(22px,1.8vw,28px)/1.1 var(--display)}
.tagbeispiel__schritte span{margin-top:6px;font-size:15px;line-height:1.55;opacity:.88;max-width:48ch}
.werkzeuge{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s3);margin-top:clamp(64px,6vw,104px)}
.werkzeug{margin:0}
.werkzeug .kartentrio{width:min(100%,clamp(250px,24vw,340px));margin-inline:auto}
.werkzeug picture img{display:block;width:100%;height:clamp(300px,30vw,425px);object-fit:cover;border-radius:3px}
.werkzeug figcaption{padding-top:var(--s3)}
.werkzeug h3{font-size:clamp(28px,2.4vw,40px);margin:0 0 var(--s2)}
.werkzeug p{max-width:46ch;font-size:16px;line-height:1.6;opacity:.9}
.werkzeuge__dazu{max-width:62ch;margin:var(--s5) 0 0;font-size:16px;line-height:1.6;opacity:.85}
.system2{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-top:clamp(64px,6vw,104px);padding-top:var(--s4);border-top:1px solid var(--haar-dunkel)}
.system2 .klein{grid-column:1/-1;margin-bottom:var(--s2)}
.system2 h3{grid-column:1/span 6;font-size:clamp(36px,3.4vw,56px)}
.system2 p:last-child{grid-column:8/-1;align-self:end;font-size:16px;line-height:1.6;opacity:.9}

/* Über mich: kurz, mit zwei Stimmen */
.vita__mehr{display:flex;flex-wrap:wrap;gap:8px 24px}
.stimmen--zwei{margin-top:clamp(56px,5vw,88px)}

/* Ablauf und häufige Fragen */
.zusammen__kopf{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);align-items:end;margin-bottom:clamp(32px,3.4vw,56px)}
.zusammen__kopf h2{grid-column:1/span 7}
.zusammen__lead{grid-column:8/-1;max-width:40ch;font-size:clamp(16px,1.2vw,18px);line-height:1.55;padding-bottom:.4em}
.zusammen__schritte{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s3);margin:0;padding:0;list-style:none}
.zusammen__schritte li{display:flex;flex-direction:column;gap:8px;padding-top:var(--s3);border-top:1px solid var(--tinte)}
.zusammen__nr{display:grid;place-items:center;width:46px;height:34px;margin-bottom:6px;font:500 15px/1 var(--display);color:var(--tinte);background:var(--rot);-webkit-mask:var(--zeichen) center/100% 100% no-repeat;mask:var(--zeichen) center/100% 100% no-repeat}
.zusammen__schritte strong{font:700 clamp(22px,1.8vw,28px)/1.1 var(--display)}
.zusammen__schritte li>span:last-child{font-size:15px;line-height:1.55;max-width:32ch}
.zusammen__einzel{margin:var(--s4) 0 0;font-size:15px}
.zusammen__unten{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-top:clamp(56px,5vw,88px);align-items:start}
.zusammen__unten .beleg{grid-column:1/span 4;padding-left:var(--s3);border-left:2px solid var(--tinte);font-size:15px;line-height:1.55}
.zusammen__unten .beleg p{margin:0 0 var(--s2)}
.zusammen__unten .beleg a{font-size:14px}
.fragen{grid-column:6/-1}
.fragen h3{margin:0 0 var(--s3);font-size:clamp(28px,2.4vw,40px)}
.fragen details{border-top:1px solid var(--haar)}
.fragen details:last-child{border-bottom:1px solid var(--haar)}
.fragen summary{position:relative;display:block;min-height:44px;padding:14px 40px 14px 0;cursor:pointer;font:600 clamp(18px,1.4vw,22px)/1.3 var(--display);list-style:none}
.fragen summary::-webkit-details-marker{display:none}
.fragen summary::after{content:"+";position:absolute;right:4px;top:12px;font:300 24px/1 var(--text);opacity:.6;transition:transform .25s ease}
.fragen details[open] summary::after{transform:rotate(45deg)}
.fragen details p{margin:0 0 var(--s3);max-width:58ch;font-size:15px;line-height:1.6}
.fragen summary:focus-visible{outline:2px solid var(--tinte);outline-offset:3px}
.anfrage__weg{margin-top:var(--s2);font-size:15px;opacity:.85;max-width:44ch}
@media (max-width:900px){
  .tagbeispiel__kopf,.tagbeispiel__schritte,.system2 h3,.system2 p:last-child,.zusammen__kopf h2,.zusammen__lead,.zusammen__unten .beleg,.fragen{grid-column:1/-1}
  .tagbeispiel__schritte{margin-top:var(--s4)}
  .system2 p:last-child{margin-top:var(--s3)}
  .zusammen__lead{margin-top:var(--s3)}

  .zusammen__unten .beleg{margin-bottom:var(--s5)}
  .werkzeuge{grid-template-columns:1fr}
  .tisch figcaption span,.tisch figcaption p{grid-column:1/-1}
  .tisch figcaption p{margin-top:8px}
}
@media (max-width:600px){
  .tisch img{aspect-ratio:4/3}
  .zusammen__schritte{grid-template-columns:1fr}
  .saeule__warum div{grid-template-columns:3.2em minmax(0,1fr)}
}
.werkzeug__stimmen{margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--haar-dunkel)}
.werkzeug__stimmen blockquote{margin:0 0 var(--s3)}
.werkzeug__stimmen blockquote p{margin:0 0 6px;max-width:46ch;font:600 clamp(18px,1.4vw,22px)/1.3 var(--display);opacity:1}
.werkzeug__stimmen footer{font-size:13px;opacity:.75}
.werkzeug__quelle{font-size:13px;opacity:.75}
.werkzeug__quelle a{color:inherit}
/* Abnahme Astra (52): Rot für kleine Schrift kontrastreicher, Ablauf je Ansicht, Handy zeigt das passende Angebot zuerst */
:root{--rot-text:#BF3119;--rot-text-dunkel:#EE5A42}
.tagbeispiel__schritte li::before{color:var(--rot-text-dunkel)}
.zusammen__nr{font-size:19px;font-weight:700}
.zusammen__wege{display:flex;flex-direction:column;gap:var(--s5)}
.zusammen__fuer{margin:0 0 var(--s3);font-size:var(--t-label);letter-spacing:.1em;text-transform:uppercase;opacity:.86}
.zusammen__weg--einzel .zusammen__einzel{margin:0;max-width:60ch;font-size:16px;line-height:1.6}
.zusammen__weg--einzel{padding-top:var(--s3);border-top:1px solid var(--tinte)}
html[data-umfeld="ich"] .zusammen__weg--einzel{order:-1}
@media (max-width:900px){html[data-umfeld="ich"] #coaching{order:-1}}

/* Einordnung im Kopf: leise, gleiche Höhe wie der Hinweis (Simon 07.10.: Frage im Kopf war zu viel) */
.kehrseite__lesart{margin:0;min-height:44px;display:flex;align-items:center;font-size:14px;letter-spacing:.01em;color:color-mix(in srgb,var(--tinte) 84%,var(--papier))}
@media (max-width:700px){.kehrseite__lesart{font-size:13px}}
/* «Ich frage nach.» in «So arbeite ich»: der zuletzt gedrehte Satz und meine Frage dazu */
.nachfragen{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--s3);margin-top:clamp(64px,6vw,104px);padding-top:var(--s4);border-top:1px solid var(--haar-dunkel)}
.nachfragen__kopf{grid-column:1/span 5}
.nachfragen__kopf h3{margin:var(--s2) 0 var(--s3);font-size:clamp(34px,3vw,48px)}
.nachfragen__kopf p:last-child{max-width:40ch;font-size:16px;line-height:1.6;opacity:.9}
.nachfragen__paar{grid-column:7/-1;align-self:end}
.nachfragen__paar p>span:first-child{display:block;margin-bottom:8px;font:400 var(--t-label)/1.2 var(--text);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.nachfragen__gesagt{margin:0 0 var(--s4);font:650 clamp(22px,1.8vw,30px)/1.15 var(--display);opacity:.75}
.nachfragen__frage{margin:0;font:700 clamp(30px,2.8vw,46px)/1.08 var(--display);letter-spacing:-.01em;text-wrap:balance}
@media (max-width:900px){.nachfragen__kopf,.nachfragen__paar{grid-column:1/-1}.nachfragen__paar{margin-top:var(--s4)}}
/* Auswahl bei den Angeboten als Satz in der Stimme der Besucherin (Simon 07.10.2026): normale Schreibweise, gut lesbar */
#angebote .kapitel__wahl,#angebote .kapitel__wahl button,#angebote .kapitel__wahl select{text-transform:none;letter-spacing:0}
#angebote .kapitel__wahl-titel{opacity:.85;font-size:15px}
#angebote .kapitel__knoepfe button{font-size:15px}
@media (max-width:900px){#angebote .kapitel__wahl-titel{font-size:14px}#angebote .kapitel__auswahl select{font-size:16px}}