/* ==========================================================================
   CSS Variables — Dentro da Mala
   Paleta de cores, tipografia e tokens de design.
   Alterar aqui reflete em TODO o site.
   ========================================================================== */

:root {
  /* ---- Cores principais ---- */
  --azul-principal:    #091E33;
  --azul-medio:        #153249;
  --azul-claro:        #3D5D78;
  --dourado-principal: #C6A35A;
  --dourado-suave:     #E3C98F;
  --dourado-escuro:    #9C7A3A;
  --fundo:             #F7F3EB;
  --bege:              #EDE6D8;
  --texto:             #4F4F4F;
  --linha:             #D8D8D8;

  /* ---- Cores semânticas ---- */
  --branco:            #FFFFFF;
  --sucesso:           #22c55e;
  --alerta:            #f59e0b;
  --erro:              #dc2626;

  /* ---- Tipografia ---- */
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body:    Georgia, serif;
  --font-ui:      'Inter', system-ui, -apple-system, sans-serif;

  /* ---- Tamanhos fluidos (clamp: mobile, preferido, desktop) ---- */
  --text-xs:    clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm:    clamp(0.875rem, 0.825rem + 0.25vw, 1rem);
  --text-base:  clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg:    clamp(1.125rem, 1rem + 0.5vw, 1.25rem);
  --text-xl:    clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem);
  --text-2xl:   clamp(1.5rem, 1.2rem + 1.5vw, 2rem);
  --text-3xl:   clamp(1.875rem, 1.5rem + 1.875vw, 2.5rem);
  --text-4xl:   clamp(2.25rem, 1.75rem + 2.5vw, 3.5rem);
  --text-5xl:   clamp(2.75rem, 2rem + 3.75vw, 4.5rem);

  /* ---- Espaçamento ---- */
  --space-xxs:  4px;
  --space-xs:   8px;
  --space-sm:   12px;
  --space-md:   16px;
  --space-lg:   24px;
  --space-xl:   32px;
  --space-2xl:  48px;
  --space-3xl:  64px;
  --space-4xl:  80px;
  --space-section: clamp(60px, 8vw, 100px);

  /* ---- Largura do container ---- */
  --container-max: 1280px;
  --container-padding: clamp(1rem, 5vw, 4rem);

  /* ---- Bordas e sombras ---- */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  12px;
  --radius-pill: 9999px;

  --shadow-sm:  0 1px 3px rgba(9, 30, 51, 0.08);
  --shadow-md:  0 4px 12px rgba(9, 30, 51, 0.1);
  --shadow-lg:  0 8px 30px rgba(9, 30, 51, 0.12);

  /* ---- Transições ---- */
  --transition-fast:   200ms ease;
  --transition-base:   350ms ease;
  --transition-slow:   600ms ease;

  /* ---- Z-index ---- */
  --z-nav:     1000;
  --z-overlay: 2000;
  --z-modal:   3000;
  --z-consent: 4000;
}