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

.ft-clube-premium {
    --ft-roxo: #6d28d9;
    --ft-roxo2: #8b5cf6;
    --ft-laranja: #f97316;

    --ft-verde: #08b85c;
    --ft-verde2: #00c96b;
    --ft-azul: #1687ff;

    --ft-texto: #11142d;
    --ft-suave: #536179;

    position: relative;

    overflow: hidden;

    padding:
        92px 26px 78px;

    background:
        radial-gradient(
            circle at 10% 45%,
            rgba(124,58,237,.10),
            transparent 25%
        ),
        radial-gradient(
            circle at 88% 60%,
            rgba(22,135,255,.07),
            transparent 24%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fcfbff 48%,
            #f7f3ff 100%
        );

    color:
        var(--ft-texto);
}


/* ==========================================================
   ELEMENTOS DECORATIVOS
   ========================================================== */

.ft-clube-premium::before {
    content: "";

    position: absolute;

    top: 105px;
    left: 20px;

    width: 145px;
    height: 145px;

    opacity: .3;

    background-image:
        radial-gradient(
            #9c82ee 2px,
            transparent 2px
        );

    background-size:
        17px 17px;

    pointer-events: none;
}


.ft-clube-premium::after {
    content: "";

    position: absolute;

    right: 25px;
    bottom: 20px;

    width: 145px;
    height: 145px;

    opacity: .22;

    background-image:
        radial-gradient(
            #8baeff 2px,
            transparent 2px
        );

    background-size:
        17px 17px;

    pointer-events: none;
}


.ft-clube-arco {
    position: absolute;

    width: 570px;
    height: 300px;

    border:
        2px solid rgba(255,255,255,.9);

    border-radius:
        50%;

    pointer-events: none;
}


.ft-clube-arco.esquerda {
    top: -160px;
    left: -310px;

    transform:
        rotate(-20deg);
}


.ft-clube-arco.direita {
    top: 130px;
    right: -330px;

    transform:
        rotate(-20deg);
}


/* ==========================================================
   CONTAINER
   ========================================================== */

.ft-clube-container {
    position: relative;

    z-index: 2;

    width:
        min(100%, 1320px);

    margin:
        0 auto;
}


/* ==========================================================
   CABECALHO
   ========================================================== */

.ft-clube-cabecalho {
    max-width:
        1040px;

    margin:
        0 auto 62px;

    text-align:
        center;
}


/* etiqueta */

.ft-clube-etiqueta {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    padding:
        10px 20px;

    margin-bottom:
        20px;

    border-radius:
        999px;

    background:
        linear-gradient(
            135deg,
            #f2eaff,
            #e7dcff
        );

    color:
        #5720c5;

    font-size:
        14px;

    font-weight:
        850;

    letter-spacing:
        .015em;

    box-shadow:
        0 8px 22px rgba(109,40,217,.09);
}


.ft-clube-etiqueta svg {
    width:
        21px;

    height:
        21px;

    stroke:
        currentColor;
}


/* titulo */

.ft-clube-cabecalho h2 {
    margin:
        0;

    color:
        #11142d;

    font-size:
        clamp(
            42px,
            4.6vw,
            68px
        );

    line-height:
        1.02;

    letter-spacing:
        -.05em;

    font-weight:
        870;
}


.ft-clube-tech {
    position:
        relative;

    display:
        inline-block;

    color:
        #6925dc;
}


.ft-clube-tech::after {
    content: "";

    position:
        absolute;

    left:
        4%;

    right:
        -2%;

    bottom:
        -8px;

    height:
        4px;

    border-radius:
        999px;

    background:
        linear-gradient(
            90deg,
            #6d28d9,
            #8b5cf6,
            #c084fc
        );

    transform:
        rotate(-1deg);
}


/* subtitulo */

.ft-clube-subtitulo {
    max-width:
        850px;

    margin:
        28px auto 0;

    color:
        var(--ft-suave);

    font-size:
        17.5px;

    line-height:
        1.65;
}


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

.ft-clube-cards {
    display:
        grid;

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

    gap:
        28px;

    align-items:
        stretch;
}


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

