/* ---- self-hosted webfonts (same files the site already ships in fonts/) ---- */
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 700;
  font-display: swap;
  src: url("../fonts/playfair-display-v40-latin-700.woff2") format("woff2");
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 900;
  font-display: swap;
  src: url("../fonts/playfair-display-v40-latin-900.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-v20-latin-400.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-v20-latin-500.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-v20-latin-600.woff2") format("woff2");
}
@font-face {
  font-family: "Inter"; font-style: normal; font-weight: 700;
  font-display: swap;
  src: url("../fonts/inter-v20-latin-700.woff2") format("woff2");
}
@font-face {
  font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500;
  font-display: swap;
  src: url("../fonts/ibm-plex-mono-v20-latin-500.woff2") format("woff2");
}

/* Align Newsroom — ink + collage design tokens.
   Single shared token source for the site and the video pipeline.
   Paper #FBF7F0 · Ink #1C1B19 · Navy #0e3763 · Red #b03f28 · Mustard #E2B86A */

:root {
  /* ---- color ---- */
  --nr-paper: #FBF7F0;
  --nr-paper-deep: #F3EDE0;
  --nr-paper-warm: #F8F1E3;
  --nr-ink: #1C1B19;
  --nr-ink-soft: #3A3835;
  --nr-ink-mute: #6E6A63;
  --nr-navy: #0e3763;
  --nr-navy-deep: #0A2748;
  --nr-red: #b03f28;
  --nr-red-deep: #8E3220;
  --nr-mustard: #E2B86A;
  --nr-gold: #E2B86A;
  --nr-gold-deep: #B98F3E;
  --nr-hairline: #D9D2C2;
  --nr-rule: #C9C0AB;

  /* ---- type ---- */
  --nr-font-masthead: "Playfair Display", "Didot", "Bodoni MT", Georgia, serif;
  --nr-font-headline: "Playfair Display", Georgia, "Times New Roman", serif;
  --nr-font-body: "Inter", -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --nr-font-mono: "IBM Plex Mono", "SFMono-Regular", Menlo, Consolas, monospace;

  --nr-type-masthead: clamp(3rem, 8vw, 6.5rem);
  --nr-type-display: clamp(2rem, 4.5vw, 3.5rem);
  --nr-type-h1: clamp(1.75rem, 3.5vw, 2.75rem);
  --nr-type-h2: 1.5rem;
  --nr-type-h3: 1.125rem;
  --nr-type-body: 1rem;
  --nr-type-small: 0.8125rem;
  --nr-type-kicker: 0.6875rem;

  /* ---- texture assets (relative to site root) ---- */
  --nr-tex-parchment: url("../assets/look/parchment-web.jpg");
  --nr-tex-grain: url("../assets/look/grain-tile.png");
  --nr-tex-halftone: url("../assets/look/halftone-tile.png");
  --nr-tex-torn-red: url("../assets/look/torn-red-web.png");
  --nr-tex-torn-navy: url("../assets/look/torn-navy-web.png");
  --nr-tex-torn-mustard: url("../assets/look/torn-mustard-web.png");
  --nr-tex-blob-red: url("../assets/look/torn-blob-red-web.png");
  --nr-tex-blob-navy: url("../assets/look/torn-blob-navy-web.png");
  --nr-tex-blob-mustard: url("../assets/look/torn-blob-mustard-web.png");
  --nr-tex-tape-cream: url("../assets/look/tape-cream-web.png");
  --nr-tex-tape-mustard: url("../assets/look/tape-mustard-web.png");
  --nr-tex-ink-frame: url("../assets/look/ink-frame-web.png");

  /* ---- shape ---- */
  --nr-radius-sharp: 1px;
  --nr-radius-card: 3px;
  --nr-radius-pill: 999px;

  /* ---- rules ---- */
  --nr-rule-hairline: 1px solid var(--nr-hairline);
  --nr-rule-section: 2px solid var(--nr-ink);
  --nr-rule-masthead: 4px solid var(--nr-ink);

  /* ---- shadow (paper lift, never glassy) ---- */
  --nr-shadow-lift: 0 1px 0 rgba(28, 27, 25, 0.08), 0 6px 18px rgba(28, 27, 25, 0.10);
  --nr-shadow-tape: 0 1px 2px rgba(28, 27, 25, 0.18);

  /* ---- motion ---- */
  --nr-ease: cubic-bezier(0.22, 1, 0.36, 1);
}