:root {
    /* Cores principais */
    --cor-primaria: #004e46;
    --cor-primaria-clara: #08786b;
    --cor-primaria-escura: #003b35;
    --cor-secundaria: #f05a24;
    --cor-secundaria-clara: #ff7b40;
    --cor-destaque: #b7d63d;
    --cor-sucesso: #2eb67d;
    --cor-alerta: #f3b63a;
    --cor-perigo: #db4965;
    --cor-fundo: #f4f5f3;
    --cor-superficie: #ffffff;
    --cor-superficie-alternativa: #eef2ef;
    --cor-texto: #20302e;
    --cor-texto-suave: #6d7977;
    --cor-borda: #dce4e1;
    --cor-sombra: rgba(0, 57, 50, 0.12);

    /* Famílias tipográficas */
    --fonte-principal: Inter, "Segoe UI", Arial, sans-serif;
    --fonte-titulos: Inter, "Segoe UI", Arial, sans-serif;
    --fonte-destaque: Inter, "Segoe UI", Arial, sans-serif;

    /* Pesos das fontes */
    --peso-regular: 400;
    --peso-medio: 500;
    --peso-semibold: 600;
    --peso-bold: 700;
    --peso-extrabold: 800;
    --peso-black: 900;

    /* Alturas de linha */
    --linha-compacta: 0.95;
    --linha-unica: 1;
    --linha-titulo: 1.05;
    --linha-subtitulo: 1.1;
    --linha-texto: 1.55;

    /* Escala tipográfica */
    --fonte-2xs: 10px;
    --fonte-xs: 11px;
    --fonte-sm: 12px;
    --fonte-md: 13px;
    --fonte-base: 16px;
    --fonte-lg: 17px;
    --fonte-xl: 18px;
    --fonte-2xl: 21px;
    --fonte-3xl: 22px;
    --fonte-4xl: 23px;
    --fonte-5xl: 24px;
    --fonte-6xl: 26px;
    --fonte-7xl: 30px;
    --fonte-icone-card: 46px;
    --fonte-icone-grande: 66px;
    --fonte-icone-gigante: 100px;
    --fonte-icone-decorativo: 130px;
    --fonte-icone-banner: 150px;

    /* Títulos responsivos */
    --fonte-titulo-pagina: clamp(28px, 5vw, 52px);
    --fonte-titulo-banner: clamp(30px, 4.6vw, 58px);
    --fonte-subtitulo-banner: clamp(28px, 4vw, 50px);
    --fonte-texto-banner: clamp(15px, 2vw, 19px);
    --fonte-titulo-secao: clamp(20px, 2.2vw, 30px);
    --fonte-titulo-artigo: clamp(30px, 6vw, 54px);
    --fonte-titulo-login: clamp(40px, 6vw, 70px);
    --fonte-icone-hero: clamp(70px, 10vw, 130px);
    --fonte-icone-artigo: clamp(50px, 10vw, 110px);
    --fonte-titulo-banner-interno: clamp(34px, 7vw, 64px);

    /* Espaçamentos */
    --espaco-2xs: 4px;
    --espaco-xs: 6px;
    --espaco-sm: 8px;
    --espaco-md: 10px;
    --espaco-lg: 12px;
    --espaco-xl: 14px;
    --espaco-2xl: 16px;
    --espaco-3xl: 18px;
    --espaco-4xl: 20px;
    --espaco-5xl: 24px;
    --espaco-6xl: 28px;
    --espaco-7xl: 30px;
    --espaco-8xl: 34px;
    --espaco-secao: 54px;
    --espaco-secao-mobile: 36px;
    --recuo-container: 32px;
    --recuo-container-mobile: 22px;

    /* Dimensões gerais */
    --largura-conteudo: 1180px;
    --altura-cabecalho: 68px;
    --altura-cabecalho-mobile: 60px;
    --largura-logo: 132px;
    --largura-logo-mobile: 110px;
    --altura-logo: 44px;
    --altura-banner-principal: 430px;
    --altura-botao: 42px;
    --altura-botao-pequeno: 34px;
    --tamanho-avatar: 38px;
    --tamanho-icone-recurso: 54px;
    --tamanho-avatar-podio: 64px;
    --tamanho-avatar-perfil: 82px;
    --tamanho-metrica: 50px;
    --tamanho-seta-carousel: 32px;
    --tamanho-ponto-carousel: 9px;
    --largura-ponto-carousel-ativo: 28px;
    --altura-banner-lateral: 190px;
    --altura-banner-lateral-mobile: 180px;
    --altura-hero: 440px;
    --altura-arte-hero: 385px;
    --altura-banner-interno: 220px;
    --altura-produto: 390px;
    --altura-login: 560px;
    --altura-rodape: 100px;
    --altura-textarea: 135px;
    --largura-tabela: 820px;
    --largura-artigo: 900px;
    --largura-modal: 620px;

    /*
    Breakpoints de referência.
    CSS custom properties não funcionam diretamente dentro de @media,
    portanto estes valores também aparecem nas regras responsivas.
  */
    --breakpoint-tablet: 900px;
    --breakpoint-mobile: 620px;

    /* Bordas, raios e sombras */
    --raio-pilula: 99px;
    --raio-circular: 50%;
    --raio-pequeno: 8px;
    --raio-medio: 14px;
    --raio-grande: 24px;
    --sombra-card: 0 12px 30px var(--cor-sombra);
    --sombra-cabecalho: 0 4px 18px rgba(0, 0, 0, .12);
    --sombra-modal: 0 24px 80px rgba(0, 0, 0, .3);

    /* Animações */
    --transicao: 180ms ease;
    --transicao-banner: 450ms ease;
}