/* Hallmark · genre: modern-minimal · macrostructure: Index-First mit Leistungsbändern
 * theme: custom (Logo-Orange) · nav: N13 Suchleiste · footer: Ft3 Index-Spalten
 * Der bestehende Seiteninhalt bleibt erhalten, nur Aufbau und Auffindbarkeit sind neu.
 */

/* ---- Kopf: Logo gross, Kontakt sichtbar ---- */
.top { background: var(--color-ink-deep); color: var(--color-muted-inverse); font-size: var(--text-sm); }
.top .wrap { display: flex; flex-wrap: wrap; gap: var(--space-xs) var(--space-lg); align-items: center; padding-block: var(--space-xs); }
.top a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; min-height: 36px; }
.top a:hover { color: var(--color-accent-light); }
.top .rechts { margin-left: auto; display: flex; flex-wrap: wrap; gap: var(--space-md); }

.kopf { border-bottom: var(--rule-hair) solid var(--color-rule); }
.kopf .wrap { display: flex; align-items: center; gap: var(--space-lg); padding-block: var(--space-lg); flex-wrap: wrap; }
.logo { display: inline-flex; align-items: center; gap: 0.5em; text-decoration: none; }
.logo svg { height: 3.4rem; width: auto; flex: none; }
.logo__wort { font-family: var(--font-display); font-weight: 800; font-size: clamp(1.9rem, 3.6vw, 2.7rem); letter-spacing: -0.04em; color: var(--color-ink); line-height: 1; }
.logo__zusatz { display: block; font-family: var(--font-body); font-size: var(--text-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-muted); margin-top: 0.35em; }
.korb { margin-left: auto; font-size: var(--text-sm); font-weight: 600; white-space: nowrap; display: inline-flex; align-items: center; gap: var(--space-xs); min-height: 48px; padding-inline: var(--space-md); border: var(--rule-hair) solid var(--color-rule-strong); text-decoration: none; color: var(--color-ink); }
.korb:hover { border-color: var(--color-accent-deep); }
.korb b { font-family: var(--font-mono); color: var(--color-accent-deep); font-variant-numeric: tabular-nums; }

/* ---- Suche ---- */
.finder { padding-block: var(--space-2xl) var(--space-lg); background: var(--color-paper-2); border-bottom: var(--rule-hair) solid var(--color-rule); }
.finder h1 { font-weight: 700; font-size: var(--text-2xl); line-height: 1.1; max-width: min(24ch, 100%); }
.finder__lede { margin-top: var(--space-sm); color: var(--color-muted); max-width: min(58ch, 100%); }
.finder__box { margin-top: var(--space-lg); display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; background: var(--color-paper); border: var(--rule-bold) solid var(--color-ink); }
.finder__box input { font-family: var(--font-display); font-weight: 400; font-size: clamp(1.3rem, 3vw + 0.3rem, 2rem); letter-spacing: -0.03em; color: var(--color-ink); background: none; border: 0; padding: var(--space-sm) var(--space-md); min-height: 68px; width: 100%; }
.finder__box input::placeholder { color: var(--color-rule-strong); }
.finder__box input:focus { outline: none; }
.finder__box:focus-within { border-color: var(--color-accent-deep); }
.chips { margin-top: var(--space-md); display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.chip { font-size: var(--text-sm); background: none; border: var(--rule-hair) solid var(--color-rule-strong); color: var(--color-muted); padding: 0.4rem var(--space-sm); min-height: 40px; cursor: pointer; font-family: inherit; }
.chip:hover { border-color: var(--color-accent-deep); color: var(--color-accent-deep); }

.treffer { margin-top: var(--space-lg); display: none; }
.treffer.is-on { display: block; }
.treffer__zahl { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-muted); margin-bottom: var(--space-xs); }
.treffer ul { list-style: none; margin: 0; padding: 0; max-height: 24rem; overflow-y: auto; background: var(--color-paper); border: var(--rule-hair) solid var(--color-rule); }
.treffer li + li { border-top: var(--rule-hair) solid var(--color-rule); }
.treffer button { width: 100%; text-align: left; font: inherit; background: none; border: 0; cursor: pointer; padding: var(--space-sm) var(--space-md); min-height: 56px; display: flex; align-items: center; gap: var(--space-md); }
.treffer__bild { width: 40px; height: 40px; flex: none; object-fit: contain; background: var(--color-paper); border: var(--rule-hair) solid var(--color-rule); }
.treffer__text { flex: 1 1 auto; min-width: 0; }
.treffer button:hover { background: var(--color-paper-2); }
.treffer .bereich { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--color-muted); white-space: nowrap; }
.treffer mark { background: var(--color-accent-light); color: var(--color-ink); }
.treffer .zu { font-size: var(--text-sm); color: var(--color-accent-deep); font-weight: 600; white-space: nowrap; }
.treffer__leer { padding: var(--space-lg) var(--space-md); background: var(--color-paper); border: var(--rule-hair) solid var(--color-rule); }
.treffer__leer a { color: var(--color-accent-deep); font-weight: 600; }

