/* Variantenverzeichnis: Strukturergänzungen, vorhandene Typografie und Farben bleiben erhalten. */
.nrw-v-languagebar { display: flex; justify-content: flex-end; padding-top: 1rem; padding-bottom: .5rem; }
.nrw-v-languages { display: flex; flex-wrap: wrap; gap: .5rem; }
.nrw-v-languages a { min-width: 44px; min-height: 44px; justify-content: center; }
.nrw-v-languages a[aria-current="page"] { border-color: var(--c-accent); background: var(--c-accent-soft); }
.nrw-v-languages a:focus-visible, .nrw-v-image:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 3px; }
.nrw-model-schnitte { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: 1rem; margin-top: 1rem; align-items: start; }
.nrw-schnitt-card { margin: 0; min-width: 0; border: 1px solid var(--c-line); border-radius: var(--radius-sm); background: var(--c-white); overflow: hidden; }
.nrw-schnitt-card figcaption { padding: .75rem; border-bottom: 1px solid var(--c-line); overflow-wrap: anywhere; }
.nrw-model-skizze .nrw-v-image { padding-bottom: 2.4rem; }
.nrw-model-skizze .nrw-v-image > img { box-sizing: border-box; width: 100%; max-width: 100%; height: 160px; max-height: none; aspect-ratio: auto; padding: .5rem; object-fit: contain; object-position: center; transform: none; }
.nrw-model-skizze .nrw-v-image > img[data-v-axis="vertikal"] { height: 320px; }
.nrw-schnitt-card > p { padding: 0 .75rem; }
.nrw-v-de { white-space: nowrap; }
.nrw-v-explain, .nrw-v-legend dl { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); gap: .5rem 1rem; margin: 1.5rem 0; }
.nrw-v-explain dt, .nrw-v-legend dt { min-width: 0; overflow-wrap: anywhere; }
.nrw-v-explain dd, .nrw-v-legend dd { margin: 0; min-width: 0; }
.nrw-v-legend { border: 1px solid var(--c-line); border-radius: var(--radius); padding: 1rem; margin: 1.5rem 0; }
.nrw-v-legend summary { cursor: pointer; }
.nrw-v-external-note { padding-top: 1rem; padding-bottom: 1rem; }
[data-varianten-app] [aria-disabled="true"] { opacity: .5; cursor: default; }
[data-varianten-app] .nrw-model-card { min-width: 0; }
[data-varianten-app] .cat-card-body { overflow-wrap: anywhere; }
.nrw-v-zoom { width: min(1180px, 96vw); max-width: 96vw; max-height: 94vh; max-height: 94dvh; margin: auto; padding: 1rem; border: 1px solid var(--c-line); border-radius: var(--radius); background: var(--c-white); color: inherit; box-shadow: var(--shadow-md); overflow: auto; }
.nrw-v-zoom::backdrop { background: rgba(0,0,0,.68); }
.nrw-v-zoomhead, .nrw-v-zoomtools { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; margin-bottom: .75rem; }
.nrw-v-zoomhead strong { min-width: 0; overflow-wrap: anywhere; }
.nrw-v-zoomhead button, .nrw-v-zoomtools button { min-height: 44px; }
.nrw-v-zoomtools { justify-content: flex-start; }
.nrw-v-zoomtools [aria-pressed="true"] { background: var(--c-accent-soft); border-color: var(--c-accent); }
.nrw-v-canvas { overflow: auto; max-width: 100%; max-height: 65vh; max-height: 65dvh; border: 1px solid var(--c-line); background: var(--c-white); }
.nrw-v-canvas img { display: block; margin: auto; width: auto; height: auto; max-width: 100%; max-height: 63vh; max-height: 63dvh; object-fit: contain; }
.nrw-v-canvas[data-original="true"] img { max-width: none; max-height: none; }
.nrw-v-zoom p { margin: .75rem 0; }
.nrw-v-zoom a { overflow-wrap: anywhere; }
@media (max-width: 640px) {
 .nrw-v-languagebar { justify-content: center; }
 .nrw-v-explain, .nrw-v-legend dl { grid-template-columns: minmax(0,1fr); }
 .nrw-v-explain dd, .nrw-v-legend dd { margin-bottom: .75rem; }
 .nrw-v-zoom { padding: .75rem; }
 .nrw-v-zoomhead { align-items: flex-start; }
 .nrw-v-zoomhead strong { flex: 1; }
 .nrw-v-zoomtools button { flex: 1 1 auto; }
}
@media print { .nrw-v-languages, .nrw-v-zoom { display: none !important; } .nrw-schnitt-card { break-inside: avoid; } }

/* Geöffnete Modellkarten erhalten Platz für beide tatsächlichen Schnitte. */
[data-varianten-app] .nrw-wissen-grid { align-items: start; }
[data-varianten-app] .nrw-model-card:has(details[open]) { grid-column: 1 / -1; }
@media (min-width: 900px) {
 .nrw-model-card:has(details[open]) .nrw-model-schnitte { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); }
 .nrw-model-card:has(details[open]) .nrw-v-image > img,
 .nrw-model-card:has(details[open]) .nrw-v-image > img[data-v-axis="vertikal"] { height: 380px; }
}