/* Rozendom B.V. — one sober page.
   The page renders inside the dok layout (Tailwind preflight, Turbo), so every
   rule is scoped under body.rzd. Not named app.css/native.css on purpose:
   those would also load on dok's own visitor pages. */

:root {
  --rzd-paper: #f4f5f2;
  --rzd-surface: #ffffff;
  --rzd-ink: #17201c;
  --rzd-muted: #5c6660;
  --rzd-line: #d6dbd6;
  --rzd-accent: #1f4d3a;
  --rzd-serif: "Iowan Old Style", "Charter", "Palatino Linotype", Palatino, Georgia, serif;
  --rzd-sans: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --rzd-paper: #0f1412;
    --rzd-surface: #161d1a;
    --rzd-ink: #e7ece9;
    --rzd-muted: #9aa69f;
    --rzd-line: #2a332f;
    --rzd-accent: #8cc4a8;
  }
}

body.rzd {
  background: var(--rzd-paper);
  color: var(--rzd-ink);
  font: 17px/1.6 var(--rzd-sans);
  -webkit-font-smoothing: antialiased;
}

.rzd .page {
  max-width: 44rem;
  margin: 0 auto;
  padding: 3rem 1.25rem 4rem;
  display: grid;
  gap: 3rem;
}

.rzd .masthead {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.rzd .brand {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  color: inherit;
  text-decoration: none;
  font: 600 1.05rem/1 var(--rzd-serif);
  letter-spacing: 0.01em;
}

.rzd .brand img { width: 36px; height: 36px; border-radius: 8px; }

.rzd .lang { display: flex; gap: 0.25rem; font-size: 0.85rem; }

.rzd .lang a {
  color: var(--rzd-muted);
  text-decoration: none;
  padding: 0.35rem 0.6rem;
  border-radius: 6px;
}

.rzd .lang a[aria-current="true"] { color: var(--rzd-ink); background: var(--rzd-surface); }

.rzd .eyebrow {
  margin: 0 0 0.75rem;
  font-size: 0.78rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rzd-muted);
}

.rzd h1 {
  margin: 0;
  font: 500 clamp(2rem, 6vw, 3rem)/1.12 var(--rzd-serif);
  text-wrap: balance;
}

.rzd h2 {
  margin: 0 0 1rem;
  font: 600 0.78rem/1 var(--rzd-sans);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rzd-muted);
}

.rzd dl.facts {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(8rem, max-content) 1fr;
  gap: 0.6rem 1.5rem;
}

.rzd dl.facts dt { color: var(--rzd-muted); }
.rzd dl.facts dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.rzd dl.facts a { color: var(--rzd-accent); }

@media (max-width: 520px) {
  .rzd dl.facts { grid-template-columns: 1fr; gap: 0.1rem; }
  .rzd dl.facts dd { margin-bottom: 0.75rem; }
}

.rzd .footer {
  padding-top: 1.5rem;
  border-top: 1px solid var(--rzd-line);
  font-size: 0.82rem;
  color: var(--rzd-muted);
}

.rzd .footer p { margin: 0 0 0.4rem; }

.rzd a:focus-visible { outline: 2px solid var(--rzd-accent); outline-offset: 3px; }