* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--color-black);
  color: var(--color-ivory);
  font-family: var(--font-sans);
  line-height: 1.55;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 8%, rgba(200,138,35,.28), transparent 22%),
    radial-gradient(circle at 82% 12%, rgba(185,90,26,.24), transparent 24%),
    linear-gradient(135deg, rgba(161,15,22,.92), rgba(24,17,14,.96) 48%, rgba(10,7,5,.98));
  z-index: -3;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="220" height="220"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="3" stitchTiles="stitch"/></filter><rect width="100%" height="100%" filter="url(%23n)" opacity="0.55"/></svg>');
  mix-blend-mode: overlay;
  z-index: -2;
}
a { color: inherit; }
button, input { font: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 3px solid var(--color-gold); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}