/* ---- Register ---- */
.register { padding-block: var(--space-2xl) var(--space-3xl); }
.abschnitt__kopf { margin-bottom: var(--space-xl); }
.abschnitt__kopf::before { content: ""; display: block; width: 2.5rem; height: 3px; background: var(--color-accent); margin-bottom: var(--space-md); }
.abschnitt__kopf h2 { font-weight: 700; font-size: var(--text-2xl); line-height: 1.1; letter-spacing: -0.03em; }
.abschnitt__kopf p { margin-top: var(--space-xs); color: var(--color-muted); max-width: min(56ch, 100%); }
.register__grid { display: grid; gap: var(--space-xl) var(--space-2xl); grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.register h3 { font-weight: 700; font-size: var(--text-md); margin-bottom: var(--space-sm); padding-bottom: var(--space-xs); border-bottom: var(--rule-bold) solid var(--color-accent); }
.register ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2xs); }
.register a { font-size: var(--text-sm); color: var(--color-muted); text-decoration: none; display: inline-block; padding-block: 0.15rem; }
.register a:hover { color: var(--color-accent-deep); text-decoration: underline; text-underline-offset: 3px; }

/* ---- Nichts gefunden ---- */
.nichts { background: var(--color-ink-deep); color: var(--color-ink-inverse); padding-block: var(--space-2xl); }
.nichts__grid { display: grid; gap: var(--space-lg); align-items: center; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 52rem) { .nichts__grid { grid-template-columns: minmax(0, 1fr) auto; } }
.nichts h2 { font-weight: 700; font-size: var(--text-xl); }
.nichts p { margin-top: var(--space-xs); color: var(--color-muted-inverse); max-width: min(56ch, 100%); }
.knopf { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding-inline: var(--space-xl); font-weight: 600; text-decoration: none; white-space: nowrap; font-family: var(--font-display); font-size: var(--text-md); letter-spacing: -0.02em; border: 0; cursor: pointer; }
.knopf--voll { background: var(--color-accent-deep); color: var(--color-accent-ink); }
.knopf--voll:hover { background: var(--color-accent); color: var(--color-ink-deep); }
.knopf--rand { border: var(--rule-hair) solid var(--color-ink); color: var(--color-ink); }
.knopf--rand:hover { background: var(--color-ink); color: var(--color-paper); }

