/* Legal pages (imprint, privacy policy): same tokens and type as the home page, set as a quiet reading column. */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { overflow-x: clip; background: var(--color-paper); }
body { color: var(--color-ink); font-family: var(--font-body); font-size: var(--text-base); line-height: 1.65; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: inherit; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
[hidden] { display: none !important; }
.wrap { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: var(--gutter); }

.btn { display: inline-flex; align-items: center; gap: var(--space-xs); white-space: nowrap; padding: 1em 1.5em; border: 1px solid var(--color-ink); border-radius: var(--radius-none); font-size: var(--text-xs); font-weight: 500; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; transition: background-color var(--dur-short) var(--ease-out), color var(--dur-short) var(--ease-out); }
.btn:hover { background: var(--color-ink); color: var(--color-paper); }
.btn--solid { background: var(--color-ink); color: var(--color-paper); }
.btn--solid:hover { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-accent-ink); }

.lnav { display: flex; align-items: center; justify-content: space-between; gap: var(--space-lg); height: 4rem; border-bottom: 1px solid var(--color-rule); }
.mark { font-family: var(--font-display); font-size: var(--text-md); white-space: nowrap; text-decoration: none; }
.mark b { font-weight: 400; color: var(--color-accent); }
.lnav__r { display: flex; align-items: center; gap: var(--space-md); }
.lang { display: flex; gap: var(--space-3xs); font-size: var(--text-xs); }
.lang button { padding: .4em .35em; color: var(--color-muted); letter-spacing: .04em; }
.lang button:hover, .lang button[aria-pressed="true"] { color: var(--color-ink); }
.lang button[aria-pressed="true"] { font-weight: 500; }
.theme-btn { width: 2.25rem; height: 2.25rem; display: grid; place-items: center; }
.theme-btn i { width: 1rem; height: 1rem; border: 1px solid currentColor; border-radius: 50%; background: linear-gradient(90deg, currentColor 50%, transparent 50%); transition: transform var(--dur-long) var(--ease-out); }
.theme-btn[aria-pressed="true"] i { transform: rotate(180deg); }

.legal { padding-block: var(--space-3xl) var(--section); display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(var(--space-xl), 5vw, var(--space-4xl)); }
.legal__side { align-self: start; position: sticky; top: var(--space-xl); display: grid; gap: var(--space-md); }
.legal__side a { font-size: var(--text-sm); color: var(--color-muted); text-decoration: none; }
.legal__side a:hover, .legal__side a[aria-current="page"] { color: var(--color-ink); }
.legal h1 { font-family: var(--font-display); font-weight: 400; font-size: clamp(2.25rem, 4vw + 1.25rem, 5.25rem); line-height: 1; letter-spacing: -0.02em; -webkit-hyphens: auto; hyphens: auto; overflow-wrap: anywhere; }
.legal .stamp { margin-top: var(--space-md); font-size: var(--text-xs); letter-spacing: .14em; text-transform: uppercase; color: var(--color-muted); }
.legal article > p:first-of-type { margin-top: var(--space-xl); }
.legal h2 { -webkit-hyphens: auto; hyphens: auto; margin-top: var(--space-2xl); padding-top: var(--space-md); border-top: 1px solid var(--color-rule); font-family: var(--font-display); font-weight: 400; font-size: var(--text-xl); line-height: 1.1; }
.legal p, .legal address { margin-top: var(--space-md); max-width: 64ch; font-style: normal; }
.legal p a, .legal address a { text-decoration: underline; text-decoration-color: var(--color-accent); text-underline-offset: .2em; }
.legal .todo { color: var(--color-accent); font-weight: 500; }
@media (max-width: 54rem) { .legal { grid-template-columns: minmax(0, 1fr); padding-top: var(--space-2xl); } .legal__side { position: static; grid-auto-flow: column; justify-content: start; gap: var(--space-lg); } }

.lfoot { padding-block: var(--space-xl) var(--space-3xl); border-top: 1px solid var(--color-rule); display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-md); font-size: var(--text-xs); color: var(--color-muted); }
.lfoot nav { display: flex; flex-wrap: wrap; gap: var(--space-lg); }
.lfoot a { text-decoration: none; }
.lfoot a:hover, .lfoot button:hover { color: var(--color-ink); }
.lfoot button { font-size: inherit; color: inherit; }