.ft-clube-card {
    --cor: var(--ft-roxo);
    --cor2: var(--ft-roxo2);
    --cor3: var(--ft-laranja);
    --soft: #f5efff;
    --soft2: #eee4ff;

    position:
        relative;

    display:
        flex;

    flex-direction:
        column;

    min-height:
        600px;

    padding:
        38px 38px 30px;

    overflow:
        hidden;

    border:
        1px solid rgba(124,58,237,.24);

    border-radius:
        30px;

    background:
        linear-gradient(
            150deg,
            #ffffff 0%,
            #ffffff 75%,
            #faf7ff 100%
        );

    box-shadow:
        0 23px 55px rgba(55,35,94,.10);

    transition:
        transform .24s ease,
        box-shadow .24s ease,
        border-color .24s ease;
}


.ft-clube-card:hover {
    transform:
        translateY(-7px);

    box-shadow:
        0 32px 68px rgba(55,35,94,.15);
}


/* card verde */

.ft-clube-card.digital {
    --cor: #08b85c;
    --cor2: #00c96b;
    --cor3: #1687ff;
    --soft: #eafbf2;
    --soft2: #dcf8e9;

    border-color:
        rgba(8,184,92,.27);

    background:
        linear-gradient(
            150deg,
            #ffffff 0%,
            #ffffff 72%,
            #f4fff9 100%
        );
}


/* ==========================================================
   LINHA SUPERIOR COLORIDA
   ========================================================== */

.ft-clube-card::before {
    content: "";

    position:
        absolute;

    top:
        0;

    left:
        0;

    right:
        0;

    height:
        6px;

    background:
        linear-gradient(
            90deg,
            var(--cor),
            var(--cor2),
            var(--cor3)
        );
}


/* ==========================================================
   BRILHO
   ========================================================== */

.ft-clube-card::after {
    content: "";

    position:
        absolute;

    width:
        240px;

    height:
        240px;

    top:
        -130px;

    right:
        -100px;

    border-radius:
        50%;

    background:
        radial-gradient(
            circle,
            color-mix(
                in srgb,
                var(--cor) 15%,
                transparent
            ),
            transparent 68%
        );

    pointer-events:
        none;
}


/* ==========================================================
   TOPO DO CARD
   ========================================================== */

.ft-clube-topo {
    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        16px;

    margin-bottom:
        26px;
}


/* selo */

.ft-clube-selo {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    padding:
        9px 15px;

    border-radius:
        999px;

    color:
        var(--cor);

    background:
        var(--soft);

    font-size:
        12px;

    font-weight:
        850;

    text-transform:
        uppercase;

    letter-spacing:
        .01em;
}


.ft-clube-selo svg {
    width:
        18px;

    height:
        18px;

    stroke:
        currentColor;
}


/* 50 off */

.ft-clube-desconto {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        8px;

    padding:
        10px 16px;

    border-radius:
        999px;

    color:
        #251500;

    background:
        linear-gradient(
            135deg,
            #ffd76a,
            #f3ad16
        );

    box-shadow:
        0 9px 22px rgba(244,180,0,.20);

    font-size:
        14px;

    font-weight:
        900;
}


.ft-clube-desconto svg {
    width:
        18px;

    height:
        18px;

    stroke:
        currentColor;
}


/* ==========================================================
   HERO INTERNO
   ========================================================== */

.ft-clube-card-hero {
    display:
        grid;

    grid-template-columns:
        150px minmax(0,1fr);

    gap:
        27px;

    align-items:
        center;

    margin-bottom:
        23px;
}


/* ==========================================================
   ICONE GRANDE
   ========================================================== */

.ft-clube-icone-wrap {
    position:
        relative;

    display:
        grid;

    place-items:
        center;

    width:
        144px;

    height:
        144px;
}


.ft-clube-icone-wrap::before {
    content: "";

    position:
        absolute;

    inset:
        -11px;

    border-radius:
        50%;

    border:
        2px solid
        color-mix(
            in srgb,
            var(--cor) 30%,
            transparent
        );

    transform:
        rotate(14deg);
}


.ft-clube-icone-wrap::after {
    content: "";

    position:
        absolute;

    inset:
        -21px;

    border-radius:
        50%;

    background-image:
        radial-gradient(
            var(--cor) 1.6px,
            transparent 1.6px
        );

    background-size:
        9px 9px;

    opacity:
        .19;
}