/* ---- Leistungen: der bestehende Seiteninhalt ---- */
.leistungen { padding-block: var(--space-3xl); }
.leistungen__grid { display: grid; gap: var(--space-xl); grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); }
.leistung { border-top: 3px solid var(--color-accent); padding-top: var(--space-md); }
.leistung h3 { font-weight: 700; font-size: var(--text-md); line-height: 1.2; }
.leistung p { margin-top: var(--space-sm); color: var(--color-muted); }
.leistung__mehr { margin-top: var(--space-sm); display: inline-block; font-size: var(--text-sm); font-weight: 600; color: var(--color-accent-deep); text-decoration: none; }
.leistung__mehr:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---- Anfragekorb erklaert ---- */
.korb-erklaer { background: var(--color-paper-2); border-block: var(--rule-hair) solid var(--color-rule); padding-block: var(--space-3xl); }
.korb-erklaer__grid { display: grid; gap: var(--space-xl); grid-template-columns: repeat(auto-fit, minmax(min(16rem, 100%), 1fr)); }
.korb-erklaer h2 { grid-column: 1 / -1; font-weight: 700; font-size: var(--text-xl); max-width: min(24ch, 100%); line-height: 1.12; }
.korb-erklaer h3 { font-weight: 700; font-size: var(--text-base); color: var(--color-accent-deep); margin-bottom: var(--space-2xs); }
.korb-erklaer p { color: var(--color-muted); max-width: min(42ch, 100%); }

/* ---- Belege ---- */
.beleg { padding-block: var(--space-2xl); }
.beleg__zeile { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-lg) var(--space-2xl); font-size: var(--text-sm); }
.beleg__zeile span { color: var(--color-muted); }
.beleg__zeile b { font-family: var(--font-mono); font-weight: 500; color: var(--color-ink); }
.beleg img { height: 56px; width: auto; }

/* ---- Kontakt ---- */
.kontakt { background: var(--color-ink-deep); color: var(--color-ink-inverse); padding-block: var(--space-3xl); }
.kontakt__grid { display: grid; gap: var(--space-2xl); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 60rem) { .kontakt__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--space-4xl); align-items: start; } }
.kontakt h2 { font-weight: 700; font-size: var(--text-2xl); line-height: 1.12; max-width: min(18ch, 100%); }
.kontakt p { margin-top: var(--space-md); color: var(--color-muted-inverse); max-width: min(46ch, 100%); }
.kontakt__daten { margin-top: var(--space-xl); display: grid; gap: var(--space-xs); font-size: var(--text-sm); }
.kontakt__daten a { color: var(--color-accent-light); }
.kalender { background: var(--color-paper); padding: var(--space-md); }

/* ---- Fuss ---- */
.foot { background: var(--color-paper-2); border-top: var(--rule-hair) solid var(--color-rule); padding-block: var(--space-2xl) var(--space-xl); font-size: var(--text-sm); }
.foot__grid { display: grid; gap: var(--space-xl); grid-template-columns: repeat(auto-fit, minmax(min(12rem, 100%), 1fr)); }
.foot h3 { font-family: var(--font-mono); font-weight: 500; font-size: var(--text-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-muted); margin-bottom: var(--space-sm); }
.foot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2xs); }
.foot a { color: var(--color-ink); text-decoration: none; display: inline-block; padding-block: 0.15rem; }
.foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.foot__unten { margin-top: var(--space-xl); padding-top: var(--space-md); border-top: var(--rule-hair) solid var(--color-rule); color: var(--color-muted); display: flex; flex-wrap: wrap; gap: var(--space-sm); }

@media (max-width: 40rem) {
  .logo svg { height: 2.6rem; }
  .korb { margin-left: 0; }
  .knopf { width: 100%; }
  /* Beruehrungsziele auf 44 px (WCAG AA) */
  .foot a, .foot__unten a, .top a, .register a, .demo a, .leistung__mehr, .kontakt__daten a {
    display: inline-flex; align-items: center; min-height: 44px;
  }
  .register ul { gap: 0; }
}

/* ---- Anfragekorb: Schublade ---- */
.korb.is-voll { border-color: var(--color-accent-deep); background: var(--color-accent-deep); color: var(--color-accent-ink); }
.korb.is-voll b { color: var(--color-accent-ink); }

