/* =============================================================
   pages/ueber-uns.css — Seite „ÜBER UNS“
   ============================================================= */

.about-hero { padding-block: 0 var(--space-sm); }
.about-hero .page-lead { margin-top: var(--space-sm); }

/* ---------- Warum SUPERPLUS ---------- */
.about-why { padding-block: 13px 0; }
.about-why > .container { padding-left: 50px; }
.about-why .eyebrow      { margin-bottom: 4px; }
.about-why__text         { margin-top: var(--space-sm); line-height: 1.5; }

/* ---------- FuPer-Link ---------- */
.about-fuper { padding-block: var(--space-sm) var(--space-lg); }
.about-fuper > .container { padding-inline: 10px; }

.about-fuper__media {
  width: min(630px, 100%);
  margin: var(--space-xs) auto 0;
  display: grid;
  gap: var(--space-sm);
}

.video {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--c-bg);
}
.video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Sekundäre Schaltfläche (dunkelblau, unterstrichen) */
.btn--ghost {
  padding: 18px 22px;
  background-image: none;
  background-color: #19243B;
  color: var(--c-text-strong);
  font-family: var(--f-heading);
  font-size: var(--fs-body);
  font-weight: 700;
  text-decoration: underline;
}
.btn--ghost:hover,
.btn--ghost:focus { background-color: #24325142; color: var(--c-accent); }

/* ---------- Team ---------- */
.about-team { padding-block: 0 var(--space-lg); }
.about-team > .container { padding-inline: 20px; }

.team-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-md) var(--space-sm);
  margin-top: var(--space-md);
}

.team-card__photo { width: 100%; }

.team-card__name {
  margin: 27px 0 0;
  padding-bottom: 9px;
  border-bottom: 1px solid var(--c-text);
  font-family: var(--f-heading);
  font-size: var(--fs-h4);
  font-weight: 700;
}
.team-card__role { margin: 5px 0 0; color: var(--c-text-strong); }
.team-card__mail { margin: 14px 0 0; }
.team-card__mail a { text-decoration: underline; }

@media (max-width: 767px) {
  .team-grid { grid-template-columns: 1fr; }
}
