/* Shared styling for standalone legal pages (privacy, terms, …). These pages
   are served raw by nginx and must render without the SPA bundle, so the brand
   tokens are duplicated here as plain values rather than imported from
   styles/tokens.css. Keep this list in sync if the palette changes. */

@font-face {
  font-family: "Playfair Display";
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/PlayfairDisplay-Bold.woff2") format("woff2");
}
@font-face {
  font-family: "Playfair Display";
  font-weight: 600;
  font-display: swap;
  src: url("/fonts/PlayfairDisplay-SemiBold.woff2") format("woff2");
}

:root {
  --bg: #0f0f0f;
  --surface: #252420;
  --cream: #e3dcc4;
  --ink-faint: #8a8473;
  --gold: #c9a84c;
  --font-display: "Playfair Display", Georgia, serif;
  --font-sans: system-ui, -apple-system, sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--cream);
  font-family: var(--font-sans);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* Mobile-first: a single 440px column, centered. */
main {
  max-width: 440px;
  margin: 0 auto;
  padding: 2.5rem 1.5rem 4rem;
}

/* Back-navigation to the landing site, sits above the brand mark. */
.back-link {
  display: inline-block;
  margin-bottom: 1.5rem;
  color: var(--ink-faint);
  font-size: 0.85rem;
  text-decoration: none;
  transition: color 0.15s ease;
}

.back-link:hover {
  color: var(--cream);
}

.brand {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.75rem;
  color: var(--gold);
  letter-spacing: 0.02em;
  margin: 0 0 0.25rem;
}

h1 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.5rem;
  margin: 0 0 0.25rem;
}

.updated {
  color: var(--ink-faint);
  font-size: 0.85rem;
  margin: 0 0 2rem;
}

h2 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.15rem;
  margin: 2rem 0 0.5rem;
}

p,
li {
  font-size: 0.95rem;
}

ul {
  padding-left: 1.25rem;
}

li {
  margin: 0.35rem 0;
}

a {
  color: var(--gold);
}

.card {
  background: var(--surface);
  border-radius: 10px;
  padding: 1rem 1.25rem;
  margin-top: 1rem;
}

.legal-footer {
  margin-top: 3rem;
  color: var(--ink-faint);
  font-size: 0.8rem;
  text-align: center;
}

.legal-footer .copyright {
  font-family: var(--font-display);
}