/* Design tokens: paleta azul #1C79C4, branco e ouro metálico. */
:root {
  /* Azul da marca: fundos das seções escuras, header, rodapé, textos e
     contornos (4,58:1 com branco — passa no AA, mas perto do limite) */
  --azul: #1C79C4;
  /* Tom mais escuro do mesmo azul (5,93:1 com branco): cartões, painéis e
     caixas sobre as seções azuis (onde fica o texto pequeno) e hover dos
     botões de contorno */
  --azul-card: #1667A8;
  /* Azul profundo da mesma família, SÓ para texto/ícone sobre o ouro (botões,
     faixa, botão flutuante, seleção): o #1C79C4 dá só 1,29:1 no tom mais escuro
     do ouro; este dá 4,95:1. */
  --azul-profundo: #071A2C;
  --branco: #FFFFFF;

  /* Ouro metálico (luz e sombra). Todas as paradas têm contraste >= 4,5:1 com
     o --azul-profundo (texto dos botões e da faixa): a pior, #B07F24, dá 4,95:1.
     A última parada (#AA771C na proposta original) foi clareada para #B07F24. */
  --ouro-gradiente: linear-gradient(135deg, #BF953F 0%, #FCF6BA 25%, #B38728 50%, #FBF5B7 75%, #B07F24 100%);
  /* Mesmas paradas a 180°, para fios finos verticais */
  --ouro-gradiente-suave: linear-gradient(180deg, #BF953F 0%, #FCF6BA 25%, #B38728 50%, #FBF5B7 75%, #B07F24 100%);
  /* Ouro claro para TEXTO dourado, SÓ sobre o --azul-card #1667A8 (sobre o
     #1C79C4 nenhum dourado chega a 4,5:1). Paradas sobre #1667A8: #F6E6A8 4,75 ·
     #FCF6BA 5,38 · #F5E4A4 4,67 · #FBF5B7 5,32 — todas >= 4,5:1. */
  --ouro-gradiente-sobre-azul: linear-gradient(135deg, #F6E6A8 0%, #FCF6BA 25%, #F5E4A4 50%, #FBF5B7 75%, #F6E6A8 100%);
  --ouro-claro-fallback: #F6E6A8;

  /* Cor sólida: forced-colors, navegadores sem suporte, borda de campo e checks
     (3,27:1 sobre branco; só gráfico/borda sobre o azul) */
  --ouro-fallback: #B38728;

  --cor-foco: var(--azul);
  --cor-foco-escuro: var(--branco);

  --fonte-titulo: "Typhone", "Lora", Georgia, "Times New Roman", serif;
  --fonte-texto: "Garet", "Garet Fallback", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --fs-sm: clamp(0.875rem, 0.85rem + 0.1vw, 0.9375rem);
  --fs-base: clamp(1.0625rem, 1.04rem + 0.12vw, 1.125rem);
  --fs-lg: clamp(1.125rem, 1.07rem + 0.3vw, 1.3125rem);
  --fs-h4: clamp(1.1875rem, 1.12rem + 0.35vw, 1.375rem);
  --fs-h3: clamp(1.3125rem, 1.2rem + 0.6vw, 1.75rem);
  --fs-h2: clamp(1.75rem, 1.45rem + 1.4vw, 2.625rem);
  --fs-h1: clamp(2.125rem, 1.55rem + 2.6vw, 3.625rem);
  --peso-titulo: 500;
  --peso-titulo-leve: 500;
  --peso-normal: 400;
  /* Texto delicado: Garet só no peso Book (400), inclusive botões e destaques */
  --peso-medio: 400;
  --peso-forte: 400;
  --lh-texto: 1.6;
  --lh-titulo: 1.12;
  --tracking-caps: 0.14em;

  --esp-3xs: 0.25rem;
  --esp-2xs: 0.5rem;
  --esp-xs: 0.75rem;
  --esp-sm: 1rem;
  --esp-md: 1.5rem;
  --esp-lg: 2rem;
  --esp-xl: 3rem;
  --esp-2xl: 4rem;
  --esp-3xl: 6rem;
  --esp-secao: clamp(4rem, 3rem + 5vw, 8rem);

  --largura-max: 1200px;
  --largura-texto: 680px;
  --gutter: clamp(1rem, 0.5rem + 2.5vw, 2rem);
  --header-h: 4.5rem;
  --alvo-toque: 44px;

  --raio-sm: 12px;
  --raio-md: 16px;
  --raio-lg: 24px;
  --raio-pill: 999px;

  --sombra-sm: 0 1px 3px rgb(28 121 196 / 0.06);
  --sombra-md: 0 4px 12px rgb(28 121 196 / 0.08);
  --sombra-lg: 0 8px 20px rgb(28 121 196 / 0.08);
  --sombra-header: 0 1px 0 rgb(28 121 196 / 0.08);

  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-rapida: 150ms;
  --dur-media: 250ms;
  --dur-lenta: 450ms;
  --transicao: var(--dur-media) var(--ease);

  --z-base: 1;
  --z-header: 100;
  --z-flutuante: 90;
  --z-skip: 200;
}
