/* EAF-CI für den Verbrauchsweg (verbrauch.html). Quelle: 01_Firmen/06_CIs/03_EAF (Leitfaden, farbpalette.css).
   Gerundet wie Tabler: Knopf/Feld 6 px, Karte 10 px. Inter 400/500/700, IBM Plex Mono für Überzeilen.
   Fokus: Rahmen wird Petrol, kein Schein. Nur Gestaltung – Aufbau, Texte und Verhalten der Seite bleiben unverändert.
   Selektoren mit Präfix html, weil das Portal seine Stile zur Laufzeit nachlädt. Einbindung: <link rel="stylesheet" href="./eaf-ci-verbrauch.css">; Schriften unter ./fonts/. */
@font-face{font-family:"Inter";src:url("./fonts/inter-variable-latin.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("./fonts/ibm-plex-mono-v20-latin-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}

html body{background:var(--site-band-bg)}
html .probe{background:var(--brand-primary-soft);color:var(--brand-primary-text);font:500 13px/1.4 Inter,system-ui,sans-serif;padding:10px 24px}
html .probe a{color:var(--brand-primary-text)}

html .ea-verbrauch{
  font:400 16px/1.4 Inter,system-ui,sans-serif;margin:24px auto;border:1px solid var(--site-card-border);border-radius:10px}
html .ea-verbrauch h1,html .ea-verbrauch h2,html .ea-verbrauch h3{font-weight:700;color:var(--site-text);letter-spacing:-.01em}
html .ea-verbrauch h1{font-size:clamp(1.65rem,3vw,2.15rem);line-height:1.15}
html .ea-kennung{font-family:"IBM Plex Mono",ui-monospace,monospace;font-weight:600;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-primary-text)}
html .ea-kopf>p:last-child,html .ea-schrittstand{color:var(--site-secondary-text)}
html .ea-schrittstand{font-size:14px}

/* Schrittleiste */
html .ea-fortschritt li{border-bottom:2px solid var(--site-divider);color:var(--site-secondary-text);font-weight:500;font-size:15px;padding:10px 6px}
html .ea-fortschritt li[aria-current="step"]{border-color:var(--brand-primary);color:var(--brand-primary-text);font-weight:600}
html .ea-schrittnummer{border:1px solid var(--site-card-border);border-radius:6px;background:var(--site-card-bg);color:var(--site-secondary-text);font-size:13px;font-weight:600;font-variant-numeric:tabular-nums}
html .ea-fortschritt li[aria-current="step"] .ea-schrittnummer{background:var(--brand-primary);border-color:var(--brand-primary);color:var(--brand-on-primary)}

/* Felder */
html .ea-feld>label,html .ea-feld legend,html .ea-feldgruppe legend{font-weight:500;color:var(--site-text);font-size:15px}
html .ea-feld input:not([type="checkbox"]),html .ea-feld select,html .ea-ausgabe{border:1px solid var(--site-field-border);border-radius:6px;min-height:44px;padding:9px 12px;color:var(--site-text);background:var(--site-card-bg)}
html .ea-feld input:not([type="checkbox"]):hover,html .ea-feld select:hover{border-color:var(--site-secondary-text)}
html .ea-feld input:focus-visible,html .ea-feld select:focus-visible,html .ea-feld input:focus,html .ea-feld select:focus{outline:none;border-color:var(--brand-primary)}
html .ea-feld [aria-invalid="true"]{box-shadow:none;border-color:var(--site-error)!important}
html .ea-ausgabe{background:var(--site-deep-bg);border-color:var(--site-card-border);color:var(--site-body-text)}
html .ea-feldfehler{color:var(--site-error);font-size:14px}
html .ea-auswahl input{accent-color:var(--brand-primary)}
html .ea-feldgruppe{border:1px solid var(--site-card-border);border-radius:10px;padding:16px;background:var(--site-card-bg)}
html .ea-zusatz,html .ea-pruefung,html .ea-hinweis{border-radius:10px;background:var(--brand-primary-soft);color:var(--site-text)}
html .ea-sperre{border:1px solid var(--site-card-border);border-radius:10px;background:var(--site-band-bg)}

/* Fehlerliste */
html .ea-fehlerliste:not(:empty){border:1px solid var(--site-error-border);border-left:1px solid var(--site-error-border);border-radius:10px;background:var(--site-error-bg);padding:16px 20px}
html .ea-fehlerliste h3{font-size:16px;color:var(--site-error)}
html .ea-fehlerliste a{color:var(--site-error)}

/* Knöpfe */
html .ea-verbrauch button{border-radius:6px;font-weight:600;font-size:15px;min-height:44px;padding:10px 18px}
html .ea-primaer{background:var(--brand-primary);border-color:var(--brand-primary);color:var(--brand-on-primary)}
html .ea-primaer:hover{background:var(--brand-primary-hover);border-color:var(--brand-primary-hover)}
html .ea-sekundaer{background:var(--site-card-bg);border-color:var(--site-field-border);color:var(--site-text)}
html .ea-sekundaer:hover{border-color:var(--brand-primary);color:var(--brand-primary-text)}
html .ea-verbrauch button:focus-visible{outline:1px solid var(--brand-primary);outline-offset:2px}
html .ea-verbrauch button:disabled{background:var(--site-deep-bg);border-color:var(--site-card-border);color:var(--site-faint-text)}

/* Ergebnis */
html .ea-projekt{border-top:1px solid var(--site-divider)}
html .ea-ergebnis{background:var(--site-card-bg);border:1px solid var(--site-card-border);border-radius:10px;padding:24px}
html .ea-kennzahl{border-bottom:1px solid var(--site-divider)}
html .ea-kennzahl dt{color:var(--site-secondary-text);font-size:14px;font-weight:500}
html .ea-kennzahl strong{font-weight:700;letter-spacing:-.01em}
html .ea-ergebnis-stand{background:var(--brand-primary-soft);border-left:0;border-radius:6px;color:var(--site-text)}
html .ea-projekt-fehler{border-left:0;padding:10px 12px;background:var(--site-error-bg);border-radius:6px}
html .ea-projekt summary{color:var(--brand-primary-text);font-weight:500}