/* Farbraum an das Funky-Seabirds-Bild angepasst (Disco-Funk: Magenta/Gold/tiefes Violett)
   statt der maritimen Hellblau/Sand-Palette der übrigen Seiten. Nur für den
   Teaser-Hero unten gescoped, Nav/Footer bleiben im Standard-Look wie alle Seiten. */
:root {
  --sb-purple-deep: #1B0E2E;
  --sb-magenta: #D6368F;
  --sb-gold: #E8A93C;
  --sb-gold-deep: #A9741F;
  --sb-cream: #F7EFE0;
}

.seabirds-hero {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  padding: 140px 0 80px;
  overflow: hidden;
  color: var(--sb-cream);
}

.seabirds-hero .hero-media img {
  object-position: center 30%;
}

.seabirds-hero .hero-scrim {
  background: linear-gradient(180deg, rgba(27, 14, 46, 0.55) 0%, rgba(27, 14, 46, 0.72) 55%, rgba(27, 14, 46, 0.92) 100%);
}

.seabirds-teaser {
  position: relative;
  z-index: 1;
  max-width: 720px;
}

.seabirds-teaser .eyebrow {
  color: var(--sb-gold);
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.seabirds-teaser h1 {
  font-family: 'Fraunces', serif;
  font-size: clamp(34px, 6vw, 64px);
  line-height: 1.08;
  margin: 18px 0 22px;
  color: var(--sb-cream);
}

.seabirds-teaser h1 em {
  font-style: italic;
  color: var(--sb-magenta);
}

.seabirds-teaser .lead {
  font-family: 'Inter', sans-serif;
  font-size: 18px;
  color: #E4D6EC;
  max-width: 46ch;
}

.seabirds-teaser .hero-tags {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 28px;
}

.seabirds-teaser .tag {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: var(--sb-purple-deep);
  background: var(--sb-gold);
  padding: 6px 14px;
  border-radius: 100px;
}

.seabirds-teaser .tag.magenta {
  background: var(--sb-magenta);
  color: #fff;
}