/* ==========================================================================
   GÜTTLER Händlerportal  ·  „Heritage Precision“ (lädt nur auf /haendler/…)
   --------------------------------------------------------------------------
   Ergänzt tokens.css → base.css → mega.css → theme.css des Themes. Nur Tokens, keine neuen Farben; Rot nur als
   Signal (ein Primär-Knopf je Ansicht, aktive Navigation, Eyebrow-Strich, Punkt „Aktualisiert“, aktueller Schritt).
   Lädt im Kopf VOR theme.css/base.css: wo eine Regel eine Theme-Klasse ändert, steht sie mit doppelter Klasse.
   Komponenten des Themes werden wiederverwendet: .btn(--primary/--dark/--ghost/--soft/--link), .btn-round,
   .chip(--solid/--mono/--placeholder), .eyebrow, .field/.input/.select/.textarea/.check, .stretched-link,
   .u-visually-hidden, .theme-dark. Muster (--pattern-prism) nur auf Metallkarten.

   H1 Rahmen, Seitenkopf     H6 Dokumentliste, Suche     H11 Fehlerübersicht
   H2 Raster, Navigation     H7 Karten aus Dokumenten    H12 Konto
   H3 Kontoleiste, Abschnitt H8 Meldungen               H13 Hinweis 403/404, Platzhalter
   H4 Bereichs-Kacheln       H9 Panels, Zugang, Info     H14 Kontakt, Aktuelles
   H5 Startseite unten       H10 Formulare, Schritte     H15 Bewegung, Kontrast, Druck
   ========================================================================== */


/* H1  Rahmen, Seitenkopf ------------------------------------------------------ */
.haendler {
  --haendler-sticky-top: calc(var(--header-offset) + var(--space-4));
  --haendler-panel-pad: clamp(1.25rem, 0.9rem + 1.6vw, 2.25rem);
}
.seitenkopf.seitenkopf--haendler {   /* doppelte Klasse: haendler.css lädt vor theme.css */
  padding-top: calc(var(--header-offset) + clamp(2rem, 1rem + 3.2vw, 4rem));
  padding-bottom: clamp(2rem, 1.25rem + 2.4vw, 3.5rem);
}
.seitenkopf--haendler .eyebrow.seitenkopf__eyebrow { margin-bottom: var(--space-4); }
.seitenkopf--haendler .seitenkopf__titel {
  max-width: 24ch;
  font-size: clamp(2rem, 1.35rem + 2.8vw, 3.75rem);
  hyphens: manual;
}
.seitenkopf--haendler .seitenkopf__titel .t-ghost { overflow-wrap: anywhere; }
.seitenkopf--haendler .seitenkopf__lead { margin-top: var(--space-5); max-width: 62ch; font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); }

.haendler__inhalt { padding-bottom: var(--section-y); }
/* Mobile Schnellleiste des Themes (Händler · Anrufen · Konfigurator) im Portal aus: kein zweiter roter Knopf neben
   „Anmelden“, keine verdeckten Download-Zeilen. Anrufen steht im Portal in der Kontaktkarte. */
body.guettler-haendler .bottom-bar { display: none; }
body.guettler-haendler:has(> .bottom-bar) { padding-bottom: 0; }
.haendler__ueberschrift {
  margin: 0;
  font-size: clamp(1.375rem, 1.2rem + 0.75vw, 1.875rem);
  line-height: 1.15;
  letter-spacing: var(--tracking-h3);
  font-weight: var(--fw-medium);
}
.haendler__ueberschrift--klein { font-size: clamp(1.25rem, 1.15rem + 0.4vw, 1.5rem); }


/* H2  Raster, Navigation -------------------------------------------------------- */
.haendler__raster { display: grid; gap: var(--space-6); align-items: start; }
@media (min-width: 1024px) {
  .haendler__raster { grid-template-columns: 16.5rem minmax(0, 1fr); gap: clamp(2rem, 0.5rem + 2.6vw, 4rem); }
}
@media (min-width: 1440px) {
  .haendler__raster { grid-template-columns: 17.5rem minmax(0, 1fr); }
}
.haendler__haupt { min-width: 0; }

.haendler-nav {
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-xs);
}
@media (min-width: 1024px) {
  .haendler-nav {
    position: sticky;
    top: var(--haendler-sticky-top);
    max-height: calc(100vh - var(--haendler-sticky-top) - var(--space-4));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
  }
}
.haendler-nav__kopfzeile {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  padding: var(--space-4) var(--space-4) var(--space-4) var(--space-4);
  border-bottom: 1px solid var(--color-divider);
}
.haendler-nav__konto { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.haendler-nav__plakette {
  display: grid;
  place-items: center;
  flex: none;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--surface-metal);
  color: var(--color-text);
}
.haendler-nav__plakette .icon { width: 1.125rem; height: 1.125rem; }
.haendler-nav__wer { display: grid; gap: 0.125rem; min-width: 0; }
.haendler-nav__firma {
  font-family: var(--font-display);
  font-size: 0.9375rem;
  font-weight: var(--fw-semibold);
  line-height: 1.25;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}
.haendler-nav__rolle {
  color: var(--color-text-subtle);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  line-height: 1.35;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
}
.haendler-nav__inhalt { padding: var(--space-3); }
.haendler-nav__kopf {
  margin: var(--space-2) var(--space-3) var(--space-2);
  color: var(--color-text-subtle);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
}
.haendler-nav__liste { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; }
.haendler-nav__liste--konto { margin-top: var(--space-3); padding-top: var(--space-3); border-top: 1px solid var(--color-divider); }
.haendler-nav__link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 2.5rem;
  padding: 0.5rem 0.75rem;
  border-radius: var(--radius-sm);
  color: var(--color-text-muted);
  font-size: 0.9375rem;
  line-height: 1.3;
  text-decoration: none;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.haendler-nav__link:hover { background: var(--color-bg); color: var(--color-text); }
.haendler-nav__link:focus-visible { outline-offset: -2px; }
.haendler-nav__link--aktiv { background: var(--color-bg); color: var(--color-text); font-weight: var(--fw-medium); }
.haendler-nav__link--aktiv::before {   /* rote Linie wie der aktive Menüpunkt */
  content: "";
  position: absolute;
  left: 0;
  top: 0.625rem;
  bottom: 0.625rem;
  width: 2px;
  border-radius: 2px;
  background: var(--color-accent);
}
.haendler-nav__text { min-width: 0; }
.haendler-nav__anzahl,
.haendler-nav__symbol { flex: none; color: var(--color-text-subtle); font-family: var(--font-mono); font-size: 0.6875rem; font-variant-numeric: tabular-nums; }
.haendler-nav__symbol .icon { width: 0.9375rem; height: 0.9375rem; }
.haendler-nav__link--aktiv .haendler-nav__anzahl { color: var(--color-text); }

