/* src/styles/fix-image-width.css */
/* Wiederherstellung der Bild-Eigenproportion beim Dorsten-Logo im Abbinder.

   Grund: Der Publisher ergaenzt an jedem <img> die Praesentationsattribute
   width="2000" height="857". Das Logo ist im Design nur ueber die Hoehe
   dimensioniert (height: 34px), eine Breite ist nicht gesetzt. Zusammen mit
   max-width: 100% loest die Attributbreite auf die Containerbreite auf -
   das Logo erschien 520 x 38 statt 89 x 38. Ein Autoren-Selektor schlaegt
   das Attribut.

   Frueherer Selektor war img:not([style*="width"]). Der hing am Inline-Stil
   und haette beim Umbau auf Klassen 184 weitere Bilder faelschlich erfasst,
   sobald deren Breite aus dem style-Attribut in eine Klasse wandert.
   Deshalb jetzt am Bild selbst festgemacht: Es ist site-weit das einzige
   betroffene Motiv, 29-mal eingebunden - einmal je Seite im Abbinder. */

img[src$="dorsten-logo-2024-weiss.png"] {
  width: auto;
}


/* src/styles/fix-nav-solid.css */
/* Wiederherstellung des Scroll-Zustands der Kopfzeile.
   Grund: Der Publisher emittiert Selektoren mit einem html.<klasse>-Kompound
   nicht (im Editor-Register vorhanden, im veroeffentlichten CSS null).
   Das Skript setzt html.nav-solid korrekt, es fehlten nur die Regeln.
   Wortlaut unveraendert aus dem <style>-Block der statischen Seiten. */

html.nav-solid header[data-site-nav] {
  background: rgba(241, 247, 246, .86) !important;
  backdrop-filter: blur(18px) !important;
  border-bottom-color: rgba(26, 26, 24, .10) !important;
}

html.nav-solid header[data-site-nav] a,
html.nav-solid header[data-site-nav] button {
  color: #1A1A18 !important;
}

html.nav-solid header[data-site-nav] nav > a:hover,
html.nav-solid header[data-site-nav] nav button:hover {
  background: #DCE7E5 !important;
}

html.nav-solid header[data-site-nav] nav button[data-open="true"] {
  background: #DCE7E5 !important;
}

html.nav-solid header[data-site-nav] button[aria-label] span {
  background: #1A1A18;
}


/* src/styles/hov/index.css */
/* Kollisionsfeste data-hov-Regeln — Startseite.
   data-hov ist ein seitenlokaler Zaehler; der Import faltet die Stylesheets
   aller 29 Seiten zusammen. Der Gewinner wird PRO EIGENSCHAFT ermittelt,
   darum werden hier alle Eigenschaften zurueckgesetzt, die irgendeine
   Fremdregel setzt — nicht nur die der letzten. */

body [data-hov="0"]:hover {
  background: rgb(255, 255, 255) !important;
  color: rgb(26, 26, 24) !important;
  border-color: rgb(129, 177, 34) !important;
  box-shadow: rgba(26, 26, 24, 0.1) 0px 14px 34px !important;
  transform: translateY(-3px) !important;
}
body [data-hov="1"]:hover {
  background: rgb(26, 26, 24) !important;
  color: inherit !important;
  border-color: rgb(129, 177, 34) !important;
  box-shadow: none !important;
  transform: translateY(-3px) !important;
}
body [data-hov="2"]:hover {
  background: transparent !important;
  color: rgb(95, 134, 25) !important;
  border-color: rgb(129, 177, 34) !important;
  box-shadow: none !important;
  transform: none !important;
}
body [data-hov="3"]:hover {
  background: transparent !important;
  color: rgb(95, 134, 25) !important;
  box-shadow: none !important;
  transform: none !important;
}
body [data-hov="4"]:hover {
  background: transparent !important;
  color: rgb(0, 125, 191) !important;
  box-shadow: none !important;
  transform: none !important;
}
body [data-hov="5"]:hover {
  background: rgb(220, 231, 229) !important;
  box-shadow: none !important;
  transform: none !important;
}


/* src/styles/fix-keyframes-index.css */
/* Wiederherstellung der Kreisbewegung im Hero.
   dor-spin ist auf 4 Seiten UNTERSCHIEDLICH definiert. Der Import faltet die
   Stylesheets zusammen, dabei hat die Variante der drei Unterseiten
   (to{transform:rotate(360deg)}) die der Startseite ueberschrieben.

   Folge: Der Startkeyframe fehlt und der Translate-Anteil ist weg. Der Browser
   interpoliert dann vom aktuellen translateY(-50%) auf reines rotate(360deg) —
   das Element faehrt nach unten und springt beim Schleifenstart zurueck.

   Hier die Definition der Startseite im Originalwortlaut. Sie laedt zuletzt
   und gewinnt damit fuer diese Seite. */

