/* BNI design tokens + reset. Shared by every page of the site. */

:root {
  --bni-red: #CF2030;
  --bni-red-deep: #A3141F;
  --bni-red-soft: #FBE6E8;
  --win: #1E9E57;
  --win-soft: #E3F5EA;

  --ink: #1D1D1F;
  --ink-2: #4A4A4F;
  --ink-3: #85858C;
  --line: #D9D9DE;
  --paper: #FFFFFF;
  --canvas: #F2F2F4;

  --sky-top: #FDFDFE;
  --sky-bottom: #E9E9EC;
  --hill-far: #DCDCE0;
  --hill-near: #CDCDD3;
  --tree: #B9B9C1;
  --road: #3A3A40;
  --road-shoulder: #8F8F97;
  --road-line: #FFFFFF;

  --font-display: "Archivo", "Arial Black", Arial, sans-serif;
  --font-body: "Inter", "Segoe UI", Arial, sans-serif;

  --radius: 18px;
  --shadow: 0 18px 50px -18px rgba(20, 20, 30, .28), 0 2px 6px rgba(20, 20, 30, .06);
  --ease: cubic-bezier(.2, .8, .2, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bni-red: #E23443;
    --bni-red-deep: #F0606C;
    --bni-red-soft: #3A1418;
    --win: #3CCB7F;
    --win-soft: #12301F;
    --ink: #F2F2F4;
    --ink-2: #C3C3CA;
    --ink-3: #8D8D96;
    --line: #34343B;
    --paper: #1B1B20;
    --canvas: #111114;
    --sky-top: #17171C;
    --sky-bottom: #202027;
    --hill-far: #25252C;
    --hill-near: #2C2C34;
    --tree: #383841;
    --road: #0B0B0E;
    --road-shoulder: #4A4A53;
    --shadow: 0 18px 50px -18px rgba(0, 0, 0, .7), 0 2px 6px rgba(0, 0, 0, .4);
  }
}

*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; height: 100%; }

body {
  background: var(--canvas);
  color: var(--ink);
  font: 16px/1.55 var(--font-body);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: var(--font-display); line-height: 1.1; margin: 0; }
p { margin: 0; }
img, svg { display: block; max-width: 100%; }
button { font: inherit; color: inherit; }

:focus-visible { outline: 3px solid var(--bni-red); outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; }
}