:root {
  --bg: #161616;
  --ink: #f2f3f4;
  --muted: #8a8f99;
  --col: 1120px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: "Inter", system-ui, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh; display: flex; flex-direction: column;
}
h1, h2, h3, h4, h5, h6, strong, b { font-weight: 400; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--ink); }
.col { width: 100%; max-width: var(--col); margin: 0 auto; padding: 0 24px; }

/* Header */
header { padding: 28px 0 0; }
header .col { display: flex; justify-content: center; align-items: center; }
.brand { font-size: 1rem; letter-spacing: 0.08em; }

/* Main */
main { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 48px 0; }
main .col { display: flex; flex-direction: column; align-items: center; text-align: center; }
.intro h1 { font-size: clamp(1.6rem, 2.4vw, 2.25rem); line-height: 1.25; margin: 0; white-space: nowrap; }
.intro h1 a { color: var(--ink); transition: color .2s ease; }
.intro h1 a:hover { color: var(--muted); }

/* Footer */
footer { padding: 40px 0 48px; font-size: 0.8rem; color: var(--muted); }
footer .col { display: flex; flex-direction: column; align-items: center; gap: 20px; }
footer .col > div { display: flex; align-items: center; justify-content: center; gap: 32px; }
footer a { color: var(--muted); }

/* Legal */
body.legal { --bg: #ffffff; --ink: #111111; --muted: #6b7079; }
body.legal main { justify-content: flex-start; padding-top: 72px; }
body.legal main .col { display: block; align-self: center; width: fit-content; max-width: 480px; text-align: left; }
.legal h1 { font-size: 1.6rem; margin: 0 0 24px; }
.legal h2 { font-size: 1.1rem; margin: 32px 0 8px; }
.legal h3 { font-size: 1rem; margin: 24px 0 6px; }
.legal h4, .legal h5 { font-size: 1rem; margin: 16px 0 4px; }
.legal p { margin: 0 0 12px; }
.legal p.addr { margin-bottom: 2px; }
.legal ul, .legal ol { margin: 0 0 12px; padding-left: 1.2em; }
.legal a { word-break: break-word; }

@media (max-width: 720px) { .intro h1 { white-space: normal; } }
.legal h1 { text-align: center; }
