/* The legal pages: same tokens as the landing page, a quiet reading column. */
@import url("landing-tokens.css");

*, *::before, *::after { box-sizing: border-box; }
html, body { overflow-x: clip; }
body { margin: 0; background: var(--color-paper); color: var(--color-ink); font-family: var(--font-body); font-size: var(--text-base); line-height: 1.65; }
a { color: var(--color-accent); text-underline-offset: 0.2em; overflow-wrap: anywhere; }
a:hover { color: var(--color-accent-deep); }
:focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; border-radius: 6px; }

.legal-bar, .legal, .legal-foot { max-width: 46rem; margin-inline: auto; padding-inline: var(--page-gutter); }
.legal-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-md); height: 4rem; }
.brand { display: inline-flex; align-items: center; gap: var(--space-xs); text-decoration: none; }
.brand img { width: 2.2rem; height: auto; }
.wordmark { font-family: var(--font-display); font-weight: 600; font-size: var(--text-md); color: var(--color-ink); }
.wordmark__pal { color: var(--color-accent); }

.legal { padding-block: var(--space-xl) var(--space-2xl); }
.legal h1, .legal h2, .legal h3 { font-family: var(--font-display); font-weight: 600; line-height: 1.2; overflow-wrap: anywhere; }
.legal h1 { font-size: var(--text-2xl); margin: 0; }
.legal h2 { font-size: var(--text-lg); margin: var(--space-xl) 0 var(--space-xs); }
.legal h3 { font-size: var(--text-md); margin: var(--space-lg) 0 var(--space-2xs); }
.legal p, .legal ul, .legal ol, .legal dl { margin: 0 0 var(--space-sm); }
.legal ul, .legal ol { padding-left: 1.25rem; }
.legal li { margin-bottom: var(--space-2xs); }
.legal__updated { color: var(--color-ink-2); font-size: var(--text-sm); margin-top: var(--space-xs); }
.legal__notice { background: var(--color-paper-2); border: 1px solid var(--color-paper-3); border-radius: 12px; padding: var(--space-sm) var(--space-md); }
.legal table { width: 100%; border-collapse: collapse; margin: 0 0 var(--space-md); font-size: var(--text-sm); display: block; overflow-x: auto; }
.legal th, .legal td { text-align: left; vertical-align: top; padding: var(--space-xs) var(--space-sm); border-bottom: 1px solid var(--color-rule); }
.legal th { font-weight: 700; }
.legal address { font-style: normal; }

.legal-foot { display: flex; flex-wrap: wrap; gap: var(--space-2xs) var(--space-md); padding-block: var(--space-lg); border-top: 1px solid var(--color-rule); font-size: var(--text-sm); }
.legal-foot a { color: var(--color-ink-2); }