/* Schalter „Bereiche“ (nur unter 1024 px, von haendler.js sichtbar gemacht) */
.haendler-nav__schalter {
  display: inline-flex;
  align-items: center;
  gap: 0.625rem;
  flex: none;
  min-height: var(--tap-min);
  max-width: 58%;
  padding: 0.25rem 0.375rem 0.25rem 0.875rem;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-pill);
  background: var(--color-bg-raised);
  color: var(--color-text);
  text-align: left;
  cursor: pointer;
  transition: border-color var(--dur-fast);
}
.haendler-nav__schalter:hover { border-color: var(--color-text); }
.haendler-nav__schalter-text { display: grid; min-width: 0; line-height: 1.2; }
.haendler-nav__schalter-label { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: 0.625rem; letter-spacing: var(--tracking-label); text-transform: uppercase; }
.haendler-nav__schalter-aktuell { overflow: hidden; font-size: 0.875rem; font-weight: var(--fw-medium); text-overflow: ellipsis; white-space: nowrap; }
.haendler-nav__schalter-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 2rem;
  height: 2rem;
  border-radius: var(--radius-round);
  background: var(--graphite-900);
  color: #fff;
  transition: transform var(--dur-base) var(--ease-out);
}
.haendler-nav__schalter-icon .icon { width: 1rem; height: 1rem; }
.haendler-nav__schalter[aria-expanded="true"] .haendler-nav__schalter-icon { transform: rotate(180deg); }
@media (min-width: 1024px) { .haendler-nav__schalter { display: none !important; } }
@media (max-width: 1023.98px) {
  .haendler-nav__kopfzeile { flex-wrap: wrap; padding: var(--space-3); }
  .haendler-nav__konto { flex: 1 1 12rem; padding-inline: var(--space-1); }
  .haendler-nav__plakette { width: 2.25rem; height: 2.25rem; }
  .haendler-nav__schalter { flex: 1 1 100%; max-width: none; justify-content: space-between; }
  .haendler-nav[data-zu] .haendler-nav__inhalt { display: none; }
  .haendler-nav[data-zu] .haendler-nav__kopfzeile { border-bottom: 0; }
  .haendler-nav__inhalt { padding-top: var(--space-2); }
  .haendler-nav__kopf { display: none; }
  .haendler-nav__liste:not(.haendler-nav__liste--konto) { grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); column-gap: var(--space-2); }
}


/* H3  Kontoleiste (Start), Abschnitt ---------------------------------------------- */
.haendler-leiste {
  display: flex;
  flex-wrap: nowrap; /* ab 1100 px eine Zeile – lange Firmennamen brechen im Kontoblock um, nicht die Leiste */
  align-items: center;
  gap: var(--space-4) clamp(1.5rem, 1rem + 2vw, 3rem);
  margin-bottom: clamp(2.5rem, 1.75rem + 2.5vw, 4rem);
  padding: var(--space-4) var(--space-4) var(--space-4) var(--space-4);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-xs);
}
.haendler-leiste__konto { display: flex; flex: 0 1 auto; align-items: center; gap: var(--space-3); min-width: 0; }
.haendler-leiste__zugang, .haendler-leiste__aktionen { flex-shrink: 0; }
.haendler-leiste__wer, .haendler-leiste__zugang { display: grid; gap: 0.125rem; margin: 0; min-width: 0; }
.haendler-leiste__label { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: var(--tracking-label); text-transform: uppercase; }
.haendler-leiste__firma { font-family: var(--font-display); font-size: 1rem; font-weight: var(--fw-semibold); line-height: 1.25; overflow-wrap: anywhere; }
.haendler-leiste__rolle { font-size: 0.9375rem; font-weight: var(--fw-medium); line-height: 1.3; }
.haendler-leiste__zugang { padding-left: clamp(1.5rem, 1rem + 2vw, 3rem); border-left: 1px solid var(--color-divider); }
.haendler-leiste__zugang--zahl .haendler-leiste__rolle { font-variant-numeric: tabular-nums; }
.haendler-leiste__aktionen { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-left: auto; }
/* Unter 1100 px passt die Leiste nicht mehr in eine Zeile: Raster statt Umbruch (sonst bleibt die Trennlinie links
   am umgebrochenen Block hängen) – Konto über die volle Breite, darunter die Angaben mit Linie oben, dann die Knöpfe. */
@media (max-width: 1099.98px) {
  .haendler-leiste { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; gap: var(--space-4); }
  .haendler-leiste__konto { grid-column: 1 / -1; }
  .haendler-leiste__zugang { padding-left: 0; border-left: 0; padding-top: var(--space-3); border-top: 1px solid var(--color-divider); }
  .haendler-leiste__aktionen { grid-column: 1 / -1; margin-left: 0; }
}
@media (max-width: 767.98px) {
  .haendler-leiste__aktionen .btn { flex: 1 1 0; }
}

.haendler-abschnitt + .haendler-abschnitt,
.haendler-platzhalter + .haendler-abschnitt,
.haendler-abschnitt + .haendler-kontakt,
.haendler-platzhalter + .haendler-kontakt { margin-top: clamp(2.5rem, 1.75rem + 2.5vw, 4rem); }
.haendler-abschnitt__kopf {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2) var(--space-4);
  margin-bottom: var(--space-6);
}
.haendler-abschnitt__notiz { margin: 0; color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: var(--tracking-label); text-transform: uppercase; }