dialog.korbdialog {
  border: 0; padding: 0; margin: 0 0 0 auto; max-width: 34rem; width: 100%;
  height: 100dvh; max-height: 100dvh; background: var(--color-paper); color: var(--color-ink);
}
dialog.korbdialog::backdrop { background: var(--color-scrim); }
.kd { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100dvh; }
.kd__kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); padding: var(--space-md) var(--space-lg); border-bottom: var(--rule-hair) solid var(--color-rule); }
.kd__kopf h2 { font-weight: 700; font-size: var(--text-md); }
.kd__zu { font: inherit; font-size: var(--text-sm); background: none; border: var(--rule-hair) solid var(--color-rule-strong); cursor: pointer; min-height: 44px; padding-inline: var(--space-md); color: var(--color-ink); }
.kd__zu:hover { border-color: var(--color-ink); }
.kd__koerper { overflow-y: auto; padding: var(--space-lg); }
.kd__fuss { border-top: var(--rule-hair) solid var(--color-rule); padding: var(--space-md) var(--space-lg); display: grid; gap: var(--space-sm); background: var(--color-paper-2); }
.kd__schritt { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--color-muted); }

.pos { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-sm) var(--space-md); padding-block: var(--space-md); border-bottom: var(--rule-hair) solid var(--color-rule); align-items: start; }
.pos__name { font-weight: 600; }
.pos__bereich { font-family: var(--font-mono); font-size: var(--text-xs); color: var(--color-muted); display: block; margin-top: 0.15em; }
.pos__weg { font: inherit; font-size: var(--text-sm); background: none; border: 0; color: var(--color-muted); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; min-height: 44px; padding: 0; }
.pos__weg:hover { color: var(--color-ink); }
.pos__menge { grid-column: 1 / -1; display: flex; align-items: center; gap: var(--space-sm); }
.pos__menge label { font-size: var(--text-sm); color: var(--color-muted); }
.pos__menge input { font: inherit; width: 7rem; min-height: 44px; padding: 0 var(--space-sm); border: var(--rule-hair) solid var(--color-rule-strong); background: var(--color-paper); color: inherit; font-variant-numeric: tabular-nums; }
.pos__menge input:focus-visible { outline: var(--rule-bold) solid var(--color-focus); outline-offset: 2px; }

.kd__leer { text-align: left; color: var(--color-muted); }
.kd__leer strong { display: block; color: var(--color-ink); font-family: var(--font-display); font-weight: 700; font-size: var(--text-md); margin-bottom: var(--space-xs); }

.kd__feld { display: grid; gap: var(--space-2xs); margin-bottom: var(--space-md); }
.kd__feld label { font-size: var(--text-sm); letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-muted); }
.kd__feld input, .kd__feld textarea {
  font: inherit; color: inherit; background: var(--color-paper); width: 100%;
  border: var(--rule-hair) solid var(--color-rule-strong); padding: var(--space-sm); min-height: 48px;
}
.kd__feld textarea { min-height: 6rem; resize: vertical; }
.kd__feld input:hover, .kd__feld textarea:hover { border-color: var(--color-muted); }
.kd__feld input:focus, .kd__feld textarea:focus { outline: none; border-color: var(--color-accent-deep); box-shadow: inset 0 0 0 1px var(--color-accent-deep); }
.kd__feld input[aria-invalid="true"] { border-color: var(--color-accent-deep); }
.kd__fehler { font-size: var(--text-sm); color: var(--color-accent-deep); }
.kd__zwei { display: grid; gap: var(--space-md); grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr)); }

