/* Impressum, Datenschutz and their English pages (imprint, data protection): one calm column, about 70 characters wide,
   their headings as headings, their words untouched. Shared by all four; loaded after site.css and pages.css.
   Media rules at the END. */

.legal__col { width: min(100% - 2 * var(--gutter), 44rem); }
.legal .open { padding-block: clamp(28px, 4vw, 56px) clamp(8px, 2vw, 24px); }
.legal .open .title { font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.4rem); }

/* the jump row: their section headings as quiet pills; the long ones wrap inside the pill instead of running off */
.legal .jump { margin-top: 22px; }
.legal .jump a { height: auto; min-height: 36px; padding: 7px 16px; border-radius: 18px; line-height: 1.35; }

.legal__body { padding-bottom: clamp(56px, 7vw, 96px); overflow-wrap: anywhere; }
.legal__body > * + *, .legal__sec > * + * { margin-top: 1em; }
.legal__body p, .legal__body li { color: var(--ink); line-height: 1.7; } /* plain wrapping: their lines are long and legal, no balancing */
.legal__body a { color: var(--accent-ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.legal__body a:hover { text-decoration-thickness: 2px; }
.legal__body ul, .legal__body ol { padding-left: 1.4em; }
.legal__body li + li { margin-top: 0.5em; }
.legal__body li::marker { color: var(--accent-ink); }

.legal__body h2 { font-size: clamp(1.5rem, 1.3rem + 0.8vw, 1.9rem); margin-top: clamp(40px, 5vw, 64px); text-wrap: balance; }
.legal__body h3 { font-size: clamp(1.15rem, 1.1rem + 0.35vw, 1.35rem); margin-top: 1.9em; }
.legal__body h2 + *, .legal__body h3 + * { margin-top: 0.7em; }
.legal__sec { scroll-margin-top: var(--nav-h); }
.legal__sec:first-child h2 { margin-top: clamp(40px, 5vw, 64px); }
.legal__sec > h2 { margin-top: 0; }
.legal__sec + .legal__sec, .legal__body > p + .legal__sec { margin-top: clamp(40px, 5vw, 64px); }

/* the imprint: the address first, a little larger */
.legal__who { font-size: 1.12rem; line-height: 1.6; padding-left: 16px; border-left: 2px solid var(--line); }

@media (max-width: 640px) {
  .legal .jump a { font-size: 0.88rem; }
}