@font-face {
    font-family: 'DMSans';
    src: url('../fontes/DMSans/DMSans.woff2') format('woff2'),
        url('../fontes/DMSans/DMSans.woff') format('woff'),
        url('../fontes/DMSans/DMSans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'DMSans-Bold';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url(https://fonts.gstatic.com/s/dmsans/v15/rP2Yp2ywxg089UriI5-g4vlH9VoD8Cmcqbu0-K4.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Monik';
    src: url('../fontes/Monik/Monik-Regular.woff2') format('woff2'),
        url('../fontes/Monik/Monik-Regular.woff') format('woff'),
        url('../fontes/Monik/Monik-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


.fw-bold {
    font-family: 'DMSans-Bold' !important;
    font-weight: 800 !important;
}

.fw-bold-2 {
    font-family: 'Monik' !important;
    font-weight: 800 !important;
}


.font-1 {
    font-family: 'DMSans' !important;
}

.font-2 {
    font-family: 'Monik' !important;
}

:root {
    --vinho: #49001e;
    --red: #E90002;
    --face: #3c5a96;
    --green: #00CE1F;
}

.color-red {
    color: var(--red);
}

.color-green {
    color: var(--green);
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'DMSans' !important;
    background-color: #000000 !important;
}

h5 {
    font-weight: normal !important;
}


/* ============================================================================ */
/* ================================== GERAL =================================== */
/* ============================================================================ */

.fundo {
    background-position: center !important;
    background-size: cover;
    background-repeat: no-repeat;
}

.esconder {
    display: none !important;
}

/* ============================================================================ */
/* ============================ SECTION - 1 =================================== */
/* ============================================================================ */
.fundo-1 {
    /* background-image: linear-gradient(180deg, var(--vinho) 0, #000 100%); */
    background-image: url(../img/abas/fundo-1.webp) !important;
}

.logo {
    width: 120px !important;
    height: auto !important;
}

/* ============================================================================ */
/* ============================ SECTION - 2 =================================== */
/* ============================================================================ */
.img-tecnicas {
    width: 100%;
    max-width: 400px !important;
    height: auto !important;
}

@media (max-width: 991px) {
    .img-tecnicas {
        width: 280px !important;
        height: auto !important;
    }
}

/* ============================================================================ */
/* ============================ SECTION - 4 =================================== */
/* ============================================================================ */

.cor-face {
    color: var(--face) !important;
}

.face {
    background-color: #EFF1F3 !important;
}

.face a {
    text-decoration: none !important;
    cursor: pointer;
    color: var(--face) !important;
}

.face a:hover {
    border-bottom: 1px solid var(--face) !important;
}

/* ============================================================================ */
/* ============================ SECTION - 5 =================================== */
/* ============================================================================ */

.box-cinza {
    background-color: #171717 !important;
}

.btn-cta {
    background: linear-gradient(45deg, #00FF56, #459E20, #00FF56, #459E20);
    background-size: 400% 200%;
    transition: background 1.5s cubic-bezier(0.5, 0.1, 0.4, 0.9);
    animation: 3.5s ease-in infinite brilho;
    box-shadow: 0px 0px 19px 0px #0ABD23;
}

@keyframes brilho {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 100% 0;
    }
}

#timer {
    font-size: 55px !important;
    font-weight: bold;
}

.label-container {
    display: flex;
    justify-content: center;
    gap: 20px;
    font-size: 20px;
    text-transform: uppercase;
}

/* ============================================================================ */
/* ============================ SECTION - 7 =================================== */
/* ============================================================================ */


.fundo-2 {
    background-color: var(--red) !important;
}

/* ============================================================================ */
/* ============================ SECTION - 8 =================================== */
/* ============================================================================ */

.accordion-item {
    background-color: transparent !important;
    color: #ffffff !important;
}

.accordion-button {
    background-color: var(--red) !important;
    color: #ffffff !important;
}

.accordion-button::after {
    filter: brightness(0) invert(1);
}

/* ============================================================================ */
/* ============================ SECTION - 9 =================================== */
/* ============================================================================ */
.fundo-3 {
    background-color: #222222 !important;
}