/* Solange das Menü die ganze Fläche deckt, rollt die Seite darunter nicht. */
html.pp-menu-open{overflow:hidden}
@media (min-width:46.01rem){html.pp-menu-open{overflow:visible}}
/* Aufklappen im Fenster. Ohne Skript klappt <details> an Ort und Stelle auf; mit Skript
   steht der Text im <dialog>. Aussehen der Knöpfe: das Muster — hier nur das Fenster,
   ruhig und aus den Rollen, damit es auf jeder Gestaltung trägt. */
.o-popup.is-popup summary { list-style: none; cursor: pointer }
.o-popup.is-popup summary::-webkit-details-marker { display: none }
.o-popup.is-popup summary[aria-disabled="true"] { cursor: default }
dialog.pp-popup { border: 0; padding: 40px; width: min(640px, calc(100vw - 32px)); max-height: 86vh; overflow: auto;
  background: var(--primary, #96c0ce); color: var(--ink, #333); box-sizing: border-box }
dialog.pp-popup::backdrop { background: rgb(12 12 12 / .6) }
.pp-popup-head { display: flex; align-items: center; gap: 12px; background: var(--base, #fff); padding: 18px 16px;
  border-radius: 6px 6px 0 0 }
.pp-popup-title { flex: 1; margin: 0; text-align: center; font-size: 1.5rem; letter-spacing: .08em; text-transform: uppercase }
.pp-popup-body { background: var(--base, #fff); padding: 20px 38px 28px; border-radius: 0 0 6px 6px;
  border-top: 1px dashed rgb(0 0 0 / .12) }
.pp-popup-body > * { margin: 0 }
dialog.pp-popup button { border: 0; background: transparent; cursor: pointer; font: 32px/1 system-ui, sans-serif;
  color: var(--primary, currentColor); width: 40px; height: 40px }
dialog.pp-popup button[hidden] { visibility: hidden; display: block }
dialog.pp-popup .pp-popup-close { position: absolute; top: 4px; right: 6px; color: var(--base, #fff); font-size: 26px }
dialog.pp-popup button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px }
@media (max-width: 600px) { dialog.pp-popup { padding: 36px 12px 12px } .pp-popup-body { padding: 16px 18px 22px } }
/* Video als Hintergrund. Standbild als Rückfall, und bei
   prefers-reduced-motion läuft es gar nicht erst los. */
.o-video { position: relative; overflow: hidden }
.o-video > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0 }
.o-video > :not(video) { position: relative; z-index: 1 }