:root {
  box-sizing: border-box;
  padding-top: env(safe-area-inset-top, 0px);
  padding-bottom: env(safe-area-inset-bottom, 0px);

  /* brand */
  --brick: #8d1f14;
  --brick-deep: #4d0f09;
  --gold: #e8a85f;
  --cream: #fbead0;
  --night: #171010;
  --night-2: #211615;

  /* theme (light) */
  --bg: #f6ead6;
  --bg-2: #ecdabd;
  --ink: #2b1511;
  --muted: #6b4f47;
  --line: rgba(43, 21, 17, .22);
  --cta-bg: #8d1f14;
  --cta-ink: #fbead0;
  --star: #c77a14;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #1a1211;
    --bg-2: #251a17;
    --ink: #f5e5cc;
    --muted: #c3aa95;
    --line: rgba(245, 229, 204, .22);
    --cta-bg: #e8a85f;
    --cta-ink: #1a0f0c;
    --star: #e8a85f;
  }
}
:root[data-theme="dark"] {
  --bg: #1a1211;
  --bg-2: #251a17;
  --ink: #f5e5cc;
  --muted: #c3aa95;
  --line: rgba(245, 229, 204, .22);
  --cta-bg: #e8a85f;
  --cta-ink: #1a0f0c;
  --star: #e8a85f;
}
*, *::before, *::after { box-sizing: inherit; }
html { scroll-padding-top: calc(env(safe-area-inset-top, 0px) + 4.5rem); scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
img, video { display: block; max-width: 100%; }
a { color: inherit; }
h1, h2, h3 { font-family: Fraunces, Georgia, "Times New Roman", serif; font-weight: 600; margin: 0; letter-spacing: -.01em; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 4px; }
.wrap { width: min(1080px, 100% - 2.5rem); margin-inline: auto; }