/* ================================================
   VANESSA GUALBERTO — DESIGN TOKENS
   Advocacia do Acolhimento
   Gerado por Estúdio Benjamim
   ================================================ */

:root {
  /* === CORES PRIMÁRIAS (75%) === */
  --vinho:          #6B2D3E;
  --off-white:      #F4EDE6;

  /* === CORES SUPORTE (25%) === */
  --azul:           #1E2D4D;
  --cobre:          #D4A07A;

  /* === TONS DE ELEMENTO === */
  --cobre-escuro:   #9A6B4A;
  --bronze:         #7A5A3E;
  --rose-gold:      #C4A090;
  --areia:          #E8D9C8;
  --vinho-claro:    #8E4A5E;
  --cinza:          #E5E5E5;

  /* === MAPEAMENTO SEMÂNTICO === */
  --color-bg:           var(--off-white);
  --color-bg-alt:       var(--areia);
  --color-bg-contrast:  var(--vinho);
  --color-bg-neutral:   var(--cinza);
  --color-bg-dark:      var(--azul);

  --color-text:         var(--azul);
  --color-text-muted:   #5A6B7A;
  --color-heading:      var(--vinho);
  --color-accent:       var(--cobre);
  --color-accent-dark:  var(--cobre-escuro);
  --color-light:        var(--off-white);

  /* === TIPOGRAFIA === */
  --font-display:  'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:     'Lato', 'Helvetica Neue', Arial, sans-serif;
  --font-mono:     'IBM Plex Mono', 'Courier New', monospace;

  --text-display:  clamp(2.5rem, 7vw, 4rem);
  --text-h1:       clamp(2rem, 5vw, 2.75rem);
  --text-h2:       clamp(1.5rem, 3.5vw, 1.875rem);
  --text-h3:       clamp(1.125rem, 2vw, 1.375rem);
  --text-body:     clamp(1rem, 1.5vw, 1.125rem);
  --text-caption:  clamp(0.8125rem, 1vw, 0.875rem);
  --text-mono:     clamp(0.6875rem, 0.9vw, 0.8125rem);

  /* === ESPAÇAMENTO === */
  --space-xs:      0.5rem;
  --space-sm:      1rem;
  --space-md:      2rem;
  --space-lg:      4rem;
  --space-xl:      6rem;
  --space-section: clamp(5rem, 12vw, 8rem);

  /* === LAYOUT === */
  --container-max:     1140px;
  --container-padding: clamp(1.25rem, 5vw, 3rem);

  /* === ANIMAÇÃO === */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:   cubic-bezier(0.65, 0, 0.35, 1);
  --duration-fast:   0.2s;
  --duration-normal: 0.4s;
  --duration-slow:   0.8s;

  /* === Z-INDEX === */
  --z-nav:     100;
  --z-overlay: 200;
  --z-modal:   300;

  /* === BORDAS === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-pill: 999px;
}