/* H4  Bereichs-Kacheln (wie .sx-card) ------------------------------------------- */
.haendler-karten { display: grid; gap: var(--gap); margin: 0; padding: 0; list-style: none; }
@media (min-width: 600px) { .haendler-karten { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .haendler-karten { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1280px) { .haendler--start .haendler-karten { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .haendler-karten--zwei { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.haendler-karte {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  min-height: clamp(12rem, 10rem + 4vw, 14.5rem);
  padding: var(--card-pad);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-2xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out), border-color var(--dur-slow);
}
.haendler-karte:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); border-color: transparent; }
.haendler-karte__kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-3); }
.haendler-karte__icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 2.75rem;
  height: 2.75rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--surface-metal);
  color: var(--color-text);
}
.haendler-karte__icon .icon { width: 1.25rem; height: 1.25rem; }
.haendler-karte__num { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: var(--tracking-label); font-variant-numeric: tabular-nums; }
.haendler-karte__titel {
  margin: 0;
  font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem);
  font-weight: var(--fw-semibold);
  line-height: 1.2;
  letter-spacing: var(--tracking-h3);
  hyphens: auto;   /* lange Wörter wie „Überbrückungsmaschinen“ in schmalen Kacheln */
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}
.haendler-karte__link { color: inherit; text-decoration: none; }
.haendler-karte__text { margin: 0; color: var(--color-text-muted); font-size: 0.9375rem; line-height: 1.5; }
.haendler-karte__fuss {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-top: auto;
  padding-top: var(--space-4);
}
.haendler-karte__anzahl { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: 0.06em; text-transform: uppercase; font-variant-numeric: tabular-nums; }
.haendler-karte__pfeil { transition: background-color var(--dur-base), color var(--dur-base), border-color var(--dur-base); }
.haendler-karte:hover .haendler-karte__pfeil,
.haendler-karte:focus-within .haendler-karte__pfeil { background: var(--graphite-900); border-color: var(--graphite-900); color: #fff; }
.haendler-karte .stretched-link::after { border-radius: var(--radius-2xl); }
@media (max-width: 599.98px) {
  /* Telefon: kompakte Zeilen-Kacheln (Symbol · Titel/Text/Anzahl · Pfeil) statt hoher Karten */
  .haendler-karten { gap: var(--space-3); }
  .haendler-karte {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    grid-template-areas: "icon titel pfeil" "icon text pfeil" "icon anzahl pfeil";
    align-items: start;
    gap: 0.25rem var(--space-4);
    min-height: 0;
    padding: var(--space-4);
    border-radius: var(--radius-xl);
  }
  .haendler-karte__kopf, .haendler-karte__fuss { display: contents; }
  .haendler-karte__icon { grid-area: icon; width: 2.5rem; height: 2.5rem; border-radius: var(--radius-sm); }
  .haendler-karte__num { display: none; }
  .haendler-karte__titel { grid-area: titel; font-size: 1.0625rem; }
  .haendler-karte__text { grid-area: text; font-size: 0.875rem; }
  .haendler-karte__anzahl { grid-area: anzahl; margin-top: 0.25rem; }
  .haendler-karte__pfeil { grid-area: pfeil; align-self: center; }
  .haendler-karte .stretched-link::after { border-radius: var(--radius-xl); }
}


/* H5  Startseite unten -------------------------------------------------------- */
.haendler-start__unten { display: grid; gap: clamp(2.5rem, 1.75rem + 2.5vw, 4rem); margin-top: clamp(3rem, 2rem + 3vw, 5rem); }
@media (min-width: 1024px) {
  .haendler-start__unten { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; }
  .haendler-start__neu:only-child { grid-column: 1 / -1; }
}
.haendler-start__seite { display: grid; gap: var(--gap); }


/* H6  Dokumentliste, Suche, Sprungmarken --------------------------------------- */
.haendler-werkzeug {
  display: grid;
  gap: var(--space-3) var(--space-5);
  margin-bottom: var(--space-5);
  padding: var(--space-3);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-sm);
}
@media (min-width: 768px) {
  .haendler-werkzeug { grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding-right: var(--space-5); }
}
.haendler-suche {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  min-width: 0;
  padding: 0 0.375rem 0 1rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-bg);
  transition: border-color var(--dur-fast), box-shadow var(--dur-fast);
}
.haendler-suche:focus-within { border-color: var(--graphite-900); box-shadow: var(--focus-ring); }
.haendler-suche__icon { display: grid; place-items: center; color: var(--color-text-muted); }
.haendler-suche__icon .icon { width: 1.125rem; height: 1.125rem; }
.haendler-suche__eingabe {
  flex: 1;
  min-width: 0;
  height: 2.875rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-text);
  font-size: 1rem;   /* ≥ 16 px: kein Auto-Zoom auf iOS */
  font-weight: var(--fw-medium);
}
.haendler-suche__eingabe::placeholder { color: var(--color-text-subtle); font-weight: var(--fw-regular); }
.haendler-suche__eingabe:focus, .haendler-suche__eingabe:focus-visible { outline: none; }
.haendler-suche__eingabe::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }   /* „Suche zurücksetzen“ übernimmt das */
.haendler-werkzeug__status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-4);
  margin: 0;
  padding-inline: var(--space-2);
  color: var(--color-text-muted);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  font-variant-numeric: tabular-nums;
}
.btn.haendler-werkzeug__zurueck { font-family: var(--font-display); font-size: 0.875rem; letter-spacing: 0; }

.haendler-sprung { margin: 0 0 clamp(2rem, 1.5rem + 1.5vw, 3rem); }
.chip.haendler-sprung__chip { gap: 0.5rem; }
.haendler-sprung__n {
  display: inline-grid;
  place-items: center;
  min-width: 1.375rem;
  height: 1.375rem;
  padding: 0 0.3125rem;
  border-radius: var(--radius-pill);
  background: var(--color-surface-3);
  color: var(--color-text-muted);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-variant-numeric: tabular-nums;
}
@media (max-width: 767.98px) {
  /* eine Zeile zum Wischen statt vieler Umbrüche */
  .haendler-sprung { margin-inline: calc(var(--gutter) * -1); }
  .haendler-sprung .haendler-sprung__liste { flex-wrap: nowrap; overflow-x: auto; padding: 0.125rem var(--gutter); scrollbar-width: none; }
  .haendler-sprung .haendler-sprung__liste::-webkit-scrollbar { display: none; }
  .haendler-sprung__liste > li { flex: none; }
}

