@import url("https://fonts.googleapis.com/css2?family=Inter:opsz,wght@14..32,100..900&display=swap");

/* Reset básico */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    width: 100%;
    height: 100%;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    line-height: 1.5;
}

/* Remove estilos padrão de listas */
ul,
ol {
    list-style: none;
}

/* Remove decoração de links */
a {
    text-decoration: none;
    color: inherit;
}

a:hover {
    text-decoration: none;
    color: inherit;
}

/* Remove estilos padrão de inputs e botões */
input,
button {
    border: none;
    outline: none;
    font: inherit;
}

/* Garante que imagens não ultrapassem seu contêiner */
img {
    max-width: 100%;
    height: auto;
}

#backToTop {
    position: fixed;
    bottom: 150px;
    right: 20px;
    display: none; /* O botão ficará oculto até o usuário rolar a página */
    z-index: 1000;
}

.btn {
    background-color: var(--cor-cta);
    color: var(--cor-texto-secundaria) !important;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: bold;
}

.btn:hover {
    background-color: var(--cor-secundaria);
    color: var(--cor-texto) !important;
}

.btn:active {
    background-color: var(--cor-secundaria) !important;
    color: var(--cor-texto) !important;
}

.btn:focus {
    background-color: var(--cor-secundaria) !important;
    color: var(--cor-texto) !important;
}

.text-primary {
    color: var(--cor-destaque) !important;
}

.bg-primary {
    background-color: var(--cor-destaque) !important;
}

.text-superior {
    font-size: clamp(28px, 4vw, 40px) !important;
}

.text-hero {
    font-size: clamp(24px, 4vw, 36px) !important;
}

.text-headline {
    font-size: clamp(20px, 2vw, 32px) !important;
}

.text-subheadline {
    font-size: clamp(18px, 2vw, 28px) !important;
}

.text-body {
    font-size: clamp(16px, 2vw, 20px) !important;
}

.text-feature {
    font-size: clamp(12px, 2vw, 16px) !important;
}