/* ================================================================
   Umsonst und Draußen 2022 — Seitenspezifische Styles
   Gemeinsame Klassen (story-grid-*, story-closing, story-back,
   story-full, has-fullscreen-hero) liegen in style.css
   ================================================================ */

/* ── Hero ──────────────────────────────────────────────────────── */
.uud22-hero {
  position: relative;
  height: 100svh;
  min-height: 560px;
  background: #0b1c26;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
}
.uud22-hero-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}
.uud22-hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(11,28,38,0.88) 0%,
    rgba(11,28,38,0.35) 45%,
    rgba(11,28,38,0.20) 70%,
    rgba(11,28,38,0.50) 100%
  );
}
.uud22-hero-content {
  position: relative;
  z-index: 1;
  padding: 64px 72px;
  width: 100%;
}
/* ── .page-hero-label Farbüberschreibung ── */
.uud22-hero .page-hero-label {
  color: var(--coral);
}

/* ── .hero-title: Basiswerte passen bereits, kein Override nötig ── */

/* ── Kapitel ───────────────────────────────────────────────────── */
.uud22-chapter { padding-top: 100px; }
.uud22-chapter-head {
  max-width: 640px;
  margin: 0 auto;
  padding: 0 48px 52px;
}
.uud22-chapter-label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--coral);
  display: block;
  margin-bottom: 14px;
}
.uud22-chapter-title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(28px, 3.5vw, 44px);
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--night);
  margin-bottom: 20px;
}
.uud22-chapter-text {
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 1.8;
  color: var(--night);
}

/* ── Responsive ────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .uud22-hero-content { padding: 48px 40px; }
  .uud22-chapter-head { padding: 0 32px 44px; }
}
@media (max-width: 640px) {
  .uud22-hero-content { padding: 40px 24px; }
  .uud22-chapter-head { padding: 0 24px 36px; }
}