/* =============================================
   Manolo, Tokens (design-system-manolo.md)
   Cores, tipografia, espaçamento, raio, iconografia.
   ============================================= */

:root {
  /* ---- FONTES ---- */
  --font-primary: 'Archivo', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* ---- AZUL MANOLO ---- */
  --blue: #0E3166;
  --blue-active: #16427F;
  --blue-deep: #0A244C;
  --blue-tint: #DDE8F5;
  --blue-soft: #F3F7FC;
  /* Aliases legados (não usar em código novo, mantidos pra retrocompat) */
  --blue-900: #0A244C;
  --blue-700: #16427F;
  --blue-100: #DDE8F5;
  --blue-50: #F3F7FC;

  /* ---- AZUL-AÇO ---- */
  --steel: #4682B4;
  --steel-strong: #35698F;
  --steel-soft: #8DB5D3;
  --steel-tint: #E4F0F8;
  /* Aliases legados */
  --steel-700: #35698F;
  --steel-300: #8DB5D3;
  --steel-100: #E4F0F8;

  /* ---- AMARELO (acento, raríssimo) ---- */
  --yellow: #FDB515;
  --yellow-active: #D89500;
  --yellow-soft: #FFE3A3;
  --yellow-tint: #FFF3D4;
  /* Aliases legados */
  --yellow-600: #D89500;
  --yellow-200: #FFE3A3;
  --yellow-100: #FFF3D4;

  /* ---- TINTAS ---- */
  --ink: #1A1817;
  --carbon: #1A1817; /* alias legado */
  --body: #303436;
  --text: #303436; /* alias legado */
  --muted: #60686D;
  --muted-soft: #8A8E91;
  --gray: #8A8E91; /* alias legado */

  /* ---- HAIRLINE ---- */
  --hairline: #D8DAD8;
  --hairline-soft: #ECEDEC;
  --line: #D8DAD8; /* alias legado */
  --line-soft: #ECEDEC; /* alias legado */

  /* ---- SURFACE ---- */
  --canvas: #FFFFFF;
  --white: #FFFFFF; /* alias legado */
  --surface-soft: #FAFAF8;
  --soft: #FAFAF8; /* alias legado */
  --surface-card: #EFEFEC;
  --off: #EFEFEC; /* alias legado */

  /* ---- ON ---- */
  --on-primary: #FFFFFF;
  --on-yellow: #1A1817;

  /* ---- SEMANTIC ---- */
  --success: #22C55E;
  --warning: #F59E0B;
  --error: #DC2626;

  /* ---- RAIOS ---- */
  --radius-sm: 6px;
  --radius-md: 14px;
  --radius-lg: 20px;

  /* ---- ESPAÇAMENTO (base 8px) ---- */
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-80: 80px;
  --space-96: 96px;
  --space-120: 120px;

  /* ---- CONTAINER ---- */
  --container-max: 1280px;
  --container-pad: 32px;
  --container-pad-mobile: 20px;

  /* ---- ESCALA TIPOGRÁFICA ---- */
  --fs-display-xl: clamp(40px, 5.4vw, 64px);
  --fs-display-lg: clamp(36px, 4.4vw, 48px);
  --fs-display: clamp(40px, 5.4vw, 64px); /* alias legado */
  --fs-h2: clamp(28px, 3.4vw, 40px);
  --fs-h3: 22px;
  --fs-h4: 17px;
  --fs-body-lg: 18px;
  --fs-body: 16px;
  --fs-body-sm: 14px;
  --fs-small: 13px;
  --fs-spec: 13px;
  --fs-label: 11px;
  --fs-cta: 14px;
  --fs-stat: clamp(36px, 4.4vw, 56px);

  /* ---- LINE HEIGHT ---- */
  --lh-display: 1.05;
  --lh-heading: 1.18;
  --lh-body: 1.6;

  /* ---- LETTER SPACING ---- */
  --ls-display: -0.02em;
  --ls-mono: 0.08em;

  /* ---- ICONOGRAFIA (Carbon-style, stroke 1.5px) ---- */
  --icon-stroke: 1.5;
  --icon-sm: 16px;
  --icon-md: 20px;
  --icon-lg: 24px;
  --icon-xl: 32px;

  /* ---- SOMBRAS (raras) ---- */
  --shadow-interactive: 0 1px 1px rgba(20, 28, 50, 0.04), 0 2px 6px rgba(20, 28, 50, 0.06);

  /* ---- TRANSIÇÕES ---- */
  --t-fast: 160ms ease;
  --t-base: 240ms ease;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-technical: cubic-bezier(0.2, 0.7, 0.2, 1);
  --motion-reveal: 560ms var(--ease-out);

  /* ---- Z-INDEX ---- */
  --z-default: 0;
  --z-dropdown: 10;
  --z-sticky: 20;
  --z-modal-scrim: 40;
  --z-modal: 100;
  --z-toast: 1000;
}

/* ---- REDUCED MOTION ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}