/*
  Design tokens — Leslei Academy
  Fonte única de verdade para cor, tipografia, espaçamento, borda e sombra.
  Nenhum componente ou página deve usar valores soltos fora daqui.
*/

:root {
  /* ---------- Cor ---------- */
  --color-ink: #241A20;          /* texto principal — preto quente, não puro */
  --color-ink-soft: #5C4C52;     /* texto secundário */
  --color-paper: #FBF8F6;        /* fundo principal — bege muito claro */
  --color-surface: #F3ECE8;      /* fundo de seção alternada */
  --color-raised: #FFFFFF;       /* cards, header, superfícies elevadas */
  --color-border: #E6DAD4;

  --color-accent: #6B2F45;       /* vinho — cor de decisão: CTAs e links de ação */
  --color-accent-hover: #551F35;
  --color-accent-soft: #F2E4E9;  /* tint claro do accent — badges, fundos sutis */
  --color-accent-warm: #A9793F;  /* bronze — uso pontual (números, marcadores) */

  /* ---------- Tipografia ---------- */
  --font-display: 'Instrument Serif', Georgia, 'Iowan Old Style', serif;
  --font-body: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'Space Mono', 'SF Mono', Consolas, monospace;

  --text-xs: 0.8125rem;    /* 13px — legendas, labels */
  --text-sm: 0.9375rem;    /* 15px — texto auxiliar */
  --text-base: 1.0625rem;  /* 17px — corpo de texto */
  --text-md: 1.25rem;      /* 20px — destaques de corpo */
  --text-lg: 1.625rem;     /* 26px — subtítulos de seção */
  --text-xl: 2.125rem;     /* 34px — títulos de seção (h2) */
  --text-2xl: 2.75rem;     /* 44px — títulos grandes */
  --text-3xl: 3.5rem;      /* 56px — hero desktop */

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

  /* ---------- Espaçamento (base 4px) ---------- */
  --space-1: 0.25rem;   /* 4px */
  --space-2: 0.5rem;    /* 8px */
  --space-3: 0.75rem;   /* 12px */
  --space-4: 1rem;      /* 16px */
  --space-5: 1.5rem;    /* 24px */
  --space-6: 2rem;      /* 32px */
  --space-7: 3rem;      /* 48px */
  --space-8: 4rem;      /* 64px */
  --space-9: 6rem;      /* 96px */
  --space-10: 8rem;     /* 128px */

  /* ---------- Layout ---------- */
  --container-max: 1240px;
  --container-pad: var(--space-5);

  /* ---------- Borda e sombra ---------- */
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(36, 26, 32, 0.06), 0 1px 1px rgba(36, 26, 32, 0.04);
  --shadow-md: 0 12px 32px rgba(36, 26, 32, 0.10);

  /* ---------- Movimento ---------- */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast: 150ms;
  --duration-base: 250ms;

  /* ---------- Header ---------- */
  --header-height: 84px;
  --header-height-compact: 64px;
}