/* =========================================================
   WHATSAPP PRODUCT SECTION
   ========================================================= */

.whatsapp-product-section{
    position:relative;
    overflow:hidden;

    padding:110px 0;

    background:
        radial-gradient(
            circle at 82% 50%,
            rgba(106,57,202,.18),
            transparent 35%
        ),
        linear-gradient(
            135deg,
            #170b31 0%,
            #26104f 55%,
            #32126a 100%
        );
}


.whatsapp-product-section::before{
    content:"";

    position:absolute;
    inset:0;

    opacity:.10;

    pointer-events:none;

    background-image:
        linear-gradient(
            rgba(255,255,255,.08) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.08) 1px,
            transparent 1px
        );

    background-size:42px 42px;
}


.whatsapp-product-grid{
    position:relative;
    z-index:1;

    display:grid;

    grid-template-columns:
        minmax(0,.88fr)
        minmax(0,1.12fr);

    align-items:center;

    gap:72px;
}


/* =========================================================
   COPY
   ========================================================= */

.whatsapp-product-copy{
    max-width:640px;
}


.whatsapp-product-kicker{
    display:inline-flex;

    align-items:center;

    gap:8px;

    min-height:38px;

    padding:0 15px;

    border:
        1px solid rgba(255,255,255,.13);

    border-radius:999px;

    background:
        rgba(255,255,255,.07);

    color:#fff;

    font-size:11px;
    font-weight:800;

    letter-spacing:.07em;

    text-transform:uppercase;
}


.whatsapp-product-kicker i{
    color:#22d466;

    font-size:17px;
}


.whatsapp-product-copy h2{
    max-width:660px;

    margin:26px 0 0;

    color:#fff;

    font-family:
        "Plus Jakarta Sans",
        "Space Grotesk",
        Nunito,
        sans-serif;

    font-size:
        clamp(30px,3.4vw,46px);

    font-weight:500;

    line-height:1.22;

    letter-spacing:-.02em;

    text-wrap:pretty;
}


.whatsapp-product-copy h2 em{
    color:#55d987;

    font-weight:700;

    font-style:normal;
}


.whatsapp-product-lead{
    max-width:610px;

    margin:26px 0 0;

    color:
        rgba(255,255,255,.70);

    font-size:17px;

    line-height:1.7;
}


/* =========================================================
   FEATURES
   ========================================================= */

.whatsapp-product-features{
    display:grid;

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

    gap:12px;

    margin-top:32px;
}


.whatsapp-product-feature{
    display:grid;

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

    gap:12px;

    align-items:start;

    min-height:110px;

    padding:17px;

    border:
        1px solid rgba(255,255,255,.10);

    border-radius:18px;

    background:
        rgba(255,255,255,.055);

    backdrop-filter:blur(10px);
}


.whatsapp-product-feature > i{
    display:grid;

    place-items:center;

    width:42px;
    height:42px;

    border-radius:13px;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #7949df,
            #9c5ee7
        );

    font-size:20px;
}


.whatsapp-product-feature > div{
    min-width:0;
}


.whatsapp-product-feature strong{
    display:block;

    color:#fff;

    font-size:13px;

    line-height:1.3;
}


.whatsapp-product-feature span{
    display:block;

    margin-top:5px;

    color:
        rgba(255,255,255,.57);

    font-size:10.5px;

    line-height:1.5;
}


/* =========================================================
   ACTIONS
   ========================================================= */

.whatsapp-product-actions{
    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:19px;

    margin-top:30px;
}


.whatsapp-product-primary{
    min-height:54px;

    padding:0 24px;

    background:
        linear-gradient(
            90deg,
            #6840db,
            #b057e7
        );
}


.whatsapp-product-secondary{
    color:
        rgba(255,255,255,.82);

    font-size:14px;

    font-weight:800;

    text-decoration:none;
}


.whatsapp-product-secondary:hover{
    color:#fff;
}


/* =========================================================
   PROOF
   ========================================================= */

.whatsapp-product-proof{
    display:flex;

    flex-wrap:wrap;

    gap:18px;

    margin-top:25px;

    color:
        rgba(255,255,255,.56);

    font-size:10.5px;

    font-weight:650;
}


.whatsapp-product-proof span{
    display:flex;

    align-items:center;

    gap:6px;
}


.whatsapp-product-proof i{
    color:#55d987;

    font-size:15px;
}


/* =========================================================
   VISUAL
   ========================================================= */

.whatsapp-product-visual{
    position:relative;

    min-width:0;

    min-height:580px;
}


.whatsapp-product-glow{
    position:absolute;

    top:50%;
    left:52%;

    width:80%;
    height:76%;

    transform:
        translate(-50%,-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(131,77,230,.40),
            rgba(101,55,203,.17) 48%,
            transparent 72%
        );

    filter:blur(32px);
}


.whatsapp-product-visual > img{
    position:absolute;

    z-index:2;

    top:50%;
    left:50%;

    width:98%;

    max-width:740px;

    transform:
        translate(-50%,-50%);

    object-fit:contain;

    filter:
        drop-shadow(
            0 32px 56px
            rgba(0,0,0,.32)
        );
}


/* =========================================================
   FLOATING LABELS
   ========================================================= */

.whatsapp-product-badge{
    position:absolute;

    z-index:5;

    top:28px;
    right:35px;

    display:flex;

    align-items:center;

    gap:8px;

    padding:10px 14px;

    border-radius:999px;

    color:#fff;

    background:#16b85b;

    box-shadow:
        0 14px 30px
        rgba(20,187,91,.24);

    font-size:11px;

    font-weight:800;
}