.ft-clube-icone {
    position:
        relative;

    z-index:
        2;

    display:
        grid;

    place-items:
        center;

    width:
        120px;

    height:
        120px;

    border-radius:
        50%;

    color:
        #ffffff;

    background:
        radial-gradient(
            circle at 35% 28%,
            rgba(255,255,255,.40),
            transparent 21%
        ),
        linear-gradient(
            145deg,
            var(--cor2),
            var(--cor)
        );

    box-shadow:
        0 17px 34px
        color-mix(
            in srgb,
            var(--cor) 32%,
            transparent
        );
}


.ft-clube-icone svg {
    width:
        67px;

    height:
        67px;

    stroke:
        currentColor;
}


/* ==========================================================
   TITULO
   ========================================================== */

.ft-clube-card-texto h3 {
    margin:
        0 0 7px;

    color:
        #11142d;

    font-size:
        clamp(
            26px,
            2.1vw,
            34px
        );

    line-height:
        1.08;

    letter-spacing:
        -.035em;

    font-weight:
        880;
}


.ft-clube-card-subtitulo {
    margin:
        0 0 14px;

    color:
        var(--cor);

    font-size:
        16px;

    font-weight:
        850;
}


.ft-clube-card-descricao {
    margin:
        0;

    color:
        #4f5d73;

    font-size:
        14.5px;

    line-height:
        1.6;
}


/* ==========================================================
   LISTA
   ========================================================== */

.ft-clube-lista {
    display:
        grid;

    gap:
        12px;

    margin:
        10px 0 24px;

    padding:
        0;

    list-style:
        none;
}


.ft-clube-lista li {
    display:
        grid;

    grid-template-columns:
        25px minmax(0,1fr);

    gap:
        10px;

    align-items:
        center;

    color:
        #344055;

    font-size:
        14px;

    line-height:
        1.4;
}


.ft-clube-check {
    display:
        grid;

    width:
        23px;

    height:
        23px;

    place-items:
        center;

    border-radius:
        50%;

    color:
        #ffffff;

    background:
        linear-gradient(
            145deg,
            var(--cor2),
            var(--cor)
        );

    font-size:
        12px;

    font-weight:
        900;

    box-shadow:
        0 5px 13px
        color-mix(
            in srgb,
            var(--cor) 20%,
            transparent
        );
}


/* ==========================================================
   BLOCO BENEFICIO
   ========================================================== */

.ft-clube-resumo {
    display:
        grid;

    grid-template-columns:
        54px minmax(0,1fr);

    gap:
        16px;

    align-items:
        center;

    margin-top:
        auto;

    margin-bottom:
        24px;

    padding:
        17px 19px;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--cor) 18%,
            transparent
        );

    border-radius:
        18px;

    background:
        linear-gradient(
            135deg,
            var(--soft),
            var(--soft2)
        );
}


.ft-clube-resumo-icone {
    display:
        grid;

    width:
        52px;

    height:
        52px;

    place-items:
        center;

    border-radius:
        15px;

    color:
        var(--cor);

    background:
        rgba(255,255,255,.58);
}


.ft-clube-resumo-icone svg {
    width:
        31px;

    height:
        31px;

    stroke:
        currentColor;
}


.ft-clube-resumo strong {
    display:
        block;

    margin-bottom:
        3px;

    color:
        var(--cor);

    font-size:
        14px;

    font-weight:
        880;
}


.ft-clube-resumo small {
    display:
        block;

    color:
        #495669;

    font-size:
        12px;

    line-height:
        1.4;
}


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

.ft-clube-botao {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    gap:
        11px;

    width:
        100%;

    min-height:
        58px;

    padding:
        0 21px;

    border:
        none;

    border-radius:
        16px;

    color:
        #ffffff;

    background:
        linear-gradient(
            110deg,
            var(--cor),
            var(--cor2),
            var(--cor3)
        );

    box-shadow:
        0 13px 28px
        color-mix(
            in srgb,
            var(--cor) 23%,
            transparent
        );

    text-decoration:
        none;

    font-size:
        17px;

    font-weight:
        880;

    cursor:
        pointer;

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}