.kd__liste { margin: 0; padding: 0; list-style: none; }
.kd__liste li { display: flex; justify-content: space-between; gap: var(--space-md); padding-block: var(--space-xs); border-bottom: var(--rule-hair) solid var(--color-rule); }
.kd__liste .m { font-family: var(--font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.kd__nr { font-family: var(--font-mono); font-size: var(--text-lg); color: var(--color-accent-deep); }

.kd .knopf { width: 100%; }
.kd__zurueck { font: inherit; font-size: var(--text-sm); background: none; border: 0; color: var(--color-muted); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; min-height: 44px; }
.kd__zurueck:hover { color: var(--color-ink); }
.kd__hinweis { font-size: var(--text-sm); color: var(--color-muted); }

@media (max-width: 40rem) { dialog.korbdialog { max-width: 100%; } }
@media (prefers-reduced-motion: no-preference) {
  dialog.korbdialog[open] { animation: rein var(--dur-short) var(--ease-out); }
  @keyframes rein { from { transform: translateX(2rem); opacity: 0; } }
}

/* ---- Team ---- */
.team { padding-block: var(--space-3xl); border-top: var(--rule-hair) solid var(--color-rule); }
.team__grid { display: grid; gap: var(--space-xl); grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.person { }
.person__foto { width: 100%; aspect-ratio: 1; object-fit: cover; background: var(--color-paper-3); display: block; }
/* Aufdeck-Effekt nur mit JS (sonst Fotos normal sichtbar). Aus Schwarzweiss
   in Farbe, deutlich aufsteigend. Dauer bewusst lang, damit man den Verlauf sieht. */
.js-reveal .person[data-reveal] { opacity: 0; transform: translateY(30px); transition: opacity 750ms var(--ease-out), transform 750ms var(--ease-out); }
.js-reveal .person[data-reveal] .person__foto { filter: grayscale(1) brightness(0.9); transition: filter 950ms var(--ease-out); }
.person[data-reveal].is-in { opacity: 1; transform: none; }
.person[data-reveal].is-in .person__foto { filter: grayscale(0) brightness(1); }
.person:hover .person__foto { filter: grayscale(0) brightness(1.03); }
.person__name { font-family: var(--font-display); font-weight: 700; font-size: var(--text-md); margin-top: var(--space-md); }
.person__rolle { color: var(--color-muted); font-size: var(--text-sm); margin-top: 0.15em; }
.person__mail { display: inline-block; margin-top: var(--space-xs); font-size: var(--text-sm); color: var(--color-accent-deep); text-decoration: none; word-break: break-all; }
.person__mail:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 40rem) { .person__mail { min-height: 44px; display: inline-flex; align-items: center; } }

/* ---- Burger und Navigations-Schublade ---- */
.kopf .wrap { position: relative; }
.burger {
  display: inline-flex; align-items: center; gap: var(--space-xs);
  font: inherit; font-weight: 600; font-size: var(--text-sm);
  background: none; border: var(--rule-hair) solid var(--color-rule-strong);
  color: var(--color-ink); cursor: pointer; min-height: 48px; padding-inline: var(--space-md);
}
.burger:hover { border-color: var(--color-ink); }
.burger__strich { display: inline-grid; gap: 4px; width: 18px; }
.burger__strich span { height: 2px; background: currentColor; border-radius: 2px; }
.kopf__rechts { margin-left: auto; display: flex; align-items: center; gap: var(--space-sm); }

dialog.navdrawer { border: 0; padding: 0; margin: 0 0 0 auto; max-width: 30rem; width: 100%; height: 100dvh; max-height: 100dvh; background: var(--color-ink-deep); color: var(--color-ink-inverse); }
dialog.navdrawer::backdrop { background: var(--color-scrim); }
.nd { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; height: 100dvh; }
.nd__kopf { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); padding: var(--space-md) var(--space-lg); border-bottom: var(--rule-hair) solid var(--color-rule-inverse); }
.nd__kopf .logo__wort { color: var(--color-ink-inverse); font-size: var(--text-lg); }
.nd__zu { font: inherit; font-size: var(--text-sm); background: none; border: var(--rule-hair) solid var(--color-rule-inverse); color: var(--color-ink-inverse); cursor: pointer; min-height: 44px; padding-inline: var(--space-md); }
.nd__zu:hover { border-color: var(--color-ink-inverse); }
.nd__liste { overflow-y: auto; padding: var(--space-lg); display: grid; gap: var(--space-2xs); align-content: start; }
.nd__liste a { font-family: var(--font-display); font-weight: 700; font-size: var(--text-xl); letter-spacing: -0.03em; color: var(--color-ink-inverse); text-decoration: none; padding: var(--space-sm) 0; display: flex; align-items: baseline; gap: var(--space-sm); }
.nd__liste a:hover, .nd__liste a:focus-visible { color: var(--color-accent-light); }
.nd__liste a small { font-family: var(--font-mono); font-weight: 400; font-size: var(--text-xs); color: var(--color-muted-inverse); letter-spacing: 0.05em; }
.nd__fuss { border-top: var(--rule-hair) solid var(--color-rule-inverse); padding: var(--space-md) var(--space-lg); display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-md); font-size: var(--text-sm); color: var(--color-muted-inverse); }
.nd__fuss a { color: var(--color-accent-light); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 40rem) { dialog.navdrawer { max-width: 100%; } .nd__liste a { font-size: var(--text-lg); } }
@media (prefers-reduced-motion: no-preference) {
  dialog.navdrawer[open] { animation: ndrein var(--dur-short) var(--ease-out); }
  @keyframes ndrein { from { transform: translateX(2rem); opacity: 0; } }
}

