/* Quiet pages (privacy policy, 404, posts): the front page's dark room, type and colours, nothing else. */
@font-face { font-family: "OB Serif"; src: url("../fonts/nsd-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "OB Serif"; src: url("../fonts/nsd-ro.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0102-0103, U+015E-015F, U+0162-0163, U+0218-021B; }
@font-face { font-family: "OB Serif"; src: url("../fonts/nsd-latin-italic.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "OB Serif"; src: url("../fonts/nsd-ro-italic.woff2") format("woff2"); font-weight: 100 900; font-style: italic; font-display: swap; unicode-range: U+0102-0103, U+015E-015F, U+0162-0163, U+0218-021B; }
@font-face { font-family: "OB Sans"; src: url("../fonts/geist-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "OB Sans"; src: url("../fonts/geist-ro.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0102-0103, U+015E-015F, U+0162-0163, U+0218-021B; }

:root {
  --bg: #0B0B0A;
  --ink: #F3F0EA;
  --ink-2: rgba(243, 240, 234, .72);
  --muted: rgba(243, 240, 234, .5);
  --line: rgba(243, 240, 234, .12);
  --line-2: rgba(243, 240, 234, .28);
  --serif: "OB Serif", "Iowan Old Style", "Times New Roman", serif;
  --sans: "OB Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --gutter: clamp(20px, 4vw, 56px);
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { background: var(--bg); }
body.obt { margin: 0; min-height: 100vh; display: flex; flex-direction: column; background: var(--bg); color: var(--ink); font: 400 17px/1.65 var(--sans); -webkit-font-smoothing: antialiased; }
.obt a { color: inherit; }
.obt-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 22px max(var(--gutter), env(safe-area-inset-right)) 22px max(var(--gutter), env(safe-area-inset-left)); border-bottom: 1px solid var(--line); }
.obt-brand { font: 400 22px/1 var(--serif); letter-spacing: -.01em; text-decoration: none; }
.obt-brand em { font-style: italic; }
.obt-pill { display: inline-flex; align-items: center; height: 36px; padding: 0 16px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-2); font: 500 11px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; text-decoration: none; transition: background .3s, color .3s; }
.obt-pill:hover, .obt-pill:focus-visible { background: var(--ink); color: var(--bg); box-shadow: none; }
.obt-main { flex: 1; width: 100%; max-width: 760px; margin: 0 auto; padding: clamp(56px, 10vw, 128px) var(--gutter) 96px; }
.obt-kicker { margin: 0 0 18px; font: 500 11px/1 var(--sans); letter-spacing: .3em; text-transform: uppercase; color: var(--muted); }
.obt-title { margin: 0 0 40px; font: 300 clamp(40px, 6vw, 76px)/1 var(--serif); letter-spacing: -.025em; text-wrap: balance; }
.obt-title--list { margin: 0; padding: 22px 0; font-size: clamp(28px, 3.4vw, 40px); border-bottom: 1px solid var(--line); }
.obt-title--list a { text-decoration: none; }
.obt-lead { font: 400 19px/1.55 var(--sans); color: var(--ink-2); }
.obt-content { color: var(--ink-2); }
.obt-content > * + * { margin-top: 1.1em; }
.obt-content h2, .obt-content h3 { margin-top: 2em; color: var(--ink); font: 400 clamp(24px, 2.6vw, 32px)/1.15 var(--serif); }
.obt-content a { text-decoration-color: var(--line-2); text-underline-offset: 3px; }
.obt-content a:hover { text-decoration-color: currentColor; }
.obt-content img { max-width: 100%; height: auto; }
.obt-content ul, .obt-content ol { padding-left: 1.2em; }
.obt-foot { padding: 28px var(--gutter); border-top: 1px solid var(--line); font: 500 11px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.obt-foot p { margin: 0; }
.obt :focus-visible { outline: 1px solid var(--ink); outline-offset: 3px; }
.nav-links { display: flex; gap: 18px; margin-top: 32px; font: 500 11px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
