@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;
}

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

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

:root {
    --verde: #00C882;
    --verde-claro: #00CE1F;
    --vermelho: #FF0000;
    --cinza: #686868;
}

html {
    scroll-behavior: smooth;
}

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

h5 {
    font-weight: normal !important;
}

.elementor-element:has(#smartplayer) {
    width: 100%;
}

/* ============================================================================ */
/* ============================ SECTION - 1 =================================== */
/* ============================================================================ */

.fundo-verde {
    background-color: #00C882 !important;
}

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

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

/* Base: mobile primeiro (100% e em bloco) */
.cta-resp {
    display: block;
    width: 100%;
}

/* Texto do botão (só pra tirar inline style) */
.cta-resp .cta-text {
    font-size: 19px;
    display: block;
    padding: .5rem 0;
    margin: 0;
}

/* A partir de lg (≥992px): volta a auto e inline-block */
@media (min-width: 992px) {
    .cta-resp {
        display: inline-block;
        width: auto;
    }
}

/* ============================================================================ */
/* ============================ SECTION - 2 =================================== */
/* ============================================================================ */


/* Container geral */
.depo-carousel {
    position: relative;
    padding: 0 3rem;
    /* espaço para botões laterais */
}

/* Trilha rolável */
.depo-track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

/* Esconde scrollbar (opcional) */
.depo-track::-webkit-scrollbar {
    display: none;
}

/* trilha */
.depo-track {
    --g: 8px;
    /* espaçamento entre cards */
    --peek: 80px;
    /* quanto do próximo card deve aparecer */
    gap: var(--g);
    padding-inline: calc(var(--g) + var(--peek) / 2);
    scroll-padding-inline: calc(var(--g) + var(--peek) / 2);
}

/* card */
.depo-item {
    box-sizing: border-box;
    /* tira o gap e mais um "peek" da largura do card */
    flex: 0 0 calc(clamp(280px, 33%, 420px) - var(--g) - var(--peek));
    padding: 14px;
    scroll-snap-align: start;
}


/* Botões de navegação */
.depo-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid #ddd;
    background: #fff;
    box-shadow: 0 2px 12px rgba(0, 0, 0, .08);
    display: grid;
    place-items: center;
    cursor: pointer;
    user-select: none;
}


/* Cursor de “arrastar” no desktop (opcional) */
.depo-track.grabbing {
    cursor: grabbing;
}

/* ============================================================================ */
/* ============================ SECTION - 3 =================================== */
/* ============================================================================ */
.btn-verde-outline {
    border: 1px solid var(--verde) !important;
    color: var(--verde) !important;
}