.ft-clube-botao:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 17px 34px
        color-mix(
            in srgb,
            var(--cor) 29%,
            transparent
        );
}


.ft-clube-botao svg {
    width:
        22px;

    height:
        22px;

    stroke:
        currentColor;
}


.ft-clube-botao-seta {
    margin-left:
        2px;

    font-size:
        25px;

    line-height:
        1;
}


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

@media (max-width: 1000px) {

    .ft-clube-cards {
        grid-template-columns:
            1fr;
    }

    .ft-clube-card {
        min-height:
            auto;
    }
}


@media (max-width: 620px) {

    .ft-clube-premium {
        padding:
            68px 16px 58px;
    }

    .ft-clube-cabecalho {
        margin-bottom:
            48px;
    }

    .ft-clube-card {
        padding:
            30px 22px 23px;
    }

    .ft-clube-card-hero {
        grid-template-columns:
            92px minmax(0,1fr);

        gap:
            17px;
    }

    .ft-clube-icone-wrap {
        width:
            88px;

        height:
            88px;
    }

    .ft-clube-icone {
        width:
            79px;

        height:
            79px;
    }

    .ft-clube-icone svg {
        width:
            43px;

        height:
            43px;
    }

    .ft-clube-topo {
        align-items:
            flex-start;

        flex-wrap:
            wrap;
    }

    .ft-clube-desconto {
        font-size:
            12px;
    }
}




/* ==========================================================
   CLUBE PREMIUM - COMPACTACAO V2
   ========================================================== */

.ft-clube-premium {
    padding:
        68px 26px 58px !important;
}


/* CABECALHO */

.ft-clube-cabecalho {
    max-width:
        900px !important;

    margin-bottom:
        42px !important;
}


.ft-clube-etiqueta {
    padding:
        8px 17px !important;

    margin-bottom:
        15px !important;

    font-size:
        12px !important;
}


.ft-clube-cabecalho h2 {
    font-size:
        clamp(
            36px,
            3.7vw,
            54px
        ) !important;

    line-height:
        1.04 !important;
}


.ft-clube-subtitulo {
    max-width:
        760px !important;

    margin-top:
        20px !important;

    font-size:
        15.5px !important;

    line-height:
        1.55 !important;
}


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

.ft-clube-cards {
    max-width:
        1180px !important;

    margin-left:
        auto !important;

    margin-right:
        auto !important;

    gap:
        24px !important;
}


/* ==========================================================
   CARDS MENORES
   ========================================================== */

.ft-clube-card {
    min-height:
        490px !important;

    padding:
        30px 30px 25px !important;

    border-radius:
        25px !important;
}


/* linha superior */

.ft-clube-card::before {
    height:
        5px !important;
}


/* ==========================================================
   TOPO
   ========================================================== */

.ft-clube-topo {
    margin-bottom:
        18px !important;
}


.ft-clube-selo {
    padding:
        7px 13px !important;

    font-size:
        10.5px !important;
}


.ft-clube-selo svg {
    width:
        15px !important;

    height:
        15px !important;
}


.ft-clube-desconto {
    padding:
        8px 13px !important;

    font-size:
        12px !important;
}


/* ==========================================================
   HERO INTERNO
   ========================================================== */

.ft-clube-card-hero {
    grid-template-columns:
        112px minmax(0,1fr) !important;

    gap:
        22px !important;

    margin-bottom:
        16px !important;
}


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

.ft-clube-icone-wrap {
    width:
        108px !important;

    height:
        108px !important;
}


.ft-clube-icone-wrap::before {
    inset:
        -7px !important;
}


.ft-clube-icone-wrap::after {
    inset:
        -13px !important;

    background-size:
        8px 8px !important;
}


.ft-clube-icone {
    width:
        92px !important;

    height:
        92px !important;
}


.ft-clube-icone svg {
    width:
        49px !important;

    height:
        49px !important;
}


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

.ft-clube-card-texto h3 {
    margin-bottom:
        5px !important;

    font-size:
        clamp(
            23px,
            1.9vw,
            29px
        ) !important;
}


.ft-clube-card-subtitulo {
    margin-bottom:
        9px !important;

    font-size:
        14px !important;
}


