/* RUDEL Flow, Nacht: dark-first auf allen Seiten (14.10.2026)
   Grundsatz nach Recherche (Linear/Vercel-Stil): dunkler Grund in feinen
   Ebenen, Haarlinien, Leuchtverläufe. Hell bleiben nur gezielte
   "Produktfenster" (Vorgangskarte, Baudoku-Demo, Diagramm, Formular,
   Rechtstext), gedämpft statt weiß. Wird als letztes Stylesheet geladen. */
:root{
  --papier:#E3E8EF;      /* helle Produktfenster, gedämpft */
  --grund:#D6DDE6;       /* Flächen innerhalb der Fenster */
  --weiss:#E3E8EF;
  --offwhite:#D6DDE6;
  --linie:#C9D1DC;
  --line:#C9D1DC;
  --ebene-0:#0B0F15;
  --ebene-1:#0D1117;
  --ebene-2:#10151D;
  --glas:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02));
  --glas-rand:rgba(255,255,255,.09);
}
body{background:var(--ebene-1);color:var(--auf-dunkel)}

/* ---------- Ebenen der Abschnitte ---------- */
#vorgang,.fragen,#einsparung{background:var(--ebene-0)}
#beispielprozess,.preise{background:var(--ebene-2)}
#vorgang,#beispielprozess,#einsparung,.preise,.fragen,.weiss,.rechtstext-flaeche{border:0;border-top:1px solid rgba(255,255,255,.05)}
#vorgang::before{background:radial-gradient(circle,rgba(37,99,235,.16),transparent 65%)}
#beispielprozess::before{background:
    radial-gradient(720px 420px at 85% 18%,rgba(37,99,235,.18),transparent 70%),
    radial-gradient(520px 360px at 8% 92%,rgba(200,122,58,.12),transparent 70%),
    linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px) 0 0/44px 44px,
    linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px) 0 0/44px 44px}
#einsparung::before{background:radial-gradient(circle,rgba(37,99,235,.16),transparent 65%)}
.preise::before{background:
    radial-gradient(680px 440px at 50% 45%,rgba(37,99,235,.18),transparent 70%),
    radial-gradient(420px 300px at 88% 85%,rgba(200,122,58,.12),transparent 70%)}
.fragen{position:relative;overflow:hidden;isolation:isolate}
.fragen::before{content:"";position:absolute;width:700px;height:700px;left:-260px;bottom:-260px;z-index:-1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(200,122,58,.10),transparent 65%)}