.haendler-dokumente { display: grid; gap: clamp(2.5rem, 2rem + 2vw, 3.75rem); }
.haendler-dokumente__gruppe { min-width: 0; scroll-margin-top: calc(var(--header-offset) + var(--space-4)); }
.haendler-dokumente__kopf {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2) var(--space-4);
  margin-bottom: var(--space-4);
}
.haendler-dokumente__titel {
  margin: 0;
  font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem);
  font-weight: var(--fw-medium);
  line-height: 1.15;
  letter-spacing: var(--tracking-h3);
}
.haendler-dokumente__anzahl { margin: 0; color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: var(--tracking-label); text-transform: uppercase; font-variant-numeric: tabular-nums; }
.haendler-dokumente__unter + .haendler-dokumente__unter { margin-top: var(--space-7); }
.haendler-dokumente__untertitel {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.625rem;
  color: var(--color-text-muted);
  font-family: var(--font-mono);
  font-size: var(--fs-label);
  font-weight: var(--fw-regular);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
}
.haendler-dokumente__n {
  display: inline-grid;
  place-items: center;
  min-width: 1.5rem;
  height: 1.375rem;
  padding: 0 0.375rem;
  border-radius: var(--radius-pill);
  background: var(--color-surface-3);
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
}
.haendler-dokumente__liste { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--color-divider); }

.haendler-dokument { border-bottom: 1px solid var(--color-divider); }
.haendler-dokument__link {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1fr) auto;
  gap: var(--space-4);
  align-items: center;
  min-height: 4.5rem;
  margin-block: 2px;
  padding: 0.75rem 0.75rem 0.75rem 0.625rem;
  border-radius: var(--radius-sm);
  color: inherit;
  text-decoration: none;
  transition: background-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.haendler-dokument__link:hover { background: var(--color-bg-raised); box-shadow: var(--shadow-xs); }
.haendler-dokument__link:focus-visible { outline-offset: 0; background: var(--color-bg-raised); }

/* Blatt mit Eselsohr – PDF mit Textzeilen, XLSX mit Tabellenraster */
.haendler-dokument__typ {
  position: relative;
  display: block;
  width: 2.25rem;
  height: 2.875rem;
  margin-left: 0.125rem;
  background:
    repeating-linear-gradient(180deg, var(--steel-200) 0 1px, transparent 1px 0.3125rem) 0.375rem 0.75rem / 1.25rem 1.0625rem no-repeat,
    linear-gradient(225deg, transparent 0.5rem, var(--color-bg-raised) 0.5rem);
  filter: drop-shadow(0 0 0.5px rgba(21, 23, 26, .45)) drop-shadow(0 4px 6px rgba(21, 23, 26, .12));
}
.haendler-dokument__typ::before {   /* Eselsohr */
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 0.707rem;
  height: 0.707rem;
  border-bottom-left-radius: 2px;
  background: linear-gradient(225deg, transparent 50%, var(--steel-200) 50%);
}
.haendler-dokument--xlsx .haendler-dokument__typ {
  background:
    linear-gradient(90deg, var(--steel-300) 1px, transparent 1px) 0.375rem 0.75rem / 0.4375rem 1.0625rem repeat-x,
    repeating-linear-gradient(180deg, var(--steel-300) 0 1px, transparent 1px 0.3125rem) 0.375rem 0.75rem / 1.3125rem 1.0625rem no-repeat,
    linear-gradient(225deg, transparent 0.5rem, var(--color-bg-raised) 0.5rem);
}
.haendler-dokument__typ-label {
  position: absolute;
  left: -0.3125rem;
  bottom: 0.3125rem;
  padding: 0.0625rem 0.25rem;
  border-radius: 3px;
  background: var(--graphite-900);
  color: #fff;
  font-family: var(--font-mono);
  font-size: 0.5625rem;
  font-weight: var(--fw-medium);
  line-height: 1.3;
  letter-spacing: 0.06em;
}
.haendler-dokument--xlsx .haendler-dokument__typ-label { background: var(--steel-700); }

.haendler-dokument__text { display: grid; gap: 0.25rem; min-width: 0; }
.haendler-dokument__kicker { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: var(--tracking-label); text-transform: uppercase; overflow-wrap: anywhere; }
.haendler-dokument__zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; min-width: 0; }
.haendler-dokument__titel {
  font-family: var(--font-display);
  font-size: 1.0625rem;
  font-weight: var(--fw-medium);
  line-height: 1.3;
  letter-spacing: -0.01em;
  overflow-wrap: anywhere;
}
.haendler-dokument__zusatz,
.haendler-dokument__neu {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  min-height: 1.375rem;
  padding: 0 0.5rem;
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-pill);
  color: var(--color-text);
  font-family: var(--font-mono);
  font-size: var(--fs-micro);
  line-height: 1.2;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.haendler-dokument__neu { border-color: var(--color-border); color: var(--color-text-muted); }
.haendler-dokument__neu::before { content: ""; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--color-accent); }
.haendler-dokument__meta { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: 0.04em; font-variant-numeric: tabular-nums; }

.haendler-dokument__aktion {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 2.25rem;
  padding: 0 0.75rem 0 0.875rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill);
  background: var(--color-bg-raised);
  color: var(--color-text);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  white-space: nowrap;
  transition: border-color var(--dur-fast), background-color var(--dur-fast), color var(--dur-fast);
}
.haendler-dokument__aktion .icon { width: 0.9375rem; height: 0.9375rem; color: var(--color-text-muted); transition: transform var(--dur-slow) var(--ease-spring), color var(--dur-fast); }
.haendler-dokument__link:hover .haendler-dokument__aktion,
.haendler-dokument__link:focus-visible .haendler-dokument__aktion { border-color: var(--graphite-900); }
.haendler-dokument__link:hover .haendler-dokument__aktion .icon { color: var(--color-accent-text); transform: translate(1px, -1px); }
.haendler-dokument--xlsx .haendler-dokument__link:hover .haendler-dokument__aktion .icon { transform: translateY(2px); }
@media (max-width: 599.98px) {
  .haendler-dokument__link { grid-template-columns: 2.5rem minmax(0, 1fr) auto; gap: var(--space-3); align-items: start; padding-inline: 0.375rem 0.25rem; }
  .haendler-dokument__aktion { width: 2.5rem; height: 2.5rem; padding: 0; justify-content: center; }
  .haendler-dokument__aktion-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .haendler-dokument__titel { font-size: 1rem; }
}