.ft-clube-card-descricao {
    font-size:
        13px !important;

    line-height:
        1.5 !important;
}


/* ==========================================================
   LISTA
   ========================================================== */

.ft-clube-lista {
    gap:
        8px !important;

    margin:
        6px 0 17px !important;
}


.ft-clube-lista li {
    grid-template-columns:
        21px minmax(0,1fr) !important;

    gap:
        8px !important;

    font-size:
        12.5px !important;
}


.ft-clube-check {
    width:
        19px !important;

    height:
        19px !important;

    font-size:
        10px !important;
}


/* ==========================================================
   BLOCO INFERIOR
   ========================================================== */

.ft-clube-resumo {
    grid-template-columns:
        44px minmax(0,1fr) !important;

    gap:
        12px !important;

    margin-bottom:
        17px !important;

    padding:
        13px 15px !important;

    border-radius:
        15px !important;
}


.ft-clube-resumo-icone {
    width:
        42px !important;

    height:
        42px !important;

    border-radius:
        12px !important;
}


.ft-clube-resumo-icone svg {
    width:
        25px !important;

    height:
        25px !important;
}


.ft-clube-resumo strong {
    font-size:
        12.5px !important;
}


.ft-clube-resumo small {
    font-size:
        10.5px !important;

    line-height:
        1.35 !important;
}


/* ==========================================================
   BOTOES
   ========================================================== */

.ft-clube-botao {
    min-height:
        49px !important;

    border-radius:
        14px !important;

    font-size:
        14.5px !important;

    box-shadow:
        0 10px 22px
        color-mix(
            in srgb,
            var(--cor) 20%,
            transparent
        ) !important;
}


.ft-clube-botao svg {
    width:
        18px !important;

    height:
        18px !important;
}


.ft-clube-botao-seta {
    font-size:
        20px !important;
}


/* ==========================================================
   MENOS DECORACAO EXAGERADA
   ========================================================== */

.ft-clube-premium::before,
.ft-clube-premium::after {
    opacity:
        .17 !important;
}


.ft-clube-arco {
    opacity:
        .55 !important;
}


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

@media (max-width: 1000px) {

    .ft-clube-card {
        min-height:
            auto !important;
    }
}


@media (max-width: 620px) {

    .ft-clube-premium {
        padding:
            54px 15px 48px !important;
    }

    .ft-clube-card {
        padding:
            25px 19px 20px !important;
    }

    .ft-clube-card-hero {
        grid-template-columns:
            78px minmax(0,1fr) !important;
    }

    .ft-clube-icone-wrap {
        width:
            75px !important;

        height:
            75px !important;
    }

    .ft-clube-icone {
        width:
            68px !important;

        height:
            68px !important;
    }

    .ft-clube-icone svg {
        width:
            37px !important;

        height:
            37px !important;
    }
}




/* ==========================================================
   CLUBE PREMIUM - REFERENCIA VISUAL FINAL
   ========================================================== */

.ft-clube-premium {
    padding:
        58px 24px 54px !important;

    background:
        radial-gradient(
            circle at 12% 34%,
            rgba(124,58,237,.09),
            transparent 24%
        ),
        radial-gradient(
            circle at 87% 62%,
            rgba(22,135,255,.07),
            transparent 23%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfaff 55%,
            #f7f3ff 100%
        ) !important;
}


/* CABECALHO */

.ft-clube-cabecalho {
    max-width:
        980px !important;

    margin-bottom:
        34px !important;
}


.ft-clube-etiqueta {
    padding:
        8px 16px !important;

    margin-bottom:
        14px !important;

    font-size:
        12px !important;
}


.ft-clube-cabecalho h2 {
    font-size:
        clamp(
            38px,
            4vw,
            58px
        ) !important;

    line-height:
        1.02 !important;
}


.ft-clube-subtitulo {
    max-width:
        820px !important;

    margin-top:
        18px !important;

    font-size:
        15.5px !important;

    line-height:
        1.5 !important;
}


/* GRADE */

.ft-clube-cards {
    width:
        min(100%, 1240px) !important;

    margin:
        0 auto !important;

    gap:
        22px !important;
}


/* CARD */