/* ---- Warum quattramed: Differenzierer + USP-Kette ---- */
.warum { padding-block: var(--space-3xl); border-top: var(--rule-hair) solid var(--color-rule); }
.diff { display: grid; gap: var(--space-lg); grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); margin-bottom: var(--space-2xl); }
.diff > div { border-top: var(--rule-bold) solid var(--color-accent); padding-top: var(--space-sm); }
.diff h3 { font-weight: 700; font-size: var(--text-base); }
.diff p { margin-top: var(--space-2xs); font-size: var(--text-sm); color: var(--color-muted); }
.ausbund { position: relative; padding: var(--space-lg) 0 var(--space-lg) var(--space-xl); background: var(--color-paper-2); }
.ausbund::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--color-accent); }
.ausbund__titel { font-family: var(--font-display); font-weight: 700; font-size: var(--text-lg); margin-bottom: var(--space-xs); }
.ausbund__unter { color: var(--color-muted); font-size: var(--text-sm); max-width: min(52ch, 100%); margin-bottom: var(--space-lg); }
.usp { display: grid; gap: 0; grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr)); border-top: var(--rule-hair) solid var(--color-rule); }
.usp li { list-style: none; display: flex; gap: var(--space-sm); padding: var(--space-md) var(--space-lg) var(--space-md) 0; border-bottom: var(--rule-hair) solid var(--color-rule); }
.usp__nr { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-accent-deep); font-variant-numeric: tabular-nums; flex: none; font-weight: 500; }
.usp ul { margin: 0; padding: 0; }

/* ---- Ablauf: von der Idee bis zur Lieferung ---- */
.ablauf { padding-block: var(--space-3xl); background: var(--color-paper-2); border-block: var(--rule-hair) solid var(--color-rule); }
.ablauf__spalten { display: grid; gap: var(--space-2xl); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 52rem) { .ablauf__spalten { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2xl) var(--space-4xl); } }
.weg h3 { font-weight: 700; font-size: var(--text-md); padding-bottom: var(--space-xs); border-bottom: var(--rule-bold) solid var(--color-accent); }
.weg ol { margin: var(--space-md) 0 0; padding: 0; list-style: none; counter-reset: w; display: grid; gap: var(--space-md); }
.weg li { display: grid; grid-template-columns: 2rem minmax(0, 1fr); gap: var(--space-xs) var(--space-sm); counter-increment: w; align-items: start; }
.weg li > span { min-width: 0; }
.weg li strong { min-width: 0; }
.weg li::before { content: counter(w); grid-row: span 2; font-family: var(--font-mono); font-weight: 500; color: var(--color-accent-deep); font-variant-numeric: tabular-nums; }
.weg li strong { display: block; }
.weg li span { color: var(--color-muted); font-size: var(--text-sm); }