/* H7  Karten aus Dokumenten (Bereiche mit höchstens 2 Dokumenten ohne Gruppen) ------ */
.haendler-dokumente--karten .haendler-dokumente__liste {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
  gap: var(--gap);
  border-top: 0;
}
.haendler-dokumente--karten .haendler-dokument { border-bottom: 0; }
.haendler-dokumente--karten .haendler-dokument__link {
  position: relative;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: var(--space-5);
  height: 100%;
  min-height: 15rem;
  margin: 0;
  padding: var(--card-pad);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-2xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-xs);
  transition: box-shadow var(--dur-slow) var(--ease-out), transform var(--dur-slow) var(--ease-out);
}
.haendler-dokumente--karten .haendler-dokument__link:hover { box-shadow: var(--shadow-lg); transform: translateY(-3px); }
.haendler-dokumente--karten .haendler-dokument__typ { width: 3rem; height: 3.875rem; margin: 0 0 0 0.25rem; background-size: 1.75rem 1.5rem, auto; background-position: 0.5rem 1rem, 0 0; }
.haendler-dokumente--karten .haendler-dokument--xlsx .haendler-dokument__typ { background-size: 0.5625rem 1.5rem, 1.75rem 1.5rem, auto; background-position: 0.5rem 1rem, 0.5rem 1rem, 0 0; }
.haendler-dokumente--karten .haendler-dokument__typ::before { width: 0.9rem; height: 0.9rem; }
.haendler-dokumente--karten .haendler-dokument__titel { font-size: clamp(1.125rem, 1.05rem + 0.3vw, 1.3125rem); font-weight: var(--fw-semibold); line-height: 1.25; }
.haendler-dokumente--karten .haendler-dokument__aktion {
  justify-self: start;
  align-self: end;
  width: auto;
  height: auto;
  min-height: 2.5rem;
  padding: 0 0.375rem 0 1.125rem;
  border-color: var(--graphite-900);
  background: linear-gradient(180deg, var(--graphite-600) 0%, var(--graphite-900) 100%);
  color: #fff;
  font-family: var(--font-display);
  font-size: 0.875rem;
  letter-spacing: -0.005em;
  text-transform: none;
  box-shadow: var(--shadow-dark-btn);
}
.haendler-dokumente--karten .haendler-dokument__aktion-text { position: static; width: auto; height: auto; overflow: visible; clip: auto; clip-path: none; }
.haendler-dokumente--karten .haendler-dokument__aktion .icon {
  box-sizing: content-box;
  width: 0.875rem;
  height: 0.875rem;
  padding: 0.5rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, .12);
  color: #fff;
}
.haendler-dokumente--karten .haendler-dokument__link:hover .haendler-dokument__aktion .icon { color: #fff; }


/* H8  Meldungen ------------------------------------------------------------------ */
.haendler-meldungen { display: grid; gap: var(--space-3); margin: 0 0 var(--space-6); }
.haendler-meldung {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-3);
  align-items: start;
  overflow: hidden;
  padding: var(--space-4) var(--space-5) var(--space-4) var(--space-4);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-md);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-xs);
}
.haendler-meldung::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--color-border-strong); }
.haendler-meldung--erfolg::before { background: var(--color-success); }
.haendler-meldung--fehler::before { background: var(--color-accent); }
.haendler-meldung:focus { outline: none; }
.haendler-meldung:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.haendler-meldung__icon {
  display: grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  background: var(--color-surface-3);
  color: var(--color-text-muted);
}
.haendler-meldung__icon .icon { width: 0.875rem; height: 0.875rem; }
.haendler-meldung--erfolg .haendler-meldung__icon { background: var(--color-success); color: #fff; }
.haendler-meldung--fehler .haendler-meldung__icon { background: var(--red-tint); color: var(--color-accent-text); }
.haendler-meldung__text { margin: 0; padding-top: 0.0625rem; font-size: 0.9375rem; line-height: 1.5; }


/* H9  Panels, Zugangs-Layout, Info-Karte ------------------------------------------ */
.haendler-panel {
  position: relative;
  padding: var(--haendler-panel-pad);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-2xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-sm);
}
.haendler-panel__kopf { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-5); }
.haendler-panel__kopf .haendler-panel__titel { margin: 0; }
.haendler-panel__titel {
  margin: 0 0 var(--space-4);
  font-size: clamp(1.25rem, 1.15rem + 0.45vw, 1.5rem);
  font-weight: var(--fw-semibold);
  line-height: 1.2;
  letter-spacing: var(--tracking-h3);
}
.haendler-panel__text { margin: 0 0 var(--space-5); color: var(--color-text-muted); font-size: 0.9375rem; line-height: 1.55; }
.haendler-panel__login { color: var(--color-text); font-family: var(--font-mono); font-size: 0.875rem; font-weight: var(--fw-medium); overflow-wrap: anywhere; }
.haendler-panel__hinweis,
.haendler-panel__notiz {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  margin: 0 0 var(--space-6);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: var(--color-bg);
  color: var(--color-text-muted);
  font-size: 0.875rem;
  line-height: 1.5;
}
.haendler-panel__notiz { margin: var(--space-6) 0 0; }
.haendler-panel__hinweis .icon,
.haendler-panel__notiz .icon { flex: none; width: 1rem; height: 1rem; margin-top: 0.1875rem; color: var(--color-text-subtle); }
.haendler-panel__hinweis a, .haendler-panel__notiz a { color: var(--color-accent-text); }
.haendler-panel__fuss {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-3);
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-divider);
  color: var(--color-text-muted);
  font-size: 0.9375rem;
}
.haendler-panel__fuss p { margin: 0; }
.haendler-panel__marke {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: var(--space-5);
  border-radius: 50%;
  background: var(--graphite-900);
  color: #fff;
}
.haendler-panel__marke .icon { width: 1.375rem; height: 1.375rem; }
.haendler-panel__marke--erfolg { background: var(--color-success); }

.haendler-zugang { display: grid; gap: var(--gap); align-items: start; }
@media (min-width: 1024px) {
  .haendler-zugang { grid-template-columns: minmax(0, 34rem) minmax(0, 1fr); gap: clamp(2rem, 1rem + 2.5vw, 4rem); }
  .haendler-zugang--breit { grid-template-columns: minmax(0, 1fr) minmax(0, 23rem); }
  .haendler-zugang--allein { grid-template-columns: minmax(0, 46rem); }
  .haendler-zugang > .haendler-zugang__info { position: sticky; top: var(--haendler-sticky-top); }
}
@media (min-width: 1440px) {
  .haendler-zugang { grid-template-columns: minmax(0, 36rem) minmax(0, 30rem); }
  .haendler-zugang--breit { grid-template-columns: minmax(0, 52rem) minmax(0, 24rem); }
}

