/* Basic Tier — Teaser
   ------------------------------------------------------------
   1) Weicher Schlagschatten am Teaser-Unterrand (fadet nach unten aus).
      box-shadow statt Gradient-Overlay, weil #teaser-slider im Kernel
      `overflow: hidden` hat — ein darunter positioniertes ::after würde
      geclippt; der box-shadow liegt AUSSERHALB der Box. z-index hebt den
      Teaser über die Folge-Sections, sonst verdeckt deren BG den Schatten.
   2) Abdunklung des Hero-Bilds: sattes Schwarz als halbtransparenter Scrim
      (statt des grau-getönten Kernel-Scrims), beim Laden sanft eingefadet.
   ------------------------------------------------------------ */
#teaser-slider {
  position: relative;   /* Kernel setzt das bereits — hier nur zur Sicherheit */
  z-index: 1;
  box-shadow: 0 2.25rem 2.75rem -1.25rem hsl(0 0% 0% / 0.30);
}

/* Sattes Schwarz als Verlauf: oben dunkel → unten klar (cinematisch, Wortmark/
   Headline oben heben sich ab). Deckkraft pro Ende justierbar
   (--teaser-scrim-top / --teaser-scrim-bottom; 0 = klar … 1 = ganz schwarz).
   Animation: der Scrim fadet beim Laden sanft ein. */
#teaser-slider .bg::after {
  --teaser-scrim-top:    0.60;
  --teaser-scrim-mid:    0.68;   /* Mitte: hier sitzt der weiße Hero-Text → dunkler */
  --teaser-scrim-bottom: 0.10;
  background: linear-gradient(
    to bottom,
    rgb(0 0 0 / var(--teaser-scrim-top)) 0%,
    rgb(0 0 0 / var(--teaser-scrim-mid)) 50%,
    rgb(0 0 0 / var(--teaser-scrim-bottom)) 100%
  );
  animation: teaser-scrim-in 900ms ease both;
}

/* Abdunklung beim Laden einfaden: Bild zuerst klar → dann abgedunkelt. */
@keyframes teaser-scrim-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Bewegung reduzieren (OS-Einstellung): kein Einfaden, Scrim sofort da. */
@media (prefers-reduced-motion: reduce) {
  #teaser-slider .bg::after {
    animation: none;
  }
}