/* ---------- Typografie auf Dunkel ---------- */
.kopfzeile h2,.section .section-head h2,.schritt h3,.kachel h3,.preis h3,.zusage h3,.fragen .faq summary,.pfad h3,.technik h2{color:#fff}
.kopf-text,.section .section-head .lead,.section .section-head .esp-intro,.fragen .fragen-hinweis,.schritt p,.pfad p,.kachel p{color:var(--auf-dunkel-2)}
.vorzeile--blau,.section .section-head .eyebrow,.section .eyebrow{color:var(--blau-hell)}
.akzent{background-image:linear-gradient(90deg,var(--blau-hell),#9DB8FF 55%,var(--kupfer-hell))}
.fragen .fragen-hinweis a{color:var(--blau-hell)}

/* ---------- Helle Produktfenster: Schrift wieder dunkel ---------- */
.karte,.dk,.esp-card,.cform,.formular,.rechtstext{color:var(--text)}
.karte,.dk,.esp-card,.rechtstext{box-shadow:0 0 0 1px rgba(255,255,255,.06),0 40px 100px -40px rgba(37,99,235,.55),0 30px 60px -30px rgba(0,0,0,.8)}
#einsparung .esp-card{background:var(--papier);border-color:transparent}
.rechtstext h2{color:var(--text)}

/* ---------- Vier Schritte ---------- */
.schritt-nr{background:var(--ebene-2);border-color:var(--linie-dunkel);color:var(--auf-dunkel-2)}
.schritte::before{background:rgba(255,255,255,.1)}
@media (max-width:980px){.schritt{background:var(--ebene-0)}}

/* ---------- Glaskarten ---------- */
.kachel,.preis,#beispielprozess .dk-stats li,.fragen .faq details,.bausteine li{background:var(--glas);border:1px solid var(--glas-rand);color:var(--auf-dunkel)}
.weiss .kachel{background:var(--glas)}
.kachel-ico{background:rgba(91,140,255,.14);color:var(--blau-hell)}
.kachel--kupfer .kachel-ico{background:rgba(200,122,58,.16);color:var(--kupfer-hell)}
.kachel-zahl{color:var(--blau-hell)}
.kachel--kupfer .kachel-zahl{color:var(--kupfer-hell)}
.kachel:hover,.preis:hover{box-shadow:0 30px 60px -30px rgba(0,0,0,.9),0 0 0 1px rgba(91,140,255,.25)}
.bausteine li{color:#fff}
#beispielprozess .dk-stats b{color:#fff}
#beispielprozess .dk-stats span{color:var(--auf-dunkel-2)}
#beispielprozess .ba-note,.preis-hinweis{color:var(--text-3)}

/* Preise */
.preis{backdrop-filter:none;-webkit-backdrop-filter:none}
.preis-schritt{color:var(--auf-dunkel-2)}
.preis-schritt b{background:rgba(91,140,255,.14);color:var(--blau-hell)}
.preis:last-child .preis-schritt b{background:rgba(200,122,58,.16);color:var(--kupfer-hell)}
.preis-betrag{background:linear-gradient(90deg,#fff,#C9D6F2);-webkit-background-clip:text;background-clip:text;color:transparent}
.preis-art{color:var(--text-3)}
.preis ul{border-color:var(--linie-dunkel);color:var(--auf-dunkel-2)}
.preis-knopf{background:rgba(255,255,255,.04);border-color:var(--glas-rand);color:#fff}
.preis-knopf:hover{border-color:var(--blau-hell);color:#fff;background:rgba(37,99,235,.12)}
.preis--mitte{background:linear-gradient(170deg,#172341,#0E1526 65%);border-color:transparent}
.zusage{background:rgba(200,122,58,.08);border-color:rgba(200,122,58,.3)}
.zusage p{color:var(--auf-dunkel-2)}

/* Fragen */
.fragen .faq details:hover{border-color:rgba(91,140,255,.4)}
.fragen .faq details[open]{border-color:rgba(91,140,255,.6);box-shadow:0 0 0 4px rgba(37,99,235,.12),0 24px 50px -24px rgba(37,99,235,.6)}
.fragen .faq summary::after{background-color:rgba(255,255,255,.06)}
.fragen .faq details[open] summary::after{background-color:rgba(200,122,58,.18)}
.fragen .faq p{color:var(--auf-dunkel-2)}

/* ---------- Unterseiten ---------- */
.weiss{background:var(--ebene-2)}
.weiss .pfad-punkt,.pfad-punkt{background:var(--ebene-1)}
.pfad::before{background:rgba(255,255,255,.12)}
.hinweis-box{background:rgba(200,122,58,.08);border:1px solid rgba(200,122,58,.3);color:var(--auf-dunkel-2)}
.rechtstext-flaeche{background:var(--ebene-0)}
.rechtstext .stand{background:var(--grund)}

/* ---------- Baudoku-Demo dunkel (14.10.2026 abends) ----------
   Der helle Kasten war Konstantin auf der dunklen Seite zu grell. Die Demo
   bekommt eigene Werte fuer die Variablen, damit alle Zustaende
   (wartet, arbeitet, erledigt, Sichten) mitziehen. */
#baudoku{
  --text:#E9EDF3;--muted:#9AA4B4;--line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.18);
  --offwhite:rgba(255,255,255,.025);--weiss:rgba(255,255,255,.04);--papier:#121925;
  --blau-soft:rgba(37,99,235,.16);--blau-dark:#8EADFF;
  --kupfer-soft:rgba(200,122,58,.10);--kupfer-text:#E7A877;--graphit:#fff;
  color:var(--text)}
#beispielprozess #baudoku{
  background:linear-gradient(180deg,#141C29,#0F151F) padding-box,
             linear-gradient(135deg,rgba(91,140,255,.45),rgba(255,255,255,.07) 35%,rgba(255,255,255,.07) 65%,rgba(200,122,58,.4)) border-box;
  box-shadow:0 0 0 1px rgba(255,255,255,.03),0 40px 100px -40px rgba(37,99,235,.45),0 30px 60px -30px rgba(0,0,0,.8)}
#baudoku .flow-title{color:var(--auf-dunkel-2)}
#baudoku .flow-replay{border-color:rgba(91,140,255,.35)}
#baudoku .flow-replay:hover{background:rgba(37,99,235,.26)}
#baudoku .dk-cell[data-s="wait"] .dk-wait,#baudoku .dk-frei[data-s="wait"] .dk-frei-wait{color:#6B7586}
#baudoku .dk-skip,#baudoku .dk-cell::before{color:#7A8392}
#baudoku .dk-clock--auto b{color:var(--blau-hell)}
#baudoku .dk-bar::before{background:#9AA4B4}
#baudoku .dk-doc{border-color:rgba(91,140,255,.3)}
#baudoku .dk-doc--sichten,#baudoku .dk-frei,#baudoku .dk-vergleich{border-color:rgba(200,122,58,.35)}
#baudoku .dk-frei[data-s="wait"]{border-color:var(--line-strong)}
#baudoku .dk-vergleich mark{background:rgba(200,122,58,.25)}
#baudoku .dk-btn--zweit{border-color:rgba(200,122,58,.5)}
#baudoku .dk-btn--zweit:hover{background:rgba(200,122,58,.14)}
#baudoku .dk-start{background:rgba(13,17,23,.78)}
#baudoku .dk-rechner input{accent-color:var(--blau-hell)}
#baudoku .proc-foot{border-color:var(--line)}

/* ---------- Lichtschein folgt der Maus auf allen Abschnitten (14.10.2026) ----------
   Wie im Hero, nur etwas schwaecher. Nur mit Maus und ohne "Bewegung
   reduzieren" (Klasse .schein setzt dynamik.js). Liegt unter dem Inhalt. */
.schein{position:relative;isolation:isolate}
.schein::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .5s ease;
  background:radial-gradient(560px circle at var(--sx,50%) var(--sy,50%),rgba(91,140,255,.12),transparent 62%)}
.schein.ist-hell::after{opacity:1}

/* ---------- Vorgangskarte und Diagramm dunkel (14.10.2026 abends) ----------
   Nach dem Demo-Kasten fielen die letzten hellen Fenster stark auf. Gleiches
   Vorgehen wie bei #baudoku: eigene Werte fuer die Variablen. */
#vorgangKarte,#einsparung .esp-card{
  --text:#E9EDF3;--text-2:#9AA4B4;--text-3:#7A8392;--muted:#9AA4B4;
  --linie:rgba(255,255,255,.09);--line:rgba(255,255,255,.08);--line-strong:rgba(255,255,255,.2);
  --grund:rgba(255,255,255,.035);--papier:#121925;--weiss:#121925;--graphit:#fff;
  --blau-zart:rgba(37,99,235,.18);--kupfer-zart:rgba(200,122,58,.14);
  color:var(--text);
  background:linear-gradient(180deg,#141C29,#0F151F) padding-box,
             linear-gradient(135deg,rgba(91,140,255,.45),rgba(255,255,255,.07) 35%,rgba(255,255,255,.07) 65%,rgba(200,122,58,.4)) border-box;
  border:1px solid transparent}
#vorgangKarte .karte-ico{color:var(--blau-hell)}
#vorgangKarte .karte-pdf{background:rgba(220,60,60,.16);color:#FF9A9A}
#vorgangKarte .karte-felder span{border-color:rgba(255,255,255,.14)}
#vorgangKarte[data-schritt="3"] .karte-systeme i,#vorgangKarte[data-schritt="4"] .karte-systeme i{color:var(--blau-hell)}
#vorgangKarte .karte-freigabe{color:#F1D3B8}
#einsparung .esp-hero-label{color:var(--blau-hell)}
#einsparung .esp-hero-value #espHeroVal{background:linear-gradient(90deg,#fff,#9DB8FF 70%,var(--kupfer-hell))}
#einsparung .esp-hero-value #espHeroVal{-webkit-background-clip:text;background-clip:text}
#einsparung .esp-switch{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.1)}
#einsparung .esp-switch button:hover{color:#fff}
#einsparung .esp-switch button[aria-selected="true"]{background:var(--blau);color:#fff}
#einsparung .esp-band{fill:var(--blau-hell);fill-opacity:.16}
#einsparung .esp-line--hi,#einsparung .esp-dot--hi,#einsparung #espCrossHi{stroke:var(--blau-hell)}
#einsparung .esp-dot--hi,#einsparung #espCrossHi{fill:var(--blau-hell)}
#einsparung .esp-line--lo{stroke:var(--kupfer-hell)}
#einsparung .esp-dot--lo,#einsparung #espCrossLo{fill:var(--kupfer-hell)}
#einsparung .esp-table summary{color:var(--blau-hell)}
#einsparung .esp-tip{background:#1A2333;color:var(--text);border-color:rgba(255,255,255,.12)}

/* ---------- Ausbau 14.10.2026 abends: Telefon, Praxis-Liste, Gewerke ---------- */
/* Telefon im Kopf */
.kopf-tel{display:inline-flex;align-items:center;gap:8px;color:var(--auf-dunkel-2);text-decoration:none;font-size:.86rem;font-weight:600;white-space:nowrap;transition:color .2s}
.kopf-tel:hover{color:#fff}
.kopf-tel svg{width:17px;height:17px;color:var(--blau-hell);flex:0 0 auto}
@media (max-width:1280px){.kopf-tel span{display:none}}
@media (max-width:760px){.kopf-tel{display:none}}

/* Telefon im Hero */
.hero-tel{margin-top:16px;color:var(--auf-dunkel-2);font-size:.95rem}
.hero-tel a{color:#fff;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(91,140,255,.6)}
.hero-tel a:hover{border-color:var(--kupfer-hell)}

/* Belegzeile im Hero */
.hero-beleg{margin-top:22px;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.hero-beleg>span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--kupfer-hell);margin-right:4px;display:inline-flex;align-items:center;gap:8px}
.hero-beleg>span i{width:7px;height:7px;border-radius:50%;background:#3FBF7A;box-shadow:0 0 0 3px rgba(63,191,122,.18)}
.hero-beleg a{font-size:.82rem;color:var(--auf-dunkel);text-decoration:none;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.035);transition:border-color .2s,background .2s}
.hero-beleg a:hover{border-color:rgba(91,140,255,.6);background:rgba(37,99,235,.1)}

/* Kontakt: Anruf-Knopf */
.kontakt-anruf{display:inline-flex;align-items:center;gap:10px;margin-top:22px}
.kontakt-anruf svg{width:18px;height:18px}

/* Praxis-Liste, jetzt mit mehreren Abläufen und Status */
.praxis-liste--raster{grid-template-columns:repeat(2,minmax(0,1fr))}
.praxis-liste--raster li:first-child{grid-column:1/-1}
@media (max-width:980px){.praxis-liste--raster{grid-template-columns:minmax(0,1fr)}}
.status-tag{display:inline-flex;align-items:center;gap:7px;margin-top:8px;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:#7FD9A6}
.status-tag i{width:6px;height:6px;border-radius:50%;background:#3FBF7A}
.status-tag--test{color:var(--kupfer-hell)}
.status-tag--test i{background:var(--kupfer-hell)}

/* Gewerke auf der Startseite */
.gewerke-raster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media (max-width:980px){.gewerke-raster{grid-template-columns:minmax(0,1fr)}}
a.gewerk{display:grid;align-content:start;gap:10px;padding:26px;border-radius:var(--radius-gross);background:var(--glas);border:1px solid var(--glas-rand);color:var(--auf-dunkel);text-decoration:none;transition:border-color .25s,transform .25s,box-shadow .25s}
a.gewerk:hover{border-color:rgba(91,140,255,.5);transform:translateY(-3px);box-shadow:0 30px 60px -30px rgba(0,0,0,.9),0 0 0 1px rgba(91,140,255,.25)}
.gewerk h3{color:#fff;font-size:1.2rem}
.gewerk p{color:var(--auf-dunkel-2);font-size:.95rem}
.gewerk-mehr{margin-top:6px;color:var(--blau-hell);font-weight:600;font-size:.9rem}
.gewerk .kachel-ico{margin-bottom:4px}

/* Gewerke-Seiten */
.kacheln--vier{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:760px){.kacheln--vier{grid-template-columns:minmax(0,1fr)}}
.gewerk-hinweis{margin-top:28px;color:var(--text-3);font-size:.9rem;max-width:62em}
.laeuft-text{color:var(--auf-dunkel-2);max-width:46em;margin-bottom:24px}
.laeuft .praxis-liste li{background:var(--glas);border:1px solid var(--glas-rand)}
.laeuft .praxis-liste a{color:var(--blau-hell)}

/* Anrufleiste am Handy */
.anruf-leiste{display:none}
@media (max-width:760px){
  .anruf-leiste{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:60;
    padding:10px max(12px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-right));
    background:rgba(11,15,21,.94);border-top:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
  .anruf-leiste a{display:flex;align-items:center;justify-content:center;gap:8px;min-height:46px;border-radius:12px;font-weight:600;font-size:.95rem;text-decoration:none}
  .anruf-leiste svg{width:18px;height:18px}
  .anruf-leiste .anruf-tel{background:var(--blau);color:#fff}
  .anruf-leiste .anruf-mail{border:1px solid rgba(255,255,255,.16);color:#fff}
  body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
}
@media print{.anruf-leiste{display:none}}
/* Fußzeile: mehr Links, deshalb umbrechen */
.fuss-links{flex-wrap:wrap;gap:8px 20px}
.hero-beleg{margin-top:28px;gap:8px 8px}
.hero-beleg>span{flex-basis:100%;margin:0 0 2px}
.hero-beleg a{font-size:.78rem;padding:5px 11px}
.gewerk .kachel-ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center}
.gewerk .kachel-ico svg{width:22px;height:22px}
#praxis-ablaeufe{grid-template-columns:minmax(0,1fr);align-items:start}
#praxis-ablaeufe h3{font-size:clamp(1.25rem,2vw,1.6rem);max-width:30em}
.praxis-liste--raster li:nth-child(even):last-child{grid-column:1/-1}

/* ---------- Kontaktformular dunkel (14.10.2026 abends) ---------- */
.kontakt .cform{
  --text:#E9EDF3;--muted:#9AA4B4;--weiss:#121925;--kupfer-text:#E7A877;
  color:var(--text);
  background:linear-gradient(180deg,#141C29,#0F151F) padding-box,
             linear-gradient(135deg,rgba(91,140,255,.45),rgba(255,255,255,.07) 35%,rgba(255,255,255,.07) 65%,rgba(200,122,58,.4)) border-box;
  border:1px solid transparent}
.kontakt .cform .field input,.kontakt .cform .field select,.kontakt .cform .field textarea{
  background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14);color:#fff;color-scheme:dark}
.kontakt .cform .field input::placeholder,.kontakt .cform .field textarea::placeholder{color:#6F7988}
.kontakt .cform .field input:hover,.kontakt .cform .field select:hover,.kontakt .cform .field textarea:hover{border-color:rgba(255,255,255,.28)}
.kontakt .cform .field input:focus,.kontakt .cform .field select:focus,.kontakt .cform .field textarea:focus{
  background:rgba(37,99,235,.08);border-color:var(--blau-hell);outline:2px solid rgba(91,140,255,.3)}
.kontakt .cform .field select option{background:#121925;color:#fff}
.kontakt .cform .field input[aria-invalid="true"],.kontakt .cform .field select[aria-invalid="true"],.kontakt .cform .field textarea[aria-invalid="true"]{border-color:#F07A66;background:rgba(240,122,102,.08)}
.kontakt .cform .field-error{color:#FF9C8A}
.kontakt .cform .checkbox a{color:var(--blau-hell)}
.kontakt .cform .checkbox input{accent-color:var(--blau-hell)}
.kontakt .cform-status--ok{background:rgba(63,191,122,.12);color:#9BE3BC;border-color:rgba(63,191,122,.35)}
.kontakt .cform-status--err{background:rgba(240,122,102,.1);color:#FFB4A6;border-color:rgba(240,122,102,.35)}

/* ---------- Fallseite Bauunternehmen (14.10.2026 abends) ---------- */
/* Schematisches Dashboard im Seitenkopf */
.dash{align-self:center;border-radius:var(--radius-gross);padding:22px;color:var(--auf-dunkel);
  background:linear-gradient(180deg,#141C29,#0F151F) padding-box,
             linear-gradient(135deg,rgba(91,140,255,.45),rgba(255,255,255,.07) 35%,rgba(255,255,255,.07) 65%,rgba(200,122,58,.4)) border-box;
  border:1px solid transparent;box-shadow:0 40px 100px -40px rgba(37,99,235,.55),0 30px 60px -30px rgba(0,0,0,.8)}
.dash-kopf{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.08)}
.dash-reiter{font-size:.76rem;font-weight:600;padding:6px 12px;border-radius:999px;color:var(--auf-dunkel-2)}
.dash-reiter.ist-an{background:rgba(37,99,235,.2);color:#fff}
.dash-live{margin-left:auto;display:inline-flex;align-items:center;gap:7px;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:#7FD9A6;font-weight:600}
.dash-live i{width:7px;height:7px;border-radius:50%;background:#3FBF7A;animation:puls-gruen 2s infinite}
.dash-titel{margin-top:18px;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--blau-hell)}
.dash-balken{display:grid;gap:9px;margin-top:14px}
.dash-balken li{display:grid;grid-template-columns:118px minmax(0,1fr);gap:12px;align-items:center;font-size:.8rem;color:var(--auf-dunkel-2)}
.dash-balken b{display:block;height:12px;border-radius:6px;width:var(--w);
  background:linear-gradient(90deg,var(--blau),var(--blau-hell));transform-origin:left;animation:dash-wachsen 1.1s cubic-bezier(.2,.7,.2,1) both}
.dash-balken li:nth-child(2) b{animation-delay:.08s}.dash-balken li:nth-child(3) b{animation-delay:.16s}
.dash-balken li:nth-child(4) b{animation-delay:.24s}.dash-balken li:nth-child(5) b{animation-delay:.32s}
.dash-balken li:nth-child(6) b{animation-delay:.4s;background:linear-gradient(90deg,var(--kupfer),var(--kupfer-hell))}
@keyframes dash-wachsen{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.dash-balken b{animation:none}}
.dash-kacheln{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:18px}
.dash-kacheln p{display:grid;gap:10px;align-content:space-between;padding:12px;border-radius:12px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.07)}
.dash-kacheln small{font-size:.68rem;line-height:1.35;color:var(--auf-dunkel-2)}
.dash-ampel{display:flex;gap:5px}
.dash-ampel i{width:10px;height:10px;border-radius:50%;background:#3FBF7A}
.dash-ampel i:nth-child(2){background:#3FBF7A}.dash-ampel i:nth-child(3){background:var(--kupfer-hell)}
.dash-striche{display:flex;gap:4px;align-items:flex-end;height:18px}
.dash-striche i{width:7px;border-radius:2px;background:rgba(91,140,255,.7)}
.dash-striche i:nth-child(1){height:60%}.dash-striche i:nth-child(2){height:100%}.dash-striche i:nth-child(3){height:40%}.dash-striche i:nth-child(4){height:75%}
.dash-ring{width:22px;height:22px;border-radius:50%;background:conic-gradient(var(--blau-hell) 0 45%,var(--kupfer-hell) 0 70%,rgba(255,255,255,.25) 0);
  -webkit-mask:radial-gradient(circle,transparent 5px,#000 6px);mask:radial-gradient(circle,transparent 5px,#000 6px)}
.dash-fuss{margin-top:14px;font-size:.72rem;color:var(--text-3)}
@media (max-width:480px){.dash{padding:16px}.dash-balken li{grid-template-columns:92px minmax(0,1fr)}.dash-kacheln{grid-template-columns:minmax(0,1fr)}}

/* Kennzahlen-Band */
.fall-zahlen-band{padding-block:clamp(28px,4vw,44px)}
.fall-zahlen{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.fall-zahlen li{padding:20px;border-radius:var(--radius);background:var(--glas);border:1px solid var(--glas-rand)}
.fall-zahlen b{display:block;font-size:clamp(2rem,3.4vw,2.8rem);font-weight:700;letter-spacing:-.04em;line-height:1;
  background:linear-gradient(90deg,#fff,#9DB8FF 60%,var(--kupfer-hell));-webkit-background-clip:text;background-clip:text;color:transparent}
.fall-zahlen span{display:block;margin-top:8px;color:var(--auf-dunkel-2);font-size:.9rem}
@media (max-width:980px){.fall-zahlen{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Drei Bereiche */
.fall-bereiche{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}
@media (max-width:1100px){.fall-bereiche{grid-template-columns:minmax(0,1fr)}}
.fall-bereich-h{display:flex;align-items:center;gap:12px;color:#fff;font-size:1.25rem;margin-bottom:14px}
.fall-bereich-h span{font-size:.8rem;font-weight:700;color:var(--kupfer-hell);padding:5px 9px;border-radius:8px;background:rgba(200,122,58,.14)}
.fall-bereiche .praxis-liste li{background:var(--glas);border:1px solid var(--glas-rand)}

/* Startseite: Kennzahlen im Praxis-Block */
.praxis-kennzahlen{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.praxis-kennzahlen li{display:flex;align-items:baseline;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);color:var(--auf-dunkel-2);font-size:.86rem}
.praxis-kennzahlen b{font-size:1.15rem;color:#fff;font-weight:700}
#praxis-ablaeufe .mehr-link{display:inline-block;margin-top:14px}
.pfadleiste a+a::before{content:"/";margin-right:6px;color:var(--text-3)}
@media (max-width:480px){.dash-balken li{grid-template-columns:104px minmax(0,1fr);font-size:.74rem}}

/* ---------- Praxis-Umbau Startseite (14.10.2026 abends) ---------- */
.praxis .dash{width:100%}
.praxis .fall{margin-top:22px}
.praxis-zweit{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:18px;align-items:center;margin-top:clamp(36px,5vw,56px);
  padding:20px 24px;border-radius:var(--radius-gross);background:var(--glas);border:1px solid var(--glas-rand);color:var(--auf-dunkel);text-decoration:none;
  transition:border-color .25s,transform .25s}
.praxis-zweit:hover{border-color:rgba(91,140,255,.5);transform:translateY(-2px)}
.praxis-zweit-text small{display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--kupfer-hell);font-weight:600}
.praxis-zweit-text b{display:block;margin-top:4px;color:#fff;font-weight:600}
.praxis-zweit-zahl{display:grid;font-size:.8rem;color:var(--auf-dunkel-2);text-align:right}
.praxis-zweit-zahl b{font-size:1.5rem;font-weight:700;letter-spacing:-.03em;color:#fff}
.praxis-zweit-mehr{color:var(--blau-hell);font-weight:600;font-size:.9rem;white-space:nowrap}
@media (max-width:760px){
  .praxis-zweit{grid-template-columns:auto minmax(0,1fr);padding:18px}
  .praxis-zweit-zahl{text-align:left;grid-column:2}
  .praxis-zweit-mehr{grid-column:2}
}
.praxis .fall>div{grid-template-columns:minmax(0,1fr);gap:4px}

/* ---------- Seite E-Rechnung (14.10.2026 abends) ---------- */
.frist-datum{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--kupfer-hell);margin-bottom:6px}
.faq-e{display:grid;gap:12px;max-width:860px}
.faq-e details{border-radius:var(--radius);background:var(--glas);border:1px solid var(--glas-rand);padding:18px 22px}
.faq-e details[open]{border-color:rgba(91,140,255,.5)}
.faq-e summary{cursor:pointer;color:#fff;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq-e summary::-webkit-details-marker{display:none}
.faq-e summary::after{content:"+";color:var(--blau-hell);font-weight:700}
.faq-e details[open] summary::after{content:"–"}
.faq-e p{margin-top:10px;color:var(--auf-dunkel-2)}
.e-hinweis{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px;align-items:center;margin-top:18px;padding:16px 22px;
  border-radius:var(--radius-gross);text-decoration:none;color:var(--auf-dunkel-2);
  background:linear-gradient(90deg,rgba(200,122,58,.12),rgba(200,122,58,.03));border:1px solid rgba(200,122,58,.35);transition:border-color .25s,transform .25s}
.e-hinweis:hover{border-color:var(--kupfer-hell);transform:translateY(-2px)}
.e-hinweis b{color:#fff;font-weight:600}
.e-hinweis-marke{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--kupfer-hell);padding:5px 10px;border-radius:999px;background:rgba(200,122,58,.16);white-space:nowrap}
.e-hinweis-pfeil{color:var(--kupfer-hell);font-weight:700}
@media (max-width:760px){.e-hinweis{grid-template-columns:minmax(0,1fr)}.e-hinweis-marke{justify-self:start}.e-hinweis-pfeil{display:none}}