/* Hochzeitsseite. Baut auf strecke-de.css auf; alle Regeln hängen an eigenen hz-Klassen und laden nur auf dieser Seite. */

/* Einstieg: ein Querbild in voller Breite */
.labva .hz-hero { aspect-ratio: 3 / 2; margin-top: var(--s-6); }
.labva .hz-hero img, .labva .hz-paar .img img, .labva .hz-reihe .img img, .labva .hz-hoch img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (min-width: 1024px) { .labva .hz-hero { aspect-ratio: 2 / 1; } .labva .hz-hero img { object-position: 50% 30%; } }

/* Der Tag: drei Stationen mit Zeichnung */
.labva .hz-stationen { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-6) var(--gutter); }
@media (min-width: 768px) { .labva .hz-stationen { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4) var(--s-6); } }
.labva .hz-station { border-top: 1px solid var(--color-line-strong); padding-top: var(--s-3); }
.labva .hz-station .eyebrow { padding-top: var(--s-3); }
.labva .hz-station .t-h3 { margin-top: var(--s-1); font-size: 28px; line-height: 34px; }
.labva .hz-station .t-body { margin-top: var(--s-1); }
.labva .hz-svg { display: block; width: 100%; max-width: 220px; height: auto; overflow: visible; }
.labva .hz-svg path, .labva .hz-svg circle { fill: none; stroke: var(--color-text); stroke-linecap: round; stroke-linejoin: round; }
/* Strich wie im Saalplan (.sp-svg): feste Strichstärken, unabhängig von der Größe der Zeichnung */
.labva .hz-svg * { vector-effect: non-scaling-stroke; }
.labva .hz-svg .k1 { stroke-width: 1.45px; }
.labva .hz-svg .k2 { stroke-width: .9px; }
.labva .hz-svg .k3 { stroke-width: .9px; }
.labva .hz-svg .k4 { stroke-width: .62px; stroke-opacity: .5; }

/* Bildpaar und Dreierreihe */
.labva .hz-paar { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s-4) var(--gutter); margin-top: var(--s-6); }
@media (min-width: 768px) { .labva .hz-paar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); } }
.labva .hz-paar figure, .labva .hz-reihe figure { margin: 0; }
.labva .hz-paar .img { aspect-ratio: 3 / 2; }
.labva .hz-reihe { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); margin-top: var(--s-6); }
@media (max-width: 767px) { .labva .hz-reihe { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3) var(--gutter); } }
.labva .hz-reihe .img { aspect-ratio: 4 / 3; }
.labva .hz-hoch { aspect-ratio: 4 / 3; }
@media (max-width: 1023px) { .labva .hz-hoch { margin-top: var(--s-4); } }

/* Rechenbeispiel im Champagner-Block */
.labva .hz-beispiel { background: var(--color-surface-raised); }
@media (max-width: 1023px) { .labva .hz-beispiel { margin-top: var(--s-4); } }
