/* /* =========================
   CORES ENDOLATINA
========================= */

:root {
    --verde-endolatina: #6BCBCB;
    --azul-endolatina: #0558A7;
    --azul2-endolatina: #123d68;
    --cinza-endolatina: #D9D9D9;
    --verde2-endolatina: #90C60E;
    --azul-abbott: #039BDE;
    --laranja-bd-bard: #F26923;
    --roxo-livanova: #6B2078;
    --azul-philips: #0B5BD1;
    --vermelho-braile: #A31D21;
    --vermelho-cardinal: #F04F45;
}

/* =========================
   RESET
========================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins", sans-serif;
}

html {
    scroll-behavior: smooth;
}

.parceiros {
    scroll-margin-top: 100px;
}

body {
    background: #fff;
}

a {
    text-decoration: none;
}

button {
    font-family: "Poppins", sans-serif;
}

.interface {

    max-width: 1280px;
    margin: auto;
    padding: 20px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;

}


/* ========================================
   ANIMAÇÃO AO ROLAR A PÁGINA
======================================== */

.animacao-entrada {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 1s ease, transform 1s ease;
}

.animacao-entrada.visivel {
    opacity: 1;
    transform: translateY(0);
}

.aparecerH2Sobrenos {
    opacity: 0;
    transform: translateX(30px);
    transition: opacity 1s ease, transform 1s ease;
}

.aparecerH2Sobrenos.visivel {
    opacity: 1;
    transform: translateY(0);
}



/* ========================================
   ANIMAÇÕES DE ENTRADA-HERO
======================================== */

@keyframes aparecerHero {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animacao-entrada-hero {
    animation: aparecerHero 1.3s ease-in both;
}

@keyframes aparecerTextHero {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animacao-entrada-texto-hero {
    animation: aparecerTextHero 1.8s ease-in both;
}


@keyframes aparecerH2Sobrenos {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animacao-h2-sbrenos {
    animation: aparecerH2Sobrenos 1.8s ease-in both;
}

