/* Institut Vidocq — design tokens */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;0,6..72,700;1,6..72,400&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* ── Couleurs ─────────────────────────────────────── */
  /* Vert Vidocq — emprunté au logo (sapin profond, encre) */
  --vidocq-900: oklch(0.22 0.035 165);   /* encre */
  --vidocq-800: oklch(0.30 0.04 165);    /* logo */
  --vidocq-700: oklch(0.40 0.045 165);
  --vidocq-500: oklch(0.55 0.04 165);
  --vidocq-200: oklch(0.85 0.025 160);
  --vidocq-100: oklch(0.93 0.018 155);
  --vidocq-50:  oklch(0.97 0.012 150);

  /* Papier — ivoire sépia, jamais blanc pur */
  --paper:      oklch(0.975 0.012 85);
  --paper-warm: oklch(0.955 0.018 80);
  --paper-edge: oklch(0.92 0.022 78);

  /* Sépia / ocre — accent dossier d'archives */
  --sepia-900:  oklch(0.32 0.06 60);
  --sepia-700:  oklch(0.48 0.09 65);
  --sepia-500:  oklch(0.65 0.11 70);     /* ocre principal */
  --sepia-200:  oklch(0.85 0.06 75);

  /* Rouge tampon — usage parcimonieux (alertes, classifications) */
  --stamp-red:  oklch(0.48 0.13 25);

  /* Neutres */
  --ink:        oklch(0.18 0.01 80);
  --ink-soft:   oklch(0.35 0.012 80);
  --ink-mute:   oklch(0.55 0.015 80);
  --rule:       oklch(0.82 0.015 78);
  --rule-soft:  oklch(0.90 0.012 78);

  /* ── Typographie ──────────────────────────────────── */
  --font-display: "Cormorant Garamond", "Times New Roman", serif;
  --font-text:    "Newsreader", "Iowan Old Style", "Times New Roman", serif;
  --font-mono:    "JetBrains Mono", "Courier New", monospace;

  /* Tailles (1920px ref) */
  --t-mono-xs: 10px;
  --t-mono-sm: 11px;
  --t-mono:    12px;
  --t-body:    16px;
  --t-lead:    20px;
  --t-h4:      24px;
  --t-h3:      32px;
  --t-h2:      48px;
  --t-h1:      72px;
  --t-display: 112px;

  /* ── Mises en page ────────────────────────────────── */
  --gutter: 32px;
  --rule-w: 1px;
  --rule-w-bold: 2px;
}

/* Helpers globaux pour tous les artboards */
.iv-paper {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-text);
}
.iv-mono {
  font-family: var(--font-mono);
  font-feature-settings: "ss01";
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.iv-display {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 0.98;
}
.iv-serif {
  font-family: var(--font-text);
  font-optical-sizing: auto;
}

/* Filets institutionnels */
.iv-rule {
  border: 0;
  border-top: var(--rule-w) solid var(--ink);
  margin: 0;
}
.iv-rule-thick { border-top-width: var(--rule-w-bold); }

/* Sceau — variantes du logo */
.iv-seal {
  display: inline-block;
  border-radius: 50%;
}

/* Tampon classification */
.iv-stamp {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1.5px solid var(--stamp-red);
  color: var(--stamp-red);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  transform: rotate(-2deg);
}

/* Cote / référence */
.iv-cote {
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--ink-mute);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

/* Image placeholder — papier rayé sépia */
.iv-img-placeholder {
  background:
    repeating-linear-gradient(
      135deg,
      transparent 0,
      transparent 9px,
      oklch(0.88 0.04 75 / 0.4) 9px,
      oklch(0.88 0.04 75 / 0.4) 10px
    ),
    var(--paper-warm);
  border: 1px solid var(--rule);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-mute);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