@keyframes dor-spin {
  from { transform: translateY(-50%) rotate(0deg); }
  to   { transform: translateY(-50%) rotate(360deg); }
}


/* src/styles/fix-hero-ring-round.css */
/* Haelt die dekorativen Kreiselemente rund.

   Beide Ringe sind quadratisch angelegt (width und height jeweils
   min(1400px, 150vh) bzw. min(1500px, 180vh)). Die Reset-Regel
   img,video,svg{max-width:100%} — im Original wie in Instatic vorhanden —
   klemmt aber nur die BREITE auf die Containerbreite, waehrend die Hoehe
   stehen bleibt. Ergebnis: ein Oval, das sich dreht.

   Sichtbar genau im Band zwischen 769px und rund 1350px Viewportbreite:
     Viewport 1440x900 : gewuenscht 1350px, Breite 1350px -> Kreis
     Viewport 1180x820 : gewuenscht 1230px, Breite 1180px -> Oval
     Viewport  820x1180: gewuenscht 1400px, Breite  820px -> Oval
   Unterhalb 768px greift die Mobil-Regel des Designs, die max-width
   ausdruecklich auf none setzt — dort war das Problem also schon geloest,
   fuer den Bereich darueber fehlte dieselbe Absicherung.

   Das ist kein Importfehler: Die statische Vorlage verhaelt sich genauso.

   Unbedenklich, weil beide Ringe absolut positioniert in Sektionen mit
   overflow:hidden liegen und body zusaetzlich overflow-x:hidden traegt —
   der Ueberstand wird abgeschnitten, genau wie in der Desktop-Ansicht. */

[data-hero-ring],
[data-screen-label="Imagefilm"] svg[aria-hidden="true"] {
  max-width: none !important;
}


/* src/styles/token-aliase.css */
/* Vereinheitlichung der doppelten Design-Tokens.

   Grund: Beim Import wurde die Token-Datei zweimal eingelesen. Instatic
   vergibt bei Namenskollisionen den Suffix -2, daher stehen im Farb-Panel
   66 Eintraege statt 33 - jede Marke einmal als "dor-green" und einmal als
   "dor-green-2". Die Elemente sind auf beide Saetze verteilt, mit klarem
   Uebergewicht auf den Schattenkopien (z. B. dor-anti-flash-2: 152
   Verwendungen gegenueber dor-anti-flash: 1).

   Folge ohne diese Datei: Wer im Panel "dor-anti-flash" aendert, aendert
   genau ein Element. Die anderen 152 haengen am -2-Zwilling.

   Diese Datei bindet jede Schattenkopie an ihr Original. Danach ist der
   Eintrag OHNE Suffix die alleinige Quelle - eine Aenderung dort wirkt auf
   100 % der Verwendungen.

   Farbneutral: Alle 22 Paare wurden vor der Umstellung auf :root-Ebene
   verglichen und sind wertgleich. Es aendert sich kein einziger Pixel.

   Die Zuweisung steht auf :root und wird - wie bisher bei den -2-Tokens -
   unveraendert in dunkle Abschnitte vererbt. Die Umschaltung von
   .on-dark-2 betrifft ausschliesslich die Basisnamen und bleibt dadurch
   wirkungsgleich.

   Die -2-Eintraege koennen jetzt gefahrlos aus dem Farb-Panel geloescht
   werden: Ihre Werte werden nicht mehr gelesen, die Namen bleiben ueber
   diese Datei bedient. */

:root {
  /* Markenfarben */
  --dor-green-2: var(--dor-green);
  --dor-green-ink-2: var(--dor-green-ink);
  --dor-blue-2: var(--dor-blue);
  --dor-blue-ink-2: var(--dor-blue-ink);
  --dor-indigo-dye-2: var(--dor-indigo-dye);
  --dor-mindaro-2: var(--dor-mindaro);
  --dor-eerie-black-2: var(--dor-eerie-black);
  --dor-anti-flash-2: var(--dor-anti-flash);
  --dor-white-2: var(--dor-white);

  /* Flaechen hell */
  --surface-0-2: var(--surface-0);
  --surface-1-2: var(--surface-1);
  --surface-2-2: var(--surface-2);
  --surface-light-3: var(--surface-light);

  /* Flaechen dunkel */
  --surface-dark-0-2: var(--surface-dark-0);
  --surface-dark-1-2: var(--surface-dark-1);
  --surface-dark-2-2: var(--surface-dark-2);
  --surface-dark-3-2: var(--surface-dark-3);

  /* Text und Linien */
  --text-on-dark-muted-2: var(--text-on-dark-muted);
  --text-on-light-muted-2: var(--text-on-light-muted);
  --border-strong-2: var(--border-strong);
  --border-field-2: var(--border-field);

  /* Schrift */
  --font-core-2: var(--font-core);
  --font-editorial-2: var(--font-editorial);
}