/* ==========================================================================
   NIGHTCROW — Design Tokens
   Variables CSS globales : couleurs, typo, spacing, elevations
   ========================================================================== */

:root {
  /* === Couleurs === */
  --nc-bg: #0A0A0A;
  --nc-bg-elevated: #111111;
  --nc-bg-soft: #1A1A1A;
  --nc-surface: #161616;
  --nc-border: rgba(245, 243, 238, 0.08);
  --nc-border-strong: rgba(245, 243, 238, 0.16);

  --nc-gold: #C9964A;
  --nc-gold-light: #E8B06A;
  --nc-gold-dark: #9F7535;
  --nc-gold-subtle: rgba(201, 150, 74, 0.12);

  --nc-text: #F5F3EE;
  --nc-text-muted: #B8B4AA;
  --nc-text-dim: #666666;

  --nc-success: #6FCF97;
  --nc-danger: #EB5757;

  /* === Typographie === */
  --nc-font-sans: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
  --nc-font-mono: "Roboto Mono", "Menlo", "Consolas", monospace;

  --nc-fs-xs: 0.75rem;
  --nc-fs-sm: 0.875rem;
  --nc-fs-base: 1rem;
  --nc-fs-lg: 1.125rem;
  --nc-fs-xl: 1.375rem;
  --nc-fs-2xl: 1.75rem;
  --nc-fs-3xl: 2.25rem;
  --nc-fs-4xl: 3rem;
  --nc-fs-5xl: 4rem;
  --nc-fs-hero: clamp(2.75rem, 7vw, 6rem);

  --nc-lh-tight: 1.05;
  --nc-lh-snug: 1.25;
  --nc-lh-normal: 1.55;
  --nc-lh-relaxed: 1.7;

  --nc-tracking-tight: -0.02em;
  --nc-tracking-normal: 0;
  --nc-tracking-wide: 0.08em;
  --nc-tracking-widest: 0.24em;

  --nc-fw-light: 300;
  --nc-fw-regular: 400;
  --nc-fw-bold: 700;
  --nc-fw-black: 900;

  /* === Spacing (échelle 4px) === */
  --nc-space-1: 0.25rem;
  --nc-space-2: 0.5rem;
  --nc-space-3: 0.75rem;
  --nc-space-4: 1rem;
  --nc-space-5: 1.25rem;
  --nc-space-6: 1.5rem;
  --nc-space-8: 2rem;
  --nc-space-10: 2.5rem;
  --nc-space-12: 3rem;
  --nc-space-16: 4rem;
  --nc-space-20: 5rem;
  --nc-space-24: 6rem;
  --nc-space-32: 8rem;

  /* === Layout === */
  --nc-container: 1280px;
  --nc-container-narrow: 920px;
  --nc-gutter: clamp(1.25rem, 4vw, 2.5rem);
  --nc-section-py: clamp(4rem, 10vw, 8rem);

  /* === Radii === */
  --nc-radius-sm: 4px;
  --nc-radius-md: 8px;
  --nc-radius-lg: 14px;
  --nc-radius-xl: 22px;
  --nc-radius-pill: 999px;

  /* === Elevations / ombres === */
  --nc-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --nc-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.45);
  --nc-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.55);
  --nc-glow-gold: 0 0 32px rgba(201, 150, 74, 0.28);

  /* === Motion === */
  --nc-ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --nc-ease-in-out: cubic-bezier(0.45, 0.05, 0.35, 1);
  --nc-dur-fast: 160ms;
  --nc-dur: 280ms;
  --nc-dur-slow: 520ms;

  /* === Z-index === */
  --nc-z-nav: 100;
  --nc-z-modal: 200;
  --nc-z-cursor: 9999;
}

/* === Scrollbar gold 3px ==================================================== */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--nc-gold) transparent;
}
*::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}
*::-webkit-scrollbar-track {
  background: transparent;
}
*::-webkit-scrollbar-thumb {
  background: var(--nc-gold);
  border-radius: 3px;
}
*::-webkit-scrollbar-thumb:hover {
  background: var(--nc-gold-light);
}

/* === Sélection === */
::selection {
  background: var(--nc-gold);
  color: var(--nc-bg);
}
