/* Seitenkopf-Runde 13.10.2026 (Vorbild mercedes-benz.de). Nach kopf.css geladen. */

/* ── Seitenkopf: Titel im Mercedes-Maß (Desktop 52–56 px), Subtext, zwei Pillen ── */
.bb-m-kopf__titel,
.bb-m-kopf.bb-m-kopf--start .bb-m-kopf__titel,
.bb-m-kopf--typo .bb-m-kopf__titel,
.bb-m-kopf--artikel .bb-m-kopf__titel,
.bb-m-kopf--satz .bb-m-kopf__titel {
  font-size: clamp(2rem, 1.25rem + 2.4vw, 3.5rem);
  line-height: 1.08;
  max-width: 17em;
}
.bb-m-kopf__subline,
.bb-m-kopf--artikel .bb-m-kopf__subline,
.bb-m-kopf--start .bb-m-kopf__subline,
.bb-m-kopf--medium .bb-m-kopf__subline {
  max-width: 38rem;
  margin-top: 1.125rem;
  font-size: clamp(1rem, 0.95rem + 0.15vw, 1.125rem);
  line-height: 1.5;
  font-weight: 400;
}
.bb-m-kopf__knoepfe,
.bb-m-kopf--start .bb-m-kopf__knoepfe,
.bb-m-kopf--branche .bb-m-kopf__knoepfe {
  flex-wrap: nowrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}
.bb-m-kopf__knoepfe .bb-knopf,
.bb-m-kopf--start .bb-knopf {
  min-height: 3rem;
  padding-inline: 1.75rem;
  font-size: 1rem;
  font-weight: 600;
}
@media (max-width: 420px) {
  .bb-m-kopf__knoepfe .bb-knopf { padding-inline: 1.125rem; min-height: 2.75rem; font-size: 0.9375rem; }
}
/* Kontur-Pille im Kopf: helle Linie, wie bei Mercedes */
.bb-m-kopf__knoepfe .bb-knopf--kontur { border-color: color-mix(in srgb, var(--bb-text) 55%, transparent); }

/* ── Startseite: Film-Kopf füllt den Bildschirm unter der Kopfleiste ── */
.bb-m-kopf.bb-m-kopf--start {
  min-height: max(calc(100svh - var(--bm-kopf-h) - 2rem), 40rem);
  padding-bottom: clamp(5rem, 9svh, 7rem);
}
@media (max-width: 767px) {
  .bb-m-kopf.bb-m-kopf--start { min-height: max(calc(100svh - var(--bm-kopf-h) - 2rem), 34rem); }
}