/* ==========================================================================
   Simplius — Design Tokens
   ========================================================================== */

:root {
  /* Cores primárias */
  --color-navy: #01084C;       /* Modern Blue — destaque, textos fortes */
  --color-purple: #B57FFE;     /* Digital Purple — ação/CTA */
  --color-offwhite: #FAFAFA;   /* Off-White — fundo principal */

  /* Cores secundárias (usar com moderação) */
  --color-green: #CBF569;      /* Light Green — detalhes */
  --color-beige: #E1E7DE;      /* Minimalist Beige — apoio */

  /* Variações utilitárias (derivadas, para hover/estado/sombra) */
  --color-navy-10: #01084C1A;
  --color-navy-90: #01084CE6;
  --color-purple-dark: #9856f3;
  --color-purple-text: #6e2fd1;  /* variação de --color-purple com contraste AA (4.5:1+) para texto sobre fundo claro */
  --color-purple-10: #B57FFE1A;
  --color-white: #FFFFFF;
  --color-ink: #1A1A2E;         /* texto de corpo sobre fundo claro */
  --color-ink-muted: #4A4E6B;   /* texto secundário */
  --color-border: #E3E3EA;

  /* Tipografia */
  --font-display: 'Raleway', 'Helvetica Neue', Arial, sans-serif;
  --font-body: 'Lora', Georgia, 'Times New Roman', serif;

  --fs-h1: clamp(2.25rem, 4.5vw + 1rem, 4rem);
  --fs-h2: clamp(1.75rem, 3vw + 1rem, 2.75rem);
  --fs-h3: clamp(1.375rem, 1.5vw + 1rem, 1.875rem);
  --fs-h4: clamp(1.125rem, 0.5vw + 1rem, 1.375rem);
  --fs-body-lg: 1.125rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-eyebrow: 0.8125rem;

  --lh-tight: 1.15;
  --lh-heading: 1.3;
  --lh-body: 1.7;

  /* Espaçamentos (escala 4px) */
  --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;

  /* Layout */
  --container-max: 1200px;
  --container-pad: var(--space-5);
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  /* Sombras */
  --shadow-sm: 0 2px 8px rgba(1, 8, 76, 0.06);
  --shadow-md: 0 8px 24px rgba(1, 8, 76, 0.10);
  --shadow-lg: 0 16px 48px rgba(1, 8, 76, 0.14);

  /* Transições */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 0.18s var(--ease-standard);
  --transition-base: 0.28s var(--ease-standard);

  /* Z-index */
  --z-header: 100;
  --z-dropdown: 110;
  --z-overlay: 120;
  --z-whatsapp: 90;
}