/* Metallkarte mit Walzenstern-Muster (wie die Anfrage-Karte der Kontaktseite) */
.haendler-info,
.haendler-kontakt {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: var(--haendler-panel-pad);
  border: 1px solid rgba(255, 255, 255, .85);
  border-radius: var(--radius-2xl);
  background: var(--surface-metal);
  box-shadow: var(--shadow-md);
}
.haendler-info::before,
.haendler-kontakt::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--pattern-prism);
  opacity: 0.6;
  -webkit-mask-image: linear-gradient(250deg, #000 0%, transparent 62%);
  mask-image: linear-gradient(250deg, #000 0%, transparent 62%);
  pointer-events: none;
}
.haendler-info__titel { margin: 0; max-width: 22ch; font-size: clamp(1.375rem, 1.2rem + 0.75vw, 1.875rem); font-weight: var(--fw-medium); line-height: 1.15; letter-spacing: var(--tracking-h3); }
.haendler-info__notiz { margin: var(--space-5) 0 0; color: var(--color-text-muted); font-size: 0.875rem; line-height: 1.5; }
.haendler-info__aktionen { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); margin-top: var(--space-6); }


/* H10  Formulare, Passwort, Schritte -------------------------------------------- */
.haendler-formular { display: grid; gap: var(--space-5); }
.haendler-formular .field__label { line-height: 1.35; }
.haendler-formular__optional { color: var(--color-text-subtle); font-weight: var(--fw-regular); }
.haendler-formular__klein { color: var(--color-text-subtle); font-size: 0.8125rem; }
.haendler-formular__aktionen { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); margin-top: var(--space-1); }
.haendler-formular__aktionen .form-note { margin: 0; }
.haendler-formular__aktionen--trenner { margin-top: var(--space-2); padding-top: var(--space-6); border-top: 1px solid var(--color-divider); }
.haendler-formular__nebenlink { color: var(--color-accent-text); font-size: 0.875rem; text-decoration-color: color-mix(in srgb, currentColor 40%, transparent); }
.haendler-formular__nebenlink:hover { text-decoration-color: currentColor; }
.haendler-formular .btn[aria-disabled="true"] { opacity: 0.7; cursor: progress; }

.haendler-formular__gruppe { min-width: 0; margin: 0; padding: 0; border: 0; }
.haendler-formular__gruppe + .haendler-formular__gruppe { margin-top: var(--space-5); }
.haendler-formular__legende {   /* float: Legende im normalen Fluss statt im Rahmen des fieldset */
  float: left;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  margin: 0 0 var(--space-5);
  padding: 0;
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: var(--fw-semibold);
  letter-spacing: -0.01em;
}
.haendler-formular__legende::after { content: ""; flex: 1; height: 1px; background: var(--color-divider); }
.haendler-formular__legende + * { clear: both; }
.haendler-formular__nr { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-label); font-weight: var(--fw-medium); letter-spacing: var(--tracking-label); }
.haendler-formular__felder { display: grid; gap: var(--space-5) var(--space-4); }
@media (min-width: 768px) {
  .haendler-formular__felder { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .haendler-formular__feld { grid-column: span 3; }
  .haendler-formular__feld--firma,
  .haendler-formular__feld--strasse,
  .haendler-formular__feld--nachricht,
  .haendler-formular__feld--einwilligung { grid-column: 1 / -1; }
  .haendler-formular__feld--plz { grid-column: span 2; }
  .haendler-formular__feld--ort { grid-column: span 4; }
}
.haendler-formular__feld--einwilligung .check { line-height: 1.5; }
.haendler-formular__feld--einwilligung .check a { color: var(--color-accent-text); }
.field--error .check input { border-color: var(--red-600); }
.field--error .select, .select[aria-invalid="true"],
.field--error .textarea, .textarea[aria-invalid="true"] { border-color: var(--red-600); }

/* Passwortfeld mit „Anzeigen“ */
.haendler-passwort { position: relative; }
.haendler-passwort .input { padding-right: 6.5rem; }
.haendler-passwort__zeigen {
  position: absolute;
  top: 50%;
  right: 0.375rem;
  min-height: 2.25rem;
  padding: 0 0.75rem;
  border: 1px solid transparent;
  border-radius: var(--radius-pill);
  background: var(--color-bg);
  color: var(--color-text-muted);
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  transform: translateY(-50%);
  cursor: pointer;
  transition: border-color var(--dur-fast), color var(--dur-fast);
}
.haendler-passwort__zeigen:hover { border-color: var(--color-border-strong); color: var(--color-text); }
.haendler-passwort__zeigen:focus-visible { outline-offset: 1px; }

/* Honigtopf: für Menschen unsichtbar, für Screenreader ausgeblendet (aria-hidden), nicht per display:none */
.haendler-honigtopf { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Schritte (Liste mit Mono-Nummern, wie .kontakt-schritte) */
.haendler-schritte { display: grid; margin: var(--space-6) 0 0; padding: 0; list-style: none; border-top: 1px solid var(--color-divider); }
.haendler-schritte__schritt {
  display: grid;
  grid-template-columns: 2.75rem minmax(0, 1fr);
  align-items: baseline;
  gap: var(--space-3);
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--color-divider);
  font-size: 0.9375rem;
  line-height: 1.5;
}
.haendler-schritte__num { color: var(--color-text-muted); font-family: var(--font-mono); font-size: var(--fs-label); letter-spacing: var(--tracking-label); }
.haendler-schritte__text { color: var(--color-text-muted); }
.haendler-schritte__text strong { margin-right: 0.25em; color: var(--color-text); font-family: var(--font-display); font-weight: var(--fw-semibold); }
/* Status: erledigt (Haken) · aktuell (roter Marker) · offen */
.haendler-schritte--status { margin: var(--space-2) 0 var(--space-6); }
.haendler-schritte--status .haendler-schritte__schritt { align-items: center; grid-template-columns: 2.25rem minmax(0, 1fr); gap: var(--space-4); }
.haendler-schritte--status .haendler-schritte__num {
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid var(--color-border-strong);
  border-radius: 50%;
  color: var(--color-text-muted);
  font-size: 0.6875rem;
  letter-spacing: 0;
}
.haendler-schritte--status .haendler-schritte__num .icon { width: 1rem; height: 1rem; }
.haendler-schritte--status [data-zustand="erledigt"] .haendler-schritte__num { border-color: var(--graphite-900); background: var(--graphite-900); color: #fff; }
.haendler-schritte--status [data-zustand="aktuell"] .haendler-schritte__num { border-color: var(--red-500); background: var(--red-500); color: #fff; box-shadow: 0 0 0 5px var(--red-tint); }
.haendler-schritte--status [data-zustand="offen"] .haendler-schritte__text { color: var(--color-text-subtle); }

/* Haken-Liste (Tipps) */
.haendler-haken { display: grid; gap: var(--space-3); margin: var(--space-6) 0 0; padding: 0; list-style: none; }
.haendler-haken li { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); gap: var(--space-3); color: var(--color-text-muted); font-size: 0.9375rem; line-height: 1.5; }
.haendler-haken .icon { width: 1.125rem; height: 1.125rem; margin-top: 0.1875rem; color: var(--color-text); }


/* H11  Fehlerübersicht (Registrierung) ------------------------------------------- */
.haendler-fehlerliste {
  position: relative;
  margin: 0 0 var(--space-6);
  padding: var(--space-4) var(--space-5) var(--space-4) var(--space-5);
  overflow: hidden;
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-md);
  background: var(--color-bg);
}
.haendler-fehlerliste::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--color-accent); }
.haendler-fehlerliste:focus { outline: none; }
.haendler-fehlerliste:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.haendler-fehlerliste__titel { margin: 0 0 var(--space-2); font-family: var(--font-display); font-weight: var(--fw-semibold); }
.haendler-fehlerliste__liste { display: grid; gap: 0.25rem; margin: 0; padding-left: 1.125rem; font-size: 0.875rem; }
.haendler-fehlerliste__liste a { color: var(--color-accent-text); text-decoration-color: color-mix(in srgb, currentColor 40%, transparent); }
.haendler-fehlerliste__liste a:hover { text-decoration-color: currentColor; }


