/* ==========================================================================
   unternehmen.css — Textseiten unter „Unternehmen“: /unternehmen/, /pr/, /blog/
   (Markup aus scripts/gen-unternehmen.py). Nur was styles.css für Fließtext nicht hat;
   alle Werte sind Tokens aus styles.css :root (gestaltung.md, R-GEST-012..022).
   ========================================================================== */
.ut-hero { padding: var(--a-7) 0 var(--a-6); }
.ut-datum { margin-top: var(--a-1); font-size: var(--s-01); font-weight: 600; color: var(--grey); }

/* Abschnitte als Lesetext: halber Rhythmus, die Spalte hält --breite-text. */
.ut-abs { padding: var(--a-6) 0; }
.ut-abs h2 { font-size: clamp(var(--s-04), 3vw, var(--s-05)); }
.ut-abs p { margin-top: var(--a-3); max-width: 72ch; }
.ut-abs h2 + p { margin-top: var(--a-3); }
.ut-abs a:not(.btn):not(.auftrag) { color: var(--accent); text-decoration: underline; text-underline-offset: 0.2em; }
.ut-abs a:not(.btn):not(.auftrag):active { color: var(--accent-dark); }
.ut-abs .liste { max-width: 72ch; }

@media (hover: hover) {
  .ut-abs a:not(.btn):not(.auftrag):hover { color: var(--accent-dark); }
}

/* Bildband mit Parallaxe (js/parallax.js). Ohne Skript und mit prefers-reduced-motion füllt das
   Bild das Band und zeigt seine Mitte; mit Skript setzt parallax.js Überstand (top, height) und
   Verschiebung inline — das Bild läuft dann langsamer als die Seite. */
.ut-bild { position: relative; margin: 0; height: clamp(12rem, 32vw, 28rem); overflow: hidden; background: var(--accent-soft); }
.ut-bild img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; }
.mit-parallaxe .ut-bild img { will-change: transform; }
/* Flache Panoramen (Seitenverhältnis über 2,2 : 1, gesetzt von gen-unternehmen.py): niedrigeres Band,
   sonst bleibt bei voller Bildbreite kein Weg für die Parallaxe. */
.ut-bild--panorama { height: clamp(10rem, 24vw, 22rem); }
@media (prefers-reduced-motion: reduce) {
  .mit-parallaxe .ut-bild img { top: 0 !important; height: 100% !important; transform: none !important; will-change: auto; }
}

/* Kacheln der Pressemeldungen auf /pr/ (gen-unternehmen.py): Bauweise der Auftrags-Kacheln der
   Startseite (.auftraege/.auftrag in styles.css), hier als Verweis auf die Unterseite der Meldung. */
.ut-kacheln { padding-top: var(--a-6); padding-bottom: 0; border-top: 0; }
.ut-kacheln .auftraege { margin-top: 0; }
.ut-kacheln h2 { font-size: clamp(var(--s-04), 3vw, var(--s-05)); }
a.auftrag { text-decoration: none; }
.auftrag__foto { object-position: center; }
.ut-kachel__datum { margin: var(--a-3) var(--a-3) 0; font-size: var(--s-01); font-weight: 600; color: var(--grey); }
.ut-kachel__datum + .auftrag__titel { margin-top: var(--a-0); }

/* Rückweg auf der Unterseite einer Meldung. */
.ut-zurueck { margin-bottom: var(--a-3); font-size: var(--s-01); font-weight: 600; }
.ut-zurueck a { display: inline-flex; align-items: center; min-height: var(--ziel); color: var(--accent); text-decoration: none; }
.ut-zurueck a::before { content: "\2039\00a0"; }
.ut-zurueck a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.ut-zurueck a:active { color: var(--accent-dark); }
@media (hover: hover) { .ut-zurueck a:hover { color: var(--accent-dark); text-decoration: underline; } }