/* =========================================================
   Design tokens — puntonotai.it
   Palette ispirata a studi professionali (Deloitte/Accenture/BIP):
   blu inchiostro profondo + oro discreto, su carta calda.
   ========================================================= */
:root {
  /* ---- colore: base ---- */
  --ink-950: #070f22;
  --ink-900: #0a1830;
  --ink-800: #11274a;
  --ink-700: #1a3763;
  --ink-600: #2a4d84;
  --ink-500: #3f649e;

  --gold-300: #e9d5a3;
  --gold-500: #c6a15b;
  --gold-600: #ab8640;
  --gold-ink: #7a5c1e; /* oro leggibile su bianco, per testo/link */

  --paper-0: #ffffff;
  --paper-50: #faf8f4;
  --paper-100: #f3efe6;

  --slate-900: #161c26;
  --slate-700: #384054;
  --slate-600: #4b5568;
  --slate-500: #6b7484;
  --slate-400: #8b93a1;
  --slate-200: #dfe1e6;

  --line-200: #e6e2d8;
  --line-300: #d8d2c3;

  --success-600: #2f7d5b;
  --success-100: #e4f3ec;
  --danger-600: #b3413a;
  --danger-100: #fbeae8;

  /* ---- colore: token semantici ---- */
  --color-bg: var(--paper-50);
  --color-surface: var(--paper-0);
  --color-surface-alt: var(--paper-100);
  --color-text: var(--slate-900);
  --color-text-muted: var(--slate-600);
  --color-text-subtle: var(--slate-500);
  --color-border: var(--line-200);
  --color-primary: var(--ink-800);
  --color-primary-strong: var(--ink-950);
  --color-accent: var(--gold-500);
  --color-accent-ink: var(--gold-ink);
  --color-on-primary: #ffffff;
  --color-on-accent: var(--ink-950);
  --color-focus: #2a6fdb;

  /* ---- tipografia ---- */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --text-xs: 0.8125rem;
  --text-sm: 0.9375rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;
  --text-4xl: 2.875rem;
  --text-5xl: 3.5rem;
  --text-6xl: 4.25rem;

  --leading-tight: 1.15;
  --leading-snug: 1.35;
  --leading-normal: 1.6;

  /* ---- spaziatura (scala 4/8) ---- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4rem;
  --space-9: 6rem;
  --space-10: 8rem;

  /* ---- raggio / ombra ---- */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-full: 999px;

  --shadow-sm: 0 1px 2px rgba(10, 24, 48, 0.06), 0 1px 1px rgba(10, 24, 48, 0.04);
  --shadow-md: 0 8px 24px rgba(10, 24, 48, 0.08), 0 2px 6px rgba(10, 24, 48, 0.05);
  --shadow-lg: 0 24px 64px rgba(7, 15, 34, 0.16), 0 6px 16px rgba(7, 15, 34, 0.08);

  /* ---- movimento ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 150ms;
  --dur-base: 320ms;
  --dur-slow: 560ms;
  --dur-hero: 900ms;

  /* ---- layout ---- */
  --container-max: 1240px;
  --container-pad: clamp(1.25rem, 4vw, 3rem);
  --header-h: 84px;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms;
    --dur-base: 0ms;
    --dur-slow: 0ms;
    --dur-hero: 0ms;
  }
}