/* === BlueGrid Systems — Reset + Design Tokens === */

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

html,
body,
h1, h2, h3, h4, h5, h6,
p, figure, blockquote, dl, dd, ul, ol {
  margin: 0;
  padding: 0;
}

ul, ol {
  list-style: none;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
  color: inherit;
  background: transparent;
  border: none;
  outline: none;
}

button {
  cursor: pointer;
}

a {
  color: inherit;
  text-decoration: none;
}

::selection {
  background: var(--c-cyan);
  color: var(--c-ink);
}

/* === Design tokens === */
:root {
  /* Color */
  --c-ink: #0A0E1A;
  --c-ink-2: #060912;
  --c-ink-3: #11172a;
  --c-line: rgba(91, 224, 255, 0.12);
  --c-line-strong: rgba(91, 224, 255, 0.28);
  --c-cyan: #5BE0FF;
  --c-cyan-soft: rgba(91, 224, 255, 0.18);
  --c-blue: #3D5AFE;
  --c-blue-deep: #1B2E7C;
  --c-parchment: #F4F1EA;
  --c-parchment-2: #ECE6D8;
  --c-slate: #7E8AA8;
  --c-slate-dim: #4A5572;
  --c-white: #ffffff;
  --c-warn: #FFB547;
  --c-success: #6EE7B7;

  /* Type */
  --f-display: 'Fraunces', 'Times New Roman', serif;
  --f-body: 'Inter Tight', system-ui, -apple-system, sans-serif;
  --f-mono: 'JetBrains Mono', 'Courier New', monospace;

  /* Sizing */
  --container: 1320px;
  --container-narrow: 880px;
  --container-legal: 760px;

  /* Spacing scale */
  --s-0: 4px;
  --s-1: 8px;
  --s-2: 12px;
  --s-3: 16px;
  --s-4: 24px;
  --s-5: 32px;
  --s-6: 48px;
  --s-7: 64px;
  --s-8: 96px;
  --s-9: 128px;
  --s-10: 192px;

  /* Radius */
  --r-1: 4px;
  --r-2: 8px;
  --r-3: 14px;
  --r-4: 22px;
  --r-pill: 999px;

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-elastic: cubic-bezier(0.34, 1.56, 0.64, 1);
  --t-fast: 180ms;
  --t-med: 360ms;
  --t-slow: 720ms;

  /* Elevation */
  --shadow-glow: 0 0 0 1px rgba(91, 224, 255, 0.22), 0 30px 80px -20px rgba(91, 224, 255, 0.25);
  --shadow-card: 0 30px 60px -30px rgba(0, 0, 0, 0.6);

  /* Layout */
  --nav-h: 76px;
}

@media (max-width: 720px) {
  :root {
    --s-7: 48px;
    --s-8: 72px;
    --s-9: 96px;
    --s-10: 128px;
    --nav-h: 64px;
  }
}