/* ---- CSTD-Highlight ---- */
.cstd { background: var(--color-ink-deep); color: var(--color-ink-inverse); padding-block: var(--space-3xl); }
.cstd__grid { display: grid; gap: var(--space-xl); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 60rem) { .cstd__grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--space-4xl); align-items: start; } }
.cstd__kicker { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.12em; text-transform: uppercase; color: var(--color-accent-light); }
.cstd h2 { font-weight: 700; font-size: var(--text-2xl); line-height: 1.12; margin-top: var(--space-xs); max-width: min(20ch, 100%); }
.cstd p { margin-top: var(--space-md); color: var(--color-muted-inverse); max-width: min(52ch, 100%); }
.cstd__partner { margin-top: var(--space-lg); display: flex; flex-wrap: wrap; gap: var(--space-xs); }
.cstd__partner span { font-family: var(--font-mono); font-size: var(--text-sm); border: var(--rule-hair) solid var(--color-rule-inverse); padding: 0.35rem var(--space-sm); }
.cstd__punkte { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--space-md); }
.cstd__punkte li { padding-left: var(--space-md); border-left: var(--rule-bold) solid var(--color-accent); }
.cstd__punkte strong { display: block; }
.cstd__punkte span { color: var(--color-muted-inverse); font-size: var(--text-sm); }

/* ---- Folien-Slideshow ---- */
.folien { position: relative; margin-top: var(--space-lg); }
.folien__fenster { overflow: hidden; border: var(--rule-hair) solid var(--color-rule); background: var(--color-paper-2); }
.folien__spur { display: flex; transition: transform var(--dur-long) var(--ease-in-out); }
.folie { flex: 0 0 100%; min-width: 0; display: grid; place-items: center; padding: var(--space-lg); }
.folie img { width: 100%; max-width: 26rem; height: auto; display: block; box-shadow: 0 2px 10px oklch(15% 0.011 72 / 0.08); }
.folien__leiste { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); margin-top: var(--space-md); }
.folien__punkte { display: flex; gap: var(--space-xs); }
.folien__punkt { width: 12px; height: 12px; border-radius: 50%; border: var(--rule-hair) solid var(--color-rule-strong); background: none; cursor: pointer; padding: 0; }
.folien__punkt[aria-current="true"] { background: var(--color-accent); border-color: var(--color-accent); }
.folien__pfeile { display: flex; gap: var(--space-xs); }
.folien__pfeil { font: inherit; font-size: var(--text-md); line-height: 1; width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center; background: none; border: var(--rule-hair) solid var(--color-rule-strong); color: var(--color-ink); cursor: pointer; }
.folien__pfeil:hover { border-color: var(--color-ink); }
.folien__pfeil:disabled { opacity: 0.4; cursor: default; }
.folien__hinweis { font-size: var(--text-sm); color: var(--color-muted); margin-top: var(--space-sm); }

/* ---- Kompetenzfelder (aus der Broschuere) ---- */
.komp { display: grid; gap: var(--space-lg); grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)); }
.komp article { border-top: var(--rule-bold) solid var(--color-accent); padding-top: var(--space-sm); }
.komp h3 { font-weight: 700; font-size: var(--text-md); }
.komp p { margin-top: var(--space-2xs); color: var(--color-muted); font-size: var(--text-sm); }

/* ---- System-Manifest (Broschuere neu gebaut) ---- */
.panel { padding-block: var(--space-3xl); border-top: var(--rule-hair) solid var(--color-rule); }
.panel--dunkel { background: var(--color-ink-deep); color: var(--color-ink-inverse); border-top: 0; }
.panel__nr { font-family: var(--font-mono); font-weight: 500; font-size: var(--text-sm); color: var(--color-accent-deep); letter-spacing: 0.1em; }
.panel--dunkel .panel__nr { color: var(--color-accent-light); }
.gross { font-family: var(--font-display); font-weight: 800; font-size: var(--text-3xl); line-height: 1.02; letter-spacing: -0.035em; text-transform: uppercase; }
.gross em { font-style: normal; color: var(--color-accent); }

