/* RFPvault.io · Direction C: Brutalist Slab · design tokens
   See docs/superpowers/specs/2026-06-09-rfpvault-redesign-design.md */

@font-face {
  font-family: 'Archivo Black';
  src: url('/fonts/archivo-black.woff2') format('woff2');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter Tight';
  src: url('/fonts/inter-tight.woff2') format('woff2-variations');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/fonts/jetbrains-mono.woff2') format('woff2-variations');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Instrument Serif';
  src: url('/fonts/instrument-serif-italic.woff2') format('woff2');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  /* Palette: four colors only. */
  --paper:  #F5F1E8;
  --ink:    #0A0A0A;
  --signal: #FF3366;
  --hilite: #FFE8A3;

  /* Fonts */
  --font-display: 'Archivo Black', 'Helvetica Neue', Arial, sans-serif;
  --font-body:    'Inter Tight', -apple-system, system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', 'SF Mono', Consolas, monospace;
  --font-serif:   'Instrument Serif', Georgia, 'Times New Roman', serif;

  /* Type scale */
  --t-display-xl: clamp(56px, 9vw, 120px);
  --t-display-l:  clamp(48px, 7vw, 96px);
  --t-display-m:  clamp(36px, 5vw, 64px);
  --t-h2:         clamp(24px, 3vw, 32px);
  --t-h3:         18px;
  --t-body:       15px;
  --t-small:      13px;
  --t-label:      10px;

  /* Borders */
  --b-hair: 1.5px solid var(--ink);
  --b-rule: 3px solid var(--ink);

  /* Shadows: hard offset, never blurred. */
  --shadow-stamp:  6px 6px 0 var(--signal);
  --shadow-focus:  4px 4px 0 var(--signal);

  /* Spacing */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 14px;
  --s-4: 22px;
  --s-5: 32px;
  --s-6: 48px;
}

/* Global resets that apply across all pages */
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--t-body);
  line-height: 1.5;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-display);
  letter-spacing: -0.02em;
  text-transform: uppercase;
}
::selection { background: var(--hilite); color: var(--ink); }
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--paper); }
::-webkit-scrollbar-thumb { background: var(--ink); }

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