.ft-clube-card {
    min-height:
        520px !important;

    padding:
        30px 30px 24px !important;

    border-radius:
        28px !important;

    box-shadow:
        0 22px 50px rgba(49,36,84,.10) !important;
}


.ft-clube-card:hover {
    transform:
        translateY(-5px) !important;
}


/* TOPO */

.ft-clube-topo {
    margin-bottom:
        16px !important;
}


.ft-clube-selo {
    padding:
        7px 13px !important;

    font-size:
        10.5px !important;
}


.ft-clube-desconto {
    padding:
        8px 14px !important;

    font-size:
        12px !important;
}


/* HERO */

.ft-clube-card-hero {
    grid-template-columns:
        150px minmax(0,1fr) !important;

    gap:
        22px !important;

    margin-bottom:
        16px !important;
}


/* ICONE GRANDE */

.ft-clube-icone-wrap {
    width:
        142px !important;

    height:
        142px !important;
}


.ft-clube-icone {
    width:
        118px !important;

    height:
        118px !important;
}


.ft-clube-icone svg {
    width:
        64px !important;

    height:
        64px !important;
}


/* reforca efeito orbital */

.ft-clube-icone-wrap::before {
    inset:
        -8px !important;

    border-width:
        2px !important;

    transform:
        rotate(20deg) !important;
}


.ft-clube-icone-wrap::after {
    inset:
        -16px !important;

    opacity:
        .20 !important;
}


/* TITULOS */

.ft-clube-card-texto h3 {
    margin-bottom:
        6px !important;

    font-size:
        clamp(
            25px,
            2vw,
            31px
        ) !important;
}


.ft-clube-card-subtitulo {
    margin-bottom:
        9px !important;

    font-size:
        14.5px !important;
}


.ft-clube-card-descricao {
    font-size:
        13px !important;

    line-height:
        1.48 !important;
}


/* LISTA */

.ft-clube-lista {
    gap:
        8px !important;

    margin:
        5px 0 18px !important;
}


.ft-clube-lista li {
    font-size:
        12.8px !important;
}


.ft-clube-check {
    width:
        20px !important;

    height:
        20px !important;
}


/* RESUMO */

.ft-clube-resumo {
    grid-template-columns:
        44px minmax(0,1fr) !important;

    gap:
        12px !important;

    margin-bottom:
        17px !important;

    padding:
        13px 15px !important;

    border-radius:
        18px !important;
}


.ft-clube-resumo-icone {
    width:
        42px !important;

    height:
        42px !important;
}


.ft-clube-resumo strong {
    font-size:
        12.8px !important;
}


.ft-clube-resumo small {
    font-size:
        10.7px !important;
}


/* BOTOES */

.ft-clube-botao {
    min-height:
        52px !important;

    border-radius:
        15px !important;

    font-size:
        15px !important;
}


/* FORNECEDORES - gradiente roxo -> rosa -> laranja */

.ft-clube-card.fornecedor::before,
.ft-clube-card.fornecedor .ft-clube-botao {
    background:
        linear-gradient(
            100deg,
            #6d28d9 0%,
            #8b3ff0 46%,
            #f97316 100%
        ) !important;
}


/* DIGITAL - gradiente verde -> azul */

.ft-clube-card.digital::before,
.ft-clube-card.digital .ft-clube-botao {
    background:
        linear-gradient(
            100deg,
            #08b85c 0%,
            #00c96b 48%,
            #1687ff 100%
        ) !important;
}


/* RESUMOS MAIS PROXIMOS DA REFERENCIA */

.ft-clube-card.fornecedor
.ft-clube-resumo {
    background:
        linear-gradient(
            135deg,
            #f4edff,
            #eee5ff
        ) !important;

    border-color:
        #dfcef9 !important;
}


.ft-clube-card.digital
.ft-clube-resumo {
    background:
        linear-gradient(
            135deg,
            #e9fbf2,
            #ddf8eb
        ) !important;

    border-color:
        #bfeccf !important;
}


/* DECORACAO MENOS FORTE */

.ft-clube-premium::before,
.ft-clube-premium::after {
    opacity:
        .18 !important;
}


/* RESPONSIVO */