/* ---- Schlanke Fusszeile ---- */
.foot--lean { background: var(--color-ink-deep); color: var(--color-muted-inverse); border-top: 0; padding-block: var(--space-2xl) var(--space-xl); font-size: var(--text-sm); }
.foot--lean .foot__marke { display: inline-flex; align-items: center; gap: 0.4em; text-decoration: none; margin-bottom: var(--space-md); }
.foot--lean .foot__marke svg { height: 1.8rem; }
.foot--lean .foot__marke span { font-family: var(--font-display); font-weight: 800; font-size: var(--text-lg); color: var(--color-ink-inverse); letter-spacing: -0.03em; }
.foot--lean .foot__reihen { display: grid; gap: var(--space-lg) var(--space-2xl); grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; }
@media (max-width: 40rem) { .foot--lean .foot__reihen { grid-template-columns: 1fr; } }
.foot--lean nav { display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-lg); }
.foot--lean nav a { color: var(--color-ink-inverse); text-decoration: none; min-height: 40px; display: inline-flex; align-items: center; }
.foot--lean nav a:hover { color: var(--color-accent-light); }
.foot--lean .foot__adresse { color: var(--color-muted-inverse); line-height: 1.7; }
.foot--lean .foot__adresse a { color: var(--color-accent-light); }
.foot--lean .foot__unten { margin-top: var(--space-xl); padding-top: var(--space-md); border-top: var(--rule-hair) solid var(--color-rule-inverse); display: flex; flex-wrap: wrap; gap: var(--space-sm) var(--space-md); }
.foot--lean .foot__unten a { color: var(--color-muted-inverse); }

/* ---- Burger-Menue: Gruppen + Doppel-CTA ---- */
.nd__gruppe { font-family: var(--font-mono); font-size: var(--text-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-muted-inverse); margin: var(--space-lg) 0 var(--space-2xs); }
.nd__gruppe:first-child { margin-top: 0; }
.nd__liste a[aria-current="page"] { color: var(--color-accent-light); }
.nd__liste a[aria-current="page"]::before { content: "› "; color: var(--color-accent); }
.nd__cta { display: grid; gap: var(--space-sm); grid-template-columns: 1fr 1fr; padding: var(--space-md) var(--space-lg) 0; }
@media (max-width: 30rem) { .nd__cta { grid-template-columns: 1fr; } }
.nd__cta a { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; font-weight: 700; text-decoration: none; font-family: var(--font-display); }
.nd__cta a.voll { background: var(--color-accent-deep); color: var(--color-accent-ink); }
.nd__cta a.voll:hover { background: var(--color-accent); color: var(--color-ink-deep); }
.nd__cta a.rand { border: var(--rule-hair) solid var(--color-muted-inverse); color: var(--color-ink-inverse); }
.nd__cta a.rand:hover { border-color: var(--color-ink-inverse); }

/* ---- Doppel-CTA-Block (Anfrage + Termin) ---- */
.cta-band { padding-block: var(--space-3xl); border-top: var(--rule-hair) solid var(--color-rule); }
.cta-band__grid { display: grid; gap: var(--space-lg); align-items: center; grid-template-columns: minmax(0, 1fr) auto; }
@media (max-width: 52rem) { .cta-band__grid { grid-template-columns: 1fr; } }
.cta-band h2 { font-weight: 800; font-size: var(--text-xl); line-height: 1.12; max-width: min(24ch, 100%); }
.cta-band p { margin-top: var(--space-xs); color: var(--color-muted); max-width: min(48ch, 100%); }
.cta-band__knoepfe { display: flex; flex-wrap: wrap; gap: var(--space-sm); }


/* Register: kleines Bereichsbild oben */
.register__bild { width: 100%; height: 96px; object-fit: contain; background: var(--color-paper-2); border: var(--rule-hair) solid var(--color-rule); margin-bottom: var(--space-sm); }
