/* ============================================================
   ZUSATZ-CSS · Paket D (Ortsseiten, Rechtstexte, 404)
   Nur Regeln, für die es in tokens/base/components/sections
   nachweislich noch keine gibt. Ausschliesslich Tokens, keine
   Hex-Werte, keine px-Größen, keine Font-Namen.
   Wird nur von den Seiten geladen, die sie brauchen.
   ============================================================ */

/* ------------------------------------------------------------
   1 · Grundflächen der Einsatzgebiet-Karte
   Begründung: sections.css beschreibt bei `.region` ausschliesslich
   den Hover-/Fokus-Zustand von `.region__pin` und die Beschriftung.
   Die ruhenden Flächen (Landschaftsumriss, Verbindungslinie, Füllung
   der Pins, Eigenstandort, nicht verlinkte Nachbarorte) hätten sonst
   die SVG-Standardfarbe Schwarz. Als Presentation-Attribute im Markup
   wären es Hardcode-Farben — deshalb hier, tokengetrieben.
   ------------------------------------------------------------ */
.region__land { fill: var(--white); stroke: var(--border-strong) }
.region__line { fill: none; stroke: var(--border-strong) }

.region__pin circle { fill: var(--green) }
.region__pin text { font-size: var(--fs-xs) }

/* Der Ort, auf dessen Seite man gerade ist — hervorgehoben, nicht verlinkt. */
.region__here circle { fill: var(--yellow); stroke: var(--green) }
.region__here text { font-size: var(--fs-small); font-weight: var(--fw-black); fill: var(--green-900) }

/* Firmensitz Steinwiesen — Ausgangspunkt jeder Anfahrt. */
.region__base circle { fill: var(--green-900) }
.region__base text { font-size: var(--fs-xs); font-weight: var(--fw-bold); fill: var(--green-900) }

/* Orte im Einsatzgebiet ohne eigene Seite — bewusst zurückgenommen. */
.region__spot circle { fill: var(--green-600); opacity: .38 }
.region__spot text { font-size: var(--fs-xs); font-weight: var(--fw-semi); fill: var(--ink-60) }

/* Legende unter der Karte. */
.region__key { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); margin-top: var(--space-4); font-size: var(--fs-xs); color: var(--text-muted); font-weight: var(--fw-semi) }
.region__key span { display: flex; align-items: center; gap: var(--space-2) }
.region__key i { width: var(--rule-w); height: var(--rule-h); flex: none; background: var(--green) }
.region__key i.is-here { background: var(--yellow) }
.region__key i.is-base { background: var(--green-900) }

/* ------------------------------------------------------------
   2 · Suchfeld der 404-Seite
   Begründung: Eine Suche kommt auf der gesamten Website sonst nicht
   vor, components.css kennt deshalb kein Formular dieser Form. Ohne
   die Farbkorrektur wäre das Feld unlesbar: `.section--invert` dreht
   `--text` auf Weiss, `.input` behält aber die weisse Fläche.
   ------------------------------------------------------------ */
.notfound__search { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--space-3); margin-top: var(--space-7); max-width: var(--measure) }
.notfound__search .field { flex: 1 1 22ch }
.notfound__search .input { background: var(--white); color: var(--ink) }
.notfound__search .input::placeholder { color: var(--grey-500) }
.notfound__hint { margin-top: var(--space-3); max-width: var(--measure) }

/* ------------------------------------------------------------
   3 · Platzhalter in den Rechtstexten
   Begründung: Angaben, die nur der Betreiber liefern kann (Register,
   USt-IdNr., Hoster), dürfen beim Korrekturlesen nicht durchrutschen.
   Sie werden deshalb optisch aus dem Fliesstext herausgehoben.
   ------------------------------------------------------------ */
.todo {
  background: var(--yellow); color: var(--green-900);
  font-weight: var(--fw-bold); font-style: normal;
  padding: var(--space-1) var(--space-2); box-decoration-break: clone;
}