/* Ordem das camadas: tokens < base < layout < components < sections. */
@layer tokens, base, layout, components, sections;

@layer tokens {
  :root {
    /* Cores da marca e derivadas (contrastes em docs/decisoes/0004-direcao-visual-v2.md) */
    --marinho-950: #04131F;
    --marinho-900: #071F30;
    --marinho-800: #0B2B3F;
    --marinho-700: #123F5A;
    --azul-easy: #49B2E0;          /* cor do símbolo: superfícies, ícones, texto sobre marinho */
    --azul-easy-claro: #8ED0EE;
    --azul-easy-50: #EAF6FC;
    --azul-profundo: #17668F;      /* links e botões sobre branco (6,3:1) */
    --azul-profundo-escuro: #0F4E6E;
    --cinza-easy: #7A8F9B;
    --tinta: #0E2A3B;
    --texto: #3A4E5B;
    --texto-claro: #B8CBD6;        /* texto secundário sobre marinho */
    --fundo: #FFFFFF;
    --fundo-claro: #F3F7FA;
    --linha: #DCE5EB;
    --whats: #128C7E;

    /* Sombras em camadas */
    --sombra-1: 0 1px 2px rgb(7 31 48 / 0.05), 0 6px 16px -6px rgb(7 31 48 / 0.1);
    --sombra-2: 0 2px 6px rgb(7 31 48 / 0.06), 0 22px 44px -18px rgb(7 31 48 / 0.28);
    --sombra-3: 0 30px 70px -24px rgb(4 19 31 / 0.45);

    /* Tipografia */
    --fonte-titulo: "Jost", "Futura", "Century Gothic", sans-serif;
    --fonte-texto: "DM Sans", "Segoe UI", system-ui, sans-serif;
    --t-xs: 0.8125rem;
    --t-sm: 0.9375rem;
    --t-base: 1.0625rem;
    --t-lead: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
    --t-h4: 1.25rem;
    --t-h3: clamp(1.375rem, 1.2rem + 0.6vw, 1.625rem);
    --t-h2: clamp(2rem, 1.5rem + 2vw, 3rem);
    --t-h1: clamp(2.375rem, 1.6rem + 3.2vw, 4.25rem);

    /* Espaços e medidas */
    --margem: clamp(1.25rem, 0.6rem + 3vw, 2.5rem);
    --largura: 78rem;
    --secao: clamp(4.5rem, 2.8rem + 6.5vw, 8rem);
    --altura-faixa: 2.5rem;
    --altura-cabecalho: 5rem;

    /* Forma e movimento */
    --raio-p: 10px;
    --raio: 16px;
    --raio-g: 24px;
    --raio-pilula: 999px;
    --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    --duracao: 220ms;
    --duracao-slide: 7000ms;
  }

  @media (max-width: 63.99em) {
    :root {
      --altura-faixa: 0rem;
      --altura-cabecalho: 4.25rem;
    }
  }
}