/*
  Zertifikate-Seite (zertifikate/index.php, en/certificates/index.php),
  Rescue Trade™ Website.
  Kein Design-Entwurf vorhanden, Gestaltung aus dem bestehenden
  Komponentensystem abgeleitet (Hero/Marquee/Eyebrow-Muster wie
  Startseite/Firma/Produktseiten, stat-list wie Firma "Zulassung").
  Wiederverwendbare Bausteine liegen in css/components.css.
*/

/* -----------------------------------------------------------------
   01 Hero – Lagerfoto poster-warehouse.jpg (1920×1080), bisher
   ungenutzt und thematisch passend zu Qualitäts-/Logistiknachweisen.
   home-warehouse.jpg bleibt Hero auf Firma; Startseite nutzt Video.
   Markup wie Firma (.hero__media + Scrim), anthrazit-Grund bleibt
   Fallback wenn das Bild fehlt.
----------------------------------------------------------------- */
.hero {
  min-height: 88vh;
}
.hero__content {
  padding-bottom: var(--space-72);
}
.hero__title {
  margin: 0 0 var(--space-32);
  font-weight: var(--fw-black);
  font-size: var(--fs-h2-xl);
  line-height: var(--lh-098);
  letter-spacing: var(--ls-tight-025);
  text-transform: none;
  max-width: var(--measure-900);
}
.hero__subline {
  max-width: var(--measure-620);
}

/* -----------------------------------------------------------------
   02 ISO 13485 – Prüfzeichen links, Text rechts (2-Spalten-Grid),
   weißer Grund (kein gray-100 hinter Siegel/Block). Siegel vertikal
   mittig zum Text (+ leichter Versatz nach unten). Prüfzeichen ist
   freigestellte Grafik mit object-fit: contain (kein Cover-Zuschnitt
   wie .zoom-media).
----------------------------------------------------------------- */
.zert-iso {
  padding: var(--space-170) 0 var(--space-110);
  background: var(--color-white);
}
.zert-iso__grid {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: var(--space-96);
  align-items: center;
}
.zert-iso__badge {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-white);
  border-radius: var(--radius-sm);
  padding: var(--space-24);
  /* vertikal mittig zum Text (align-items: center), plus etwas nach unten */
  margin-top: var(--space-32);
}
.zert-iso__badge img {
  display: block;
  width: 100%;
  max-width: 260px;
  height: auto;
}
.zert-iso__eyebrow {
  margin-bottom: var(--space-20);
}
.zert-iso__h2 {
  margin: 0 0 var(--space-32);
  font-family: var(--font-sans);
  font-weight: var(--fw-extrabold);
  font-size: var(--fs-h2-lg);
  line-height: var(--lh-1);
  letter-spacing: var(--ls-tight-025);
  color: var(--color-black);
  overflow-wrap: break-word;
}
.zert-iso__text p {
  margin: 0 0 var(--space-20);
  font-size: var(--fs-16);
}
.zert-iso__text p:last-child {
  margin-bottom: 0;
}
.zert-iso__scope-label {
  margin: var(--space-40) 0 var(--space-8);
}

/* -----------------------------------------------------------------
   03 Weitere Zulassungen – reine Layout-Hülle, Einträge sind
   unverändert .stat-list/.stat-list__item (siehe components.css).
----------------------------------------------------------------- */
.zert-zulassungen {
  padding: var(--space-110) 0 var(--space-170);
}
.zert-zulassungen__head {
  max-width: var(--measure-900);
  margin-bottom: var(--space-72);
}
.zert-zulassungen__eyebrow {
  margin-bottom: var(--space-20);
}
.zert-zulassungen__h2 {
  margin: 0;
  font-family: var(--font-sans);
  font-weight: var(--fw-extrabold);
  font-size: var(--fs-h2-lg);
  line-height: var(--lh-1);
  letter-spacing: var(--ls-tight-025);
  color: var(--color-black);
}

.zert-iso__download {
  margin-top: var(--space-40);
}

/* -----------------------------------------------------------------
   04 Abschluss – .cta-panel (components.css) hat von sich aus kein
   oberes Padding, siehe css/pages/produkt.css für dieselbe Situation
   und Begründung (dort zuerst behoben, hier identisch übernommen).
----------------------------------------------------------------- */
.cta-panel {
  padding-top: var(--space-170);
}

@media (max-width: 900px) {
  .zert-iso {
    padding: var(--space-96) 0 var(--space-72);
  }
  .zert-iso__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-48);
  }
  /* Mobil: Siegel zentriert oben über dem Text (Desktop bleibt links/rechts). */
  .zert-iso__badge {
    max-width: 260px;
    width: 100%;
    margin-top: 0;
    margin-left: auto;
    margin-right: auto;
    justify-self: center;
  }
  .zert-zulassungen {
    padding: var(--space-72) 0 var(--space-96);
  }
  .cta-panel {
    padding-top: var(--space-96);
  }
}