/* H12  Konto -------------------------------------------------------------------- */
.haendler-konto { display: grid; gap: var(--gap); align-items: start; }
@media (min-width: 1280px) { .haendler-konto { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.haendler-konto__rollen { gap: 0.375rem; }
.haendler-daten { display: grid; margin: 0; border-top: 1px solid var(--color-divider); }
@media (min-width: 600px) { .haendler-daten { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--space-6); } }
.haendler-daten__zeile { display: grid; align-content: start; gap: 0.25rem; padding: 0.875rem 0; border-bottom: 1px solid var(--color-divider); min-width: 0; }
.haendler-daten__zeile--breit, .haendler-daten__zeile--voll, .haendler-daten__zeile--mehrzeilig { grid-column: 1 / -1; }
.haendler-daten dt { color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: var(--tracking-label); text-transform: uppercase; }
.haendler-daten dd { margin: 0; font-size: 0.9375rem; line-height: 1.5; overflow-wrap: anywhere; }
.haendler-daten__zeile--breit dd { font-family: var(--font-display); font-size: 1.125rem; font-weight: var(--fw-semibold); }
.haendler-daten__zeile--mono dd { font-family: var(--font-mono); font-size: 0.875rem; }
.haendler-konto__abmelden {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3) var(--space-5);
  margin-top: var(--gap);
  padding: var(--space-4) var(--space-4) var(--space-4) var(--space-5);
  border: 1px dashed var(--color-border-strong);
  border-radius: var(--radius-xl);
  color: var(--color-text-muted);
  font-size: 0.9375rem;
}
.haendler-konto__abmelden p { margin: 0; max-width: 52ch; }


/* H13  Hinweis 403/404, Platzhalter, leer --------------------------------------- */
.haendler-hinweis {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(1.5rem, 1rem + 2.5vw, 3.5rem);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-2xl);
  background: var(--color-bg-raised);
  box-shadow: var(--shadow-sm);
}
.haendler-hinweis--schmal { max-width: 46rem; }
.haendler-hinweis__marke {
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  margin-bottom: var(--space-6);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--surface-metal);
  color: var(--color-text);
}
.haendler-hinweis__marke .icon { width: 1.375rem; height: 1.375rem; }
.haendler-hinweis__code {   /* dünne Metall-Ziffer wie die 404-Seite des Themes, dekorativ */
  position: absolute;
  top: clamp(1rem, 0.5rem + 2vw, 2.5rem);
  right: clamp(1.25rem, 0.75rem + 2vw, 3rem);
  z-index: -1;
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(4.5rem, 3rem + 6vw, 9rem);
  font-weight: var(--fw-thin);
  line-height: 0.8;
  letter-spacing: var(--tracking-num);
  font-variant-numeric: tabular-nums lining-nums;
  background: linear-gradient(180deg, var(--steel-300) 0%, var(--steel-500) 58%, var(--steel-200) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  opacity: 0.55;
  user-select: none;
}
.haendler-hinweis__titel { margin: 0; max-width: 28ch; font-size: clamp(1.375rem, 1.2rem + 0.8vw, 2rem); font-weight: var(--fw-medium); line-height: 1.15; letter-spacing: var(--tracking-h3); }
.haendler-hinweis__text { margin: var(--space-4) 0 0; max-width: 58ch; color: var(--color-text-muted); line-height: 1.55; }
.haendler-hinweis__aktionen { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-7); }
@media (max-width: 479.98px) {
  .haendler-hinweis__aktionen .btn, .haendler-konto__abmelden .btn { width: 100%; justify-content: space-between; }
  .haendler-hinweis__code { font-size: 4rem; }
}

/* „Inhalt folgt“ – neutral wie .sx-ph (Stahlgrau statt gelb gestrichelt) */
.haendler-platzhalter {
  display: grid;
  justify-items: start;
  gap: var(--space-3);
  padding: var(--haendler-panel-pad);
  border: 1px solid var(--color-border-hair);
  border-radius: var(--radius-2xl);
  background: var(--color-surface-2);
}
.haendler-platzhalter__titel { margin: var(--space-2) 0 0; max-width: 30ch; font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.625rem); font-weight: var(--fw-medium); line-height: 1.2; }
.haendler-platzhalter__text { margin: 0; max-width: 60ch; color: var(--color-text-muted); font-size: 0.9375rem; line-height: 1.55; }
.haendler-platzhalter--klein { gap: var(--space-2); margin-top: var(--gap); padding: var(--space-5) var(--card-pad); border-radius: var(--radius-xl); }
.haendler-platzhalter--klein .haendler-platzhalter__titel { font-size: 1.0625rem; font-weight: var(--fw-semibold); max-width: none; }

/* keine Treffer */
.haendler-leer { display: grid; justify-items: start; gap: var(--space-3); padding: var(--card-pad); border: 1px dashed var(--color-border-strong); border-radius: var(--radius-xl); }
.haendler-leer__titel { margin: 0; font-family: var(--font-display); font-size: 1.25rem; font-weight: var(--fw-semibold); }
.haendler-leer__text { margin: 0; max-width: 56ch; color: var(--color-text-muted); }


