:root {
  background-color: var(--groupui-sys-color-background-canvas);
}

body {
  margin: 0; /* Reset für einen nahtlosen Header */
}

/* Layout Container: 1620px Begrenzung und Zentrierung */
main {
  max-width: 1620px;
  margin: 0 auto;
  padding: var(--groupui-sys-spacing-600);
}

/* Karten Design */
.content-card,
.image-card {
  margin-bottom: var(--groupui-sys-spacing-600);
}

/* Scheckkartenformat für Bilder (ISO 7810 ID-1: 85,60 mm × 53,98 mm) */
.id-card-img {
  max-width: 330px; /* Maximalwert in Pixeln */
  aspect-ratio: 856 / 539; /* ISO 7810 ID-1 Seitenverhältnis */
  object-fit: cover;
  border-radius: 3.18mm; /* Eckenradius für Scheckkarten */
  box-shadow: var(--groupui-sys-shadow-m);

   /* Hinzugefügter Rahmen für Kontrast im Darkmode */
  border: var(--groupui-sys-border-width-s) var(--groupui-sys-stroke-style-primary) var(--groupui-sys-color-line-weak);

  display: block;
  margin: 0 auto var(--groupui-sys-spacing-400) auto; /* Zentrierung und Abstand nach unten */
}

.image-card > p:last-child {
  margin-bottom: 0;
}

/* Hilfsklassen */
.text-center {
  text-align: center;
}