/* then.place public pages: one quiet column, paper tone, ink type. */
:root {
  --paper: #f4f1ea; --ink: #1d1f22; --muted: #5d6166; --rule: #d8d2c4; --accent: #2f5d7c;
  --f-display: "Literata", Georgia, serif;
  --f-body: "Public Sans", system-ui, -apple-system, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root { --paper: #15171a; --ink: #e8e4dc; --muted: #a3a7ab; --rule: #2c3036; --accent: #8db8d6; color-scheme: dark; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 17px/1.6 var(--f-body); }
main { max-width: 38rem; margin: 0 auto; padding-block: 12vh 4rem; padding-inline: 20px; }
h1 { font: 600 clamp(2.6rem, 9vw, 4rem)/1 var(--f-display); margin: 0; letter-spacing: -0.02em; }
h1 span { color: var(--muted); font-weight: 400; }
h2 { font: 600 1.25rem/1.3 var(--f-display); margin: 2.2rem 0 0.4rem; }
.tag { font: italic 400 1.2rem/1.4 var(--f-display); color: var(--muted); margin: 0.6rem 0 2rem; }
p { margin: 0 0 1rem; }
a { color: var(--accent); }
nav.lang { display: flex; gap: 1rem; font-size: 0.85rem; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 3rem; }
nav.lang a { color: var(--muted); text-decoration: none; }
nav.lang a[aria-current="true"] { color: var(--ink); border-bottom: 1px solid var(--ink); }
section[lang] { display: none; }
section[lang].on { display: block; }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--rule); color: var(--muted); font-size: 0.85rem; }