/* H14  Kontakt, Kontaktzeile, Aktuelles ---------------------------------------- */
.eyebrow.haendler-kontakt__eyebrow { margin-bottom: var(--space-4); }
.haendler-kontakt__titel { margin: 0; font-size: clamp(1.25rem, 1.15rem + 0.45vw, 1.5rem); font-weight: var(--fw-semibold); line-height: 1.2; }
.haendler-kontakt__nummer {
  display: inline-block;
  margin-top: var(--space-3);
  font-family: var(--font-display);
  font-size: clamp(1.625rem, 1.3rem + 1.2vw, 2.25rem);
  font-weight: var(--fw-light);
  letter-spacing: var(--tracking-num);
  line-height: 1.1;
  font-variant-numeric: tabular-nums lining-nums;
  text-decoration: none;
  white-space: nowrap;
}
.haendler-kontakt__nummer:hover { color: var(--color-accent-text); }
.haendler-kontakt__wege { display: grid; gap: 0.25rem; margin: var(--space-4) 0 0; padding: 0; list-style: none; font-size: 0.9375rem; }
.haendler-kontakt__wege a, .haendler-kontakt__wege li > span { display: inline-flex; align-items: center; gap: 0.625rem; min-height: 2.25rem; color: var(--color-text-muted); text-decoration: none; overflow-wrap: anywhere; }
.haendler-kontakt__wege a:hover { color: var(--color-accent-text); }
.haendler-kontakt__wege .icon { flex: none; width: 1.125rem; height: 1.125rem; color: var(--color-text-subtle); }
.haendler-kontakt__aktionen { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--color-divider); }
.haendler__haupt > .haendler-kontakt { margin-top: clamp(2.5rem, 1.75rem + 2.5vw, 4rem); }
.haendler-zugang > .haendler-kontakt { align-self: start; }

.haendler-kontaktzeile {
  display: grid;
  gap: var(--space-3);
  margin-top: clamp(2.5rem, 1.75rem + 2.5vw, 4rem);
  padding-top: var(--space-5);
  border-top: 1px solid var(--color-divider);
  color: var(--color-text-muted);
  font-size: 0.875rem;
  line-height: 1.5;
}
.haendler-kontaktzeile p { display: flex; align-items: flex-start; gap: 0.625rem; margin: 0; }
.haendler-kontaktzeile a { color: var(--color-text); text-decoration-color: color-mix(in srgb, currentColor 35%, transparent); white-space: nowrap; }
.haendler-kontaktzeile a:hover { color: var(--color-accent-text); }
.haendler-kontaktzeile__icon { display: grid; place-items: center; flex: none; width: 1.5rem; height: 1.5rem; margin-top: -0.0625rem; border-radius: 50%; background: var(--color-surface-3); }
.haendler-kontaktzeile__icon .icon { width: 0.875rem; height: 0.875rem; }
.haendler-kontaktzeile__vertraulich { color: var(--color-text-subtle); font-size: 0.8125rem; }

.haendler-aktuell {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: var(--haendler-panel-pad);
  border: 1px solid rgba(255, 255, 255, .06);
  border-radius: var(--radius-2xl);
  background: var(--surface-graphite);
  box-shadow: var(--shadow-lg);
  color: var(--color-text);
}
.haendler-aktuell::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--pattern-prism-dark);
  -webkit-mask-image: linear-gradient(200deg, #000 0%, transparent 65%);
  mask-image: linear-gradient(200deg, #000 0%, transparent 65%);
  pointer-events: none;
}
.eyebrow.haendler-aktuell__eyebrow { margin-bottom: var(--space-4); }
.haendler-aktuell__titel { margin: 0; color: var(--color-text); font-size: clamp(1.25rem, 1.15rem + 0.45vw, 1.5rem); font-weight: var(--fw-semibold); line-height: 1.25; }
.haendler-aktuell__liste { display: grid; gap: var(--space-2); margin: var(--space-5) 0 var(--space-6); padding: 0; list-style: none; }
.haendler-aktuell__dok {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.125rem var(--space-3);
  align-items: center;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, .04);
  color: var(--color-text);
  text-decoration: none;
  transition: background-color var(--dur-fast), border-color var(--dur-fast);
}
.haendler-aktuell__dok:hover { border-color: var(--color-border-strong); background: rgba(255, 255, 255, .08); }
.haendler-aktuell__dok-titel { grid-column: 1; font-family: var(--font-display); font-weight: var(--fw-medium); line-height: 1.3; overflow-wrap: anywhere; }
.haendler-aktuell__dok-meta { grid-column: 1; color: var(--color-text-subtle); font-family: var(--font-mono); font-size: var(--fs-micro); letter-spacing: 0.04em; }
.haendler-aktuell__dok-icon { grid-column: 2; grid-row: 1 / span 2; width: 1.125rem; height: 1.125rem; color: var(--color-text-muted); }


/* H15  Bewegung, Kontrast, Druck ------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  .haendler-karte, .haendler-dokument__link, .haendler-dokumente--karten .haendler-dokument__link,
  .haendler-dokument__aktion .icon, .haendler-nav__schalter-icon { transition: none; }
  .haendler-karte:hover, .haendler-dokumente--karten .haendler-dokument__link:hover,
  .haendler-dokument__link:hover .haendler-dokument__aktion .icon { transform: none; }
}
@media (forced-colors: active) {
  .haendler-info::before, .haendler-kontakt::before, .haendler-aktuell::before, .haendler-hinweis__code { display: none; }
  .haendler-nav, .haendler-karte, .haendler-panel, .haendler-info, .haendler-kontakt, .haendler-aktuell,
  .haendler-hinweis, .haendler-meldung, .haendler-dokument__typ, .haendler-dokument__aktion { border: 1px solid CanvasText; }
  .haendler-nav__link--aktiv::before, .haendler-meldung::before, .haendler-fehlerliste::before { background: Highlight; }
}
@media print {
  .haendler-nav, .haendler-werkzeug, .haendler-sprung, .haendler-leiste__aktionen, .haendler-dokument__aktion,
  .haendler-konto__passwort, .haendler-konto__abmelden { display: none !important; }
  .haendler__raster { display: block; }
  .haendler-karte, .haendler-panel, .haendler-info, .haendler-kontakt { box-shadow: none; }
  .haendler-info::before, .haendler-kontakt::before, .haendler-aktuell::before { display: none; }
}