@media (max-width: 1000px) {

    .ft-clube-card-hero {
        grid-template-columns:
            120px minmax(0,1fr) !important;
    }

    .ft-clube-icone-wrap {
        width:
            112px !important;

        height:
            112px !important;
    }

    .ft-clube-icone {
        width:
            94px !important;

        height:
            94px !important;
    }
}


@media (max-width: 620px) {

    .ft-clube-premium {
        padding:
            48px 14px !important;
    }

    .ft-clube-card {
        padding:
            25px 19px 20px !important;
    }

    .ft-clube-card-hero {
        grid-template-columns:
            80px minmax(0,1fr) !important;
    }

    .ft-clube-icone-wrap {
        width:
            76px !important;

        height:
            76px !important;
    }

    .ft-clube-icone {
        width:
            68px !important;

        height:
            68px !important;
    }

    .ft-clube-icone svg {
        width:
            38px !important;

        height:
            38px !important;
    }
}




/* ==========================================================
   CLUBE PREMIUM - AJUSTE VISUAL FINO V4
   ========================================================== */


/* SECAO MAIS COMPACTA */

.ft-clube-premium {
    padding:
        54px 20px 50px !important;

    background:
        radial-gradient(
            circle at 12% 32%,
            rgba(124, 58, 237, .055),
            transparent 23%
        ),
        radial-gradient(
            circle at 88% 60%,
            rgba(14, 165, 233, .045),
            transparent 22%
        ),
        linear-gradient(
            180deg,
            #ffffff 0%,
            #fbfaff 56%,
            #f7f5fb 100%
        ) !important;
}


/* CABECALHO */

.ft-clube-cabecalho {
    max-width:
        860px !important;

    margin-bottom:
        30px !important;
}


.ft-clube-etiqueta {
    padding:
        7px 14px !important;

    margin-bottom:
        12px !important;

    font-size:
        11px !important;

    box-shadow:
        0 6px 16px rgba(109, 40, 217, .07) !important;
}