.whatsapp-product-badge i{
    font-size:17px;
}


.whatsapp-product-floating{
    position:absolute;

    z-index:6;

    display:flex;

    align-items:center;

    gap:8px;

    padding:10px 14px;

    border:
        1px solid rgba(255,255,255,.14);

    border-radius:14px;

    color:#fff;

    background:
        rgba(25,10,57,.78);

    backdrop-filter:blur(10px);

    box-shadow:
        0 14px 32px
        rgba(0,0,0,.20);

    font-size:11px;
}


.whatsapp-product-floating span{
    color:#a97af3;

    font-weight:900;
}


.whatsapp-product-floating strong{
    font-weight:750;
}


.whatsapp-product-floating--top{
    top:110px;
    left:0;
}


.whatsapp-product-floating--middle{
    top:50%;

    right:0;

    transform:
        translateY(-50%);
}


.whatsapp-product-floating--bottom{
    left:8%;
    bottom:70px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:1050px){

    .whatsapp-product-grid{
        gap:48px;
    }

    .whatsapp-product-features{
        grid-template-columns:1fr;
    }

    .whatsapp-product-visual{
        min-height:520px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:820px){

    .whatsapp-product-section{
        padding:82px 0;
    }

    .whatsapp-product-grid{
        grid-template-columns:1fr;

        gap:45px;
    }

    .whatsapp-product-copy{
        max-width:none;
    }

    .whatsapp-product-visual{
        min-height:480px;
    }

    .whatsapp-product-visual > img{
        width:100%;

        max-width:650px;
    }

}


/* =========================================================
   MOBILE PEQUENO
   ========================================================= */

@media(max-width:560px){

    .whatsapp-product-section{
        padding:68px 0;
    }

    .whatsapp-product-copy h2{
        font-size:
            clamp(34px,10vw,46px);
    }

    .whatsapp-product-lead{
        font-size:15px;
    }

    .whatsapp-product-actions{
        align-items:stretch;

        flex-direction:column;
    }

    .whatsapp-product-primary{
        width:100%;

        justify-content:center;
    }

    .whatsapp-product-secondary{
        text-align:center;
    }

    .whatsapp-product-proof{
        flex-direction:column;

        gap:8px;
    }

    .whatsapp-product-visual{
        min-height:390px;
    }

    .whatsapp-product-floating{
        display:none;
    }

    .whatsapp-product-badge{
        top:10px;
        right:10px;
    }

}


.whatsapp-product-section{
    padding:64px 0;
}

.whatsapp-product-grid{
    gap:52px;
}

.whatsapp-product-kicker{
    min-height:34px;
}

.whatsapp-product-copy h2{
    margin-top:20px;
}

.whatsapp-product-lead{
    margin-top:20px;
    line-height:1.6;
}

.whatsapp-product-features{
    gap:10px;
    margin-top:24px;
}

.whatsapp-product-feature{
    min-height:94px;
    padding:14px 15px;
}

.whatsapp-product-actions{
    margin-top:24px;
}

.whatsapp-product-proof{
    margin-top:18px;
}

.whatsapp-product-visual{
    min-height:470px;
}

.whatsapp-product-visual > img{
    width:75%;
    max-width:590px;
}

@media(max-width:700px){
    .whatsapp-product-section{
        padding:54px 0 58px;
        border-radius:24px 24px 34px 34px;
    }

    .whatsapp-product-section::before{
        opacity:.06;
        background-size:30px 30px;
    }

    .whatsapp-product-grid{
        gap:24px;
    }

    .whatsapp-product-copy{
        text-align:center;
    }

    .whatsapp-product-kicker{
        min-height:32px;
        margin-inline:auto;
        padding:0 12px;
        font-size:9.5px;
    }

    .whatsapp-product-copy h2{
        max-width:360px;
        margin:16px auto 0;
        font-size:clamp(27px,7.5vw,32px);
        line-height:1.1;
    }

    .whatsapp-product-lead{
        max-width:340px;
        margin:16px auto 0;
        font-size:14px;
        line-height:1.55;
    }

    .whatsapp-product-features{
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:8px;
        max-width:360px;
        margin:22px auto 0;
        text-align:left;
    }

    .whatsapp-product-feature{
        grid-template-columns:36px minmax(0,1fr);
        gap:9px;
        min-height:118px;
        padding:12px;
        border-radius:16px;
    }

    .whatsapp-product-feature > i{
        width:36px;
        height:36px;
        border-radius:11px;
        font-size:18px;
    }

    .whatsapp-product-feature strong{
        font-size:12px;
        line-height:1.25;
    }

    .whatsapp-product-feature span{
        margin-top:4px;
        font-size:9.5px;
        line-height:1.4;
    }

    .whatsapp-product-actions{
        max-width:340px;
        margin:22px auto 0;
        gap:13px;
    }

    .whatsapp-product-primary{
        min-height:50px;
        border-radius:15px;
    }

    .whatsapp-product-proof{
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        max-width:340px;
        margin:16px auto 0;
        gap:8px;
        text-align:left;
        font-size:9.5px;
    }

    .whatsapp-product-proof span{
        align-items:flex-start;
    }

    .whatsapp-product-visual{
        min-height:clamp(330px,105vw,400px);
    }

    .whatsapp-product-visual > img{
        width:88%;
        max-width:320px;
    }

    .whatsapp-product-glow{
        width:100%;
        height:88%;
        filter:blur(24px);
    }
}

@media(max-width:360px){
    .whatsapp-product-features{
        grid-template-columns:1fr;
        max-width:300px;
    }

    .whatsapp-product-feature{
        min-height:0;
    }
}