/* ==========================================================
   FILM TECH - CLUBE DE VANTAGENS PREMIUM
   ========================================================== */

.landing-vantagens {
    position: relative !important;
    overflow: hidden !important;

    background:
        radial-gradient(
            circle at 8% 30%,
            rgba(124,58,237,.08),
            transparent 24%
        ),
        radial-gradient(
            circle at 92% 62%,
            rgba(16,185,129,.07),
            transparent 25%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #faf8ff 100%
        ) !important;
}


/* ==========================================================
   GRADE
   ========================================================== */

.landing-vantagens-grade {
    display: grid !important;

    grid-template-columns:
        repeat(2, minmax(0, 1fr)) !important;

    gap: 28px !important;

    align-items: stretch !important;
}


/* ==========================================================
   CARD BASE
   ========================================================== */

.landing-vantagem-fornecedores,
.landing-vantagem-digital {
    position: relative !important;
    overflow: hidden !important;

    min-height: 430px !important;

    padding: 34px !important;

    border-radius: 26px !important;

    background:
        #ffffff !important;

    box-shadow:
        0 18px 46px rgba(44, 29, 77, .09) !important;

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease !important;
}


/* FORNECEDORES */

.landing-vantagem-fornecedores {
    border:
        1px solid rgba(124, 58, 237, .24) !important;
}


/* PRESENCA DIGITAL */

.landing-vantagem-digital {
    border:
        1px solid rgba(16, 185, 129, .25) !important;
}


/* ==========================================================
   BARRA SUPERIOR COLORIDA
   ========================================================== */

.landing-vantagem-fornecedores::before,
.landing-vantagem-digital::before {
    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;
    right: 0 !important;

    height: 5px !important;
}


.landing-vantagem-fornecedores::before {
    background:
        linear-gradient(
            90deg,
            #7c3aed,
            #a855f7,
            #f97316
        ) !important;
}


.landing-vantagem-digital::before {
    background:
        linear-gradient(
            90deg,
            #10b981,
            #22c55e,
            #1687ff
        ) !important;
}


/* ==========================================================
   BRILHO DE FUNDO
   ========================================================== */

.landing-vantagem-fornecedores::after,
.landing-vantagem-digital::after {
    content: "" !important;

    position: absolute !important;

    width: 220px !important;
    height: 220px !important;

    top: -120px !important;
    right: -90px !important;

    border-radius: 50% !important;

    pointer-events: none !important;
}


.landing-vantagem-fornecedores::after {
    background:
        radial-gradient(
            circle,
            rgba(124,58,237,.11),
            transparent 68%
        ) !important;
}


.landing-vantagem-digital::after {
    background:
        radial-gradient(
            circle,
            rgba(16,185,129,.11),
            transparent 68%
        ) !important;
}


/* ==========================================================
   HOVER
   ========================================================== */

.landing-vantagem-fornecedores:hover,
.landing-vantagem-digital:hover {
    transform:
        translateY(-7px) !important;

    box-shadow:
        0 28px 58px rgba(44,29,77,.14) !important;
}


.landing-vantagem-fornecedores:hover {
    border-color:
        rgba(124,58,237,.42) !important;
}


.landing-vantagem-digital:hover {
    border-color:
        rgba(16,185,129,.42) !important;
}


/* ==========================================================
   MEDALHA / ICONE FORNECEDORES
   ========================================================== */

.landing-medalha {
    width: 82px !important;
    height: 82px !important;

    display: grid !important;

    place-items: center !important;

    border-radius: 22px !important;

    color: #ffffff !important;

    background:
        linear-gradient(
            145deg,
            #8b5cf6,
            #6d28d9
        ) !important;

    box-shadow:
        0 15px 32px rgba(124,58,237,.23) !important;

    border:
        none !important;
}


/* ==========================================================
   ICONE DIGITAL
   ========================================================== */

.landing-digital-icone {
    width: 82px !important;
    height: 82px !important;

    display: grid !important;

    place-items: center !important;

    border-radius: 22px !important;

    color: #ffffff !important;

    background:
        linear-gradient(
            145deg,
            #22c55e,
            #059669
        ) !important;

    box-shadow:
        0 15px 32px rgba(16,185,129,.22) !important;

    border:
        none !important;
}


/* ==========================================================
   TITULOS
   ========================================================== */