.ft-clube-cabecalho h2 {
    font-size:
        clamp(
            34px,
            3.5vw,
            48px
        ) !important;

    line-height:
        1.03 !important;

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


.ft-clube-subtitulo {
    max-width:
        720px !important;

    margin-top:
        16px !important;

    font-size:
        14.5px !important;

    line-height:
        1.5 !important;
}


/* GRADE MAIS ESTREITA */

.ft-clube-cards {
    width:
        min(100%, 1100px) !important;

    margin:
        0 auto !important;

    gap:
        20px !important;
}


/* CARDS MENORES */

.ft-clube-card {
    min-height:
        460px !important;

    padding:
        26px 26px 22px !important;

    border-radius:
        24px !important;

    background:
        linear-gradient(
            155deg,
            #ffffff 0%,
            #ffffff 82%,
            #fbfaff 100%
        ) !important;

    box-shadow:
        0 16px 36px rgba(40, 29, 68, .075) !important;
}


.ft-clube-card.digital {
    background:
        linear-gradient(
            155deg,
            #ffffff 0%,
            #ffffff 82%,
            #f8fffb 100%
        ) !important;
}


/* LINHAS SUPERIORES MAIS SUAVES */

.ft-clube-card.fornecedor::before {
    background:
        linear-gradient(
            90deg,
            #6f35d8 0%,
            #9553e6 55%,
            #e98645 100%
        ) !important;
}


.ft-clube-card.digital::before {
    background:
        linear-gradient(
            90deg,
            #0ea66b 0%,
            #22b98a 52%,
            #3097db 100%
        ) !important;
}


/* TOPO */

.ft-clube-topo {
    margin-bottom:
        13px !important;
}


.ft-clube-selo {
    padding:
        6px 11px !important;

    font-size:
        10px !important;
}


.ft-clube-desconto {
    padding:
        7px 12px !important;

    font-size:
        11px !important;

    box-shadow:
        0 6px 15px rgba(244, 180, 0, .14) !important;
}


/* HERO INTERNO */

.ft-clube-card-hero {
    grid-template-columns:
        118px minmax(0, 1fr) !important;

    gap:
        18px !important;

    margin-bottom:
        12px !important;
}


/* ICONES MAIS ELEGANTES */

.ft-clube-icone-wrap {
    width:
        112px !important;

    height:
        112px !important;
}


.ft-clube-icone {
    width:
        94px !important;

    height:
        94px !important;

    box-shadow:
        0 13px 26px
        color-mix(
            in srgb,
            var(--cor) 24%,
            transparent
        ) !important;
}


.ft-clube-icone svg {
    width:
        49px !important;

    height:
        49px !important;
}


.ft-clube-icone-wrap::before {
    inset:
        -6px !important;

    opacity:
        .7 !important;
}


.ft-clube-icone-wrap::after {
    inset:
        -10px !important;

    opacity:
        .12 !important;
}


/* TITULOS */

.ft-clube-card-texto h3 {
    font-size:
        clamp(
            22px,
            1.7vw,
            27px
        ) !important;

    margin-bottom:
        4px !important;
}


.ft-clube-card-subtitulo {
    font-size:
        13px !important;

    margin-bottom:
        8px !important;
}


.ft-clube-card-descricao {
    font-size:
        12.5px !important;

    line-height:
        1.48 !important;
}


/* LISTAS */

.ft-clube-lista {
    gap:
        7px !important;

    margin:
        4px 0 14px !important;
}


.ft-clube-lista li {
    font-size:
        12px !important;
}


.ft-clube-check {
    width:
        18px !important;

    height:
        18px !important;

    font-size:
        9px !important;
}


/* BLOCO RESUMO MAIS DISCRETO */

.ft-clube-resumo {
    grid-template-columns:
        40px minmax(0,1fr) !important;

    gap:
        10px !important;

    padding:
        11px 13px !important;

    margin-bottom:
        14px !important;

    border-radius:
        14px !important;
}


.ft-clube-resumo-icone {
    width:
        38px !important;

    height:
        38px !important;

    border-radius:
        11px !important;
}


.ft-clube-resumo-icone svg {
    width:
        22px !important;

    height:
        22px !important;
}


.ft-clube-resumo strong {
    font-size:
        12px !important;
}


.ft-clube-resumo small {
    font-size:
        10px !important;
}


/* CORES MAIS LEVES NOS RESUMOS */

.ft-clube-card.fornecedor
.ft-clube-resumo {
    background:
        #f5f0fb !important;

    border-color:
        #e1d5ef !important;
}


.ft-clube-card.digital
.ft-clube-resumo {
    background:
        #eef9f4 !important;

    border-color:
        #d0eadf !important;
}


/* BOTOES MENORES E MENOS SATURADOS */

.ft-clube-botao {
    min-height:
        46px !important;

    border-radius:
        13px !important;

    font-size:
        13.5px !important;

    box-shadow:
        0 8px 18px
        color-mix(
            in srgb,
            var(--cor) 18%,
            transparent
        ) !important;
}


.ft-clube-card.fornecedor
.ft-clube-botao {
    background:
        linear-gradient(
            100deg,
            #6f35d8 0%,
            #9553e6 55%,
            #e98645 100%
        ) !important;
}


.ft-clube-card.digital
.ft-clube-botao {
    background:
        linear-gradient(
            100deg,
            #0ea66b 0%,
            #20b58a 52%,
            #3097db 100%
        ) !important;
}


/* DECORACAO MAIS SUTIL */

.ft-clube-premium::before,
.ft-clube-premium::after {
    opacity:
        .11 !important;
}


.ft-clube-arco {
    opacity:
        .35 !important;
}


/* HOVER SUAVE */

.ft-clube-card:hover {
    transform:
        translateY(-4px) !important;

    box-shadow:
        0 20px 44px rgba(40, 29, 68, .10) !important;
}


/* RESPONSIVO */

@media (max-width: 900px) {

    .ft-clube-cards {
        width:
            min(100%, 680px) !important;
    }

    .ft-clube-card {
        min-height:
            auto !important;
    }
}


@media (max-width: 620px) {

    .ft-clube-card-hero {
        grid-template-columns:
            74px minmax(0,1fr) !important;
    }

    .ft-clube-icone-wrap {
        width:
            70px !important;

        height:
            70px !important;
    }

    .ft-clube-icone {
        width:
            62px !important;

        height:
            62px !important;
    }

    .ft-clube-icone svg {
        width:
            34px !important;

        height:
            34px !important;
    }
}