/* =========================
PARALLAX INTRO
========================= */

.parallax--intro {
  position: relative;
  overflow: hidden;
  height: 30vh;
}

.parallax--intro__bg {
  position: absolute;
  inset: 0;
  z-index: -1;
}

/* =========================
Default (kein Parallax)
========================= */

.parallax--intro__bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;

  top: 0;
  transform: none;
}

/* =========================
Parallax State (nur wenn aktiv)
========================= */

.parallax--intro.is-parallax .parallax--intro__bg-img {
  top: 50%;
  left: 0;

  height: auto;
  min-height: 120%;

  transform: translateY(-50%);
  will-change: transform;
}

/* =========================
Content
========================= */

.parallax--intro__inner {
  padding-block: var(--space-2xl);
  text-align: center;
}

.parallax--intro__heading {
  margin-bottom: var(--space-m);
}