.landing-vantagem-fornecedores h3,
.landing-vantagem-digital h3 {
    color:
        #171426 !important;

    font-size:
        27px !important;

    font-weight:
        850 !important;

    line-height:
        1.15 !important;

    letter-spacing:
        -.025em !important;
}


.landing-vantagem-fornecedores h4 {
    color:
        #7c3aed !important;

    font-size:
        15px !important;

    font-weight:
        800 !important;
}


.landing-vantagem-digital h4 {
    color:
        #059669 !important;

    font-size:
        15px !important;

    font-weight:
        800 !important;
}


/* ==========================================================
   TEXTOS
   ========================================================== */

.landing-vantagem-fornecedores p,
.landing-vantagem-digital p {
    color:
        #625b70 !important;

    font-size:
        14px !important;

    line-height:
        1.65 !important;
}


/* ==========================================================
   LISTAS
   ========================================================== */

.landing-vantagem-conteudo ul,
.landing-vantagem-digital ul {
    display: grid !important;

    gap: 11px !important;

    margin-top: 20px !important;

    padding: 0 !important;

    list-style: none !important;
}


.landing-vantagem-conteudo li,
.landing-vantagem-digital li {
    position: relative !important;

    padding-left:
        28px !important;

    color:
        #514b5e !important;

    font-size:
        13.5px !important;

    line-height:
        1.5 !important;
}


.landing-vantagem-conteudo li::before,
.landing-vantagem-digital li::before {
    content:
        "?" !important;

    position:
        absolute !important;

    left:
        0 !important;

    top:
        0 !important;

    width:
        19px !important;

    height:
        19px !important;

    display:
        grid !important;

    place-items:
        center !important;

    border-radius:
        50% !important;

    color:
        #ffffff !important;

    font-size:
        11px !important;

    font-weight:
        900 !important;
}


.landing-vantagem-conteudo li::before {
    background:
        #7c3aed !important;
}


.landing-vantagem-digital li::before {
    background:
        #10b981 !important;
}


/* ==========================================================
   CHIPS VISUAIS
   ========================================================== */

.landing-vantagem-fornecedores
.landing-vantagem-conteudo::after {
    content:
        "Pe?as selecionadas  ?  Contatos organizados  ?  Acesso premium" !important;

    display:
        block !important;

    margin-top:
        24px !important;

    padding:
        13px 15px !important;

    border-radius:
        14px !important;

    color:
        #6d28d9 !important;

    background:
        #f5efff !important;

    border:
        1px solid #e2d3fa !important;

    font-size:
        12px !important;

    font-weight:
        750 !important;
}


.landing-vantagem-digital
.landing-digital-topo::after {
    content:
        "Site profissional  ?  Dom?nio pr?prio  ?  Presen?a no Google" !important;

    display:
        block !important;

    position:
        absolute !important;

    left:
        34px !important;

    right:
        34px !important;

    bottom:
        86px !important;

    padding:
        13px 15px !important;

    border-radius:
        14px !important;

    color:
        #047857 !important;

    background:
        #ecfdf5 !important;

    border:
        1px solid #c8f0dd !important;

    font-size:
        12px !important;

    font-weight:
        750 !important;
}


/* ==========================================================
   BOTAO DIGITAL
   ========================================================== */

.landing-digital-botao {
    width:
        100% !important;

    min-height:
        52px !important;

    margin-top:
        28px !important;

    border:
        none !important;

    border-radius:
        14px !important;

    color:
        #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #10b981,
            #059669
        ) !important;

    box-shadow:
        0 10px 24px rgba(16,185,129,.20) !important;

    font-weight:
        850 !important;

    cursor:
        pointer !important;
}


.landing-digital-botao:hover {
    background:
        linear-gradient(
            135deg,
            #059669,
            #047857
        ) !important;

    transform:
        translateY(-1px) !important;
}


/* ==========================================================
   RESPONSIVO
   ========================================================== */

@media (max-width: 900px) {

    .landing-vantagens-grade {
        grid-template-columns:
            1fr !important;
    }

    .landing-vantagem-fornecedores,
    .landing-vantagem-digital {
        min-height:
            auto !important;
    }

    .landing-vantagem-digital
    .landing-digital-topo::after {
        position:
            static !important;

        margin-top:
            22px !important;
    }
}