/*
 * Base — Reset, escala tipográfica fluida e estilos fundacionais
 * Tema Leia
 *
 * Escala fluida: os tamanhos interpolam suavemente entre
 * viewport 320px (mobile) e 1280px (desktop) via clamp().
 * Fórmula: clamp(min, calc(min + (max - min) * ((100vw - 20rem) / 60)), max)
 */

/* =========================================
   Reset moderno
   ========================================= */
*,
*::before,
*::after {
    box-sizing: border-box;
}

* {
    margin: 0;
    padding: 0;
}

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img,
picture,
video,
canvas,
svg {
    display: block;
    max-width: 100%;
}

input,
button,
textarea,
select {
    font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
    overflow-wrap: break-word;
}

ul[role="list"],
ol[role="list"] {
    list-style: none;
}

/* =========================================
   Escala tipográfica fluida
   Interpolação entre 320px e 1280px de viewport
   ========================================= */
:root {
    /* Textos (Inter) */
    --fonte-xs: clamp(
        0.625rem,
        calc(0.625rem + 0.2vw),
        0.8125rem
    ); /* 10–13px  */
    --fonte-sm: clamp(0.75rem, calc(0.75rem + 0.3vw), 0.9375rem); /* 12–15px  */
    --fonte-md: clamp(1rem, calc(0.875rem + 1.25vw), 1.875rem); /* 16–30px  */

    /* Títulos (Oswald) */
    --fonte-lg: clamp(1.25rem, calc(1rem + 1.5vw), 2.375rem); /* 20–38px  */
    --fonte-xl: clamp(1.5rem, calc(1.25rem + 2vw), 3.25rem); /* 24–52px  */
    --fonte-2xl: clamp(
        1.875rem,
        calc(1.5rem + 2.25vw),
        3.375rem
    ); /* 30–54px  */
    --fonte-3xl: clamp(2.25rem, calc(1.75rem + 2.75vw), 4rem); /* 36–64px  */
    --fonte-4xl: clamp(2.75rem, calc(2rem + 3.5vw), 4.75rem); /* 44–76px  */
    --fonte-display: clamp(3rem, calc(2.25rem + 4.5vw), 6.5rem); /* 48–104px */

    /* Cor de hover global */
    --cor-hover: #6cfe7b;

    /* Cor do texto */
    --cor-texto: #000;

    /* Transições */
    --transicao: 200ms ease;

    /* Sombras */
    --sombra-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --sombra-md: 0 4px 12px rgba(0, 0, 0, 0.1);

    /* Bordas */
    --raio-sm: 3px;
    --raio-md: 6px;

    /* Z-index */
    --z-header: 100;
    --z-modal: 1000;
}

/* =========================================
   Estilos base do documento
   ========================================= */
body {
    /* Proxy vars — definidas aqui no body porque as variáveis do Elementor Kit
       (--e-global-typography-*) são escoped a .elementor-kit-142, que é o body.
       Resolução CSS lazy garante que o valor vencedor (Elementor, maior especificidade)
       seja usado, incluindo as overrides de mobile do kit. */
    --fonte-base: var(--e-global-typography-text-font-size, 36px);
    --ff-texto:   var(--e-global-typography-text-font-family, "Inter Tight");
    --ff-titulo:  var(--e-global-typography-primary-font-family, "Oswald");
    --fw-texto:   var(--e-global-typography-text-font-weight, 300);
    --lh-texto:   var(--e-global-typography-text-line-height, 1.4);

    font-family: var(--ff-texto);
    font-size: var(--fonte-base);
    font-weight: var(--fw-texto);
    line-height: var(--lh-texto);
    color: var(--cor-texto);
    background-color: #fff;
}

strong,
b {
    font-weight: 600;
}

/* Títulos usam Oswald por padrão */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--ff-titulo);
    line-height: 1.4;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.01em;
}

/* Hierarquia: H1(120) > H2(100) > H3(80) > H4(60) > H5(44) > H6(40) > corpo(36px) */
h1 {
    font-size: var(--fonte-4xl);
} /* 44–120px */
h2 {
    font-size: var(--fonte-3xl);
} /* 36–100px */
h3 {
    font-size: var(--fonte-2xl);
} /* 30–80px  */
h4 {
    font-size: var(--fonte-xl);
} /* 24–60px  */
h5 {
    font-size: var(--fonte-lg);
} /* 20–44px  */
h6 {
    font-size: var(--fonte-md);
} /* 16–40px  */

a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: opacity var(--transicao);
}

a:hover {
    opacity: 0.65;
}

:focus-visible {
    outline: 2px solid #000;
    outline-offset: 3px;
    border-radius: var(--raio-sm);
}

/* =========================================
   Utilitários de acessibilidade
   ========================================= */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pular-para-conteudo {
    position: absolute;
    top: -100%;
    left: 0;
    padding: 0.75rem 1.5rem;
    background: #000;
    color: #fff;
    font-family: var(--ff-titulo);
    font-weight: 600;
    z-index: var(--z-modal);
    text-decoration: none;
    transition: top var(--transicao);
}

.pular-para-conteudo:focus {
    top: 0;
}