/* ==========================================================================
   Sol e Lua — Design Tokens (subset)
   Apenas variáveis :root, sem reset global nem estilos de elementos base,
   para não interferir no restante do tema ao ser carregado no site.
   Fonte: solelua-frontend design-tokens.css (DS v3 Commerce).
   ========================================================================== */
:root {
  /* ---------- Cores base ---------- */
  --azul: #0B1D51;        --azul-medio: #1B2D6B;  --azul-claro: #2A3F7E;
  --amarelo: #FEC601;     --amarelo-c: #FFD740;
  --coral: #F05D5E;       --coral-d: #D94849;
  --ciano: #06AED5;
  --creme: #FDF6F1;       --creme-d: #F5EAE0;      --nude: #EDD9CC;
  --verde-pix: #00BFA5;
  --whatsapp: #25D366;
  --branco: #FFFFFF;
  --cinza-bg: #F4F2EE;
  --cinza-1: #EEEAE3;     --cinza-2: #D8D2C7;
  --cinza-3: #8A8378;     --cinza-4: #4A4640;
  --preto: #18120E;

  --cor-primaria: var(--azul);
  --cor-acento: var(--coral);
  --cor-acento-hover: var(--coral-d);
  --cor-secundaria: var(--amarelo);
  --cor-texto: #424242;
  --cor-texto-claro: var(--cinza-3);
  --cor-fundo: var(--branco);
  --cor-fundo-alternativo: var(--creme);
  --cor-borda: var(--cinza-1);

  /* ---------- Tipografia ---------- */
  --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-sans:  'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;

  --w-light: 300; --w-regular: 400; --w-medium: 500;
  --w-semibold: 600; --w-bold: 700; --w-black: 800;

  --f-xs: 0.72rem; --f-sm: 0.81rem; --f-base: 0.94rem;
  --f-md: 1.06rem; --f-lg: 1.19rem; --f-xl: 1.38rem;
  --f-2xl: 1.63rem; --f-3xl: 2rem; --f-4xl: 2.5rem; --f-hero: 3.5rem;

  --fs-h2: clamp(1.875rem, 1.591rem + 1.212vw, 2.5rem);

  /* ---------- Espaçamento ---------- */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px;
  --s5: 20px; --s6: 24px; --s8: 32px; --s10: 40px;
  --s12: 48px; --s16: 64px; --s20: 80px;

  /* ---------- Formas ---------- */
  --r-sm: 4px; --r-md: 10px; --r-lg: 20px; --r-xl: 32px; --r-pill: 9999px;

  /* ---------- Sombras ---------- */
  --sh-xs: 0 1px 4px rgba(27,45,91,0.06);
  --sh-sm: 0 2px 12px rgba(27,45,91,0.08);
  --sh-md: 0 6px 24px rgba(27,45,91,0.10);
  --sh-lg: 0 12px 40px rgba(27,45,91,0.12);
  --sh-ouro: 0 4px 20px rgba(254,198,1,0.30);

  /* ---------- Layout ---------- */
  --max-w: 1320px;
  --pad-x: clamp(12px, 3vw, 32px);

  /* ---------- Animação ---------- */
  --t-fast: 0.15s ease;
  --t-base: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --t-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}