.hero{
    position:relative;

    width:100%;
    min-height:650px;

    display:flex;
    align-items:center;

    padding:145px 0 65px;

    overflow:hidden;

    background:
        linear-gradient(
            135deg,
            #FFFFFF 0%,
            #FAF9FD 48%,
            #F5F3FB 100%
        );
}

.hero::before{
    content:"";

    position:absolute;

    width:46%;
    height:100%;

    right:0;
    top:0;

    background:
        linear-gradient(
            145deg,
            rgba(49,39,130,.035),
            rgba(86,70,190,.075)
        );

    clip-path:
        polygon(
            20% 0,
            100% 0,
            100% 100%,
            0 100%
        );

    pointer-events:none;
}


.hero::after{
    content:"";

    position:absolute;

    width:520px;
    height:520px;

    right:-320px;
    top:-300px;

    border-radius:50%;

    border:
        1px solid rgba(49,39,130,.07);

    box-shadow:
        0 0 0 60px rgba(49,39,130,.014);

    pointer-events:none;
}

.hero-container{
    position:relative;

    z-index:3;

    display:grid;

    grid-template-columns:
        minmax(0,.92fr)
        minmax(500px,1.08fr);

    align-items:center;

    gap:65px;
}

.hero-text{
    position:relative;

    z-index:5;

    max-width:650px;
}

.hero-tag{
    display:flex;
    align-items:center;

    gap:12px;

    width:max-content;

    margin:0 0 21px;

    padding:0;

    background:transparent;

    color:#312782;

    font-size:.72rem;
    font-weight:700;

    letter-spacing:1.7px;

    text-transform:uppercase;
}


.hero-tag::before{
    content:"";

    width:28px;
    height:2px;

    border-radius:20px;

    background:#312782;
}

.hero-text h1{
    max-width:640px;

    margin:0 0 24px;

    color:#222126;

    font-size:4rem;
    font-weight:700;

    line-height:1.06;

    letter-spacing:-2px;
}

.hero-text h1::after{
    content:"";

    display:block;

    width:58px;
    height:3px;

    margin-top:22px;

    border-radius:20px;

    background:
        linear-gradient(
            90deg,
            #312782,
            #6656C7
        );
}

.hero-text p {
    max-width: 590px;
    margin: 0 0 33px;
    color: #706E76;

    font-size: 1.08rem;
    line-height: 1.85;
    text-align: justify;
}
.hero-buttons{
    display:flex;
    align-items:center;

    gap:12px;

    flex-wrap:wrap;
}


.hero .btn-primary,
.hero .btn-secondary{
    min-height:48px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:13px 24px;

    border-radius:13px;

    font-size:.85rem;
    font-weight:700;

    text-decoration:none;

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


.hero .btn-primary{
    background:#312782;

    color:#FFFFFF;

    box-shadow:
        0 11px 25px rgba(49,39,130,.18);
}


.hero .btn-primary:hover{
    transform:translateY(-3px);

    background:#241D66;

    box-shadow:
        0 17px 34px rgba(49,39,130,.24);
}


.hero .btn-secondary{
    background:rgba(255,255,255,.82);

    color:#312782;

    border:
        1px solid rgba(49,39,130,.14);
}


.hero .btn-secondary:hover{
    transform:translateY(-3px);

    background:#FFFFFF;

    border-color:
        rgba(49,39,130,.24);

    box-shadow:
        0 11px 26px rgba(32,27,71,.07);
}

.hero-visual{
    position:relative;

    width:100%;
    height:500px;

    display:flex;
    align-items:center;
    justify-content:center;
}

.hero-decoration{
    position:absolute;

    width:390px;
    height:390px;

    left:50%;
    top:50%;

    transform:
        translate(-50%,-50%)
        rotate(-6deg);

    z-index:1;

    border-radius:
        32px 90px 38px 85px;

    background:
        linear-gradient(
            145deg,
            #312782,
            #5145B5
        );

    box-shadow:
        0 28px 65px rgba(49,39,130,.18);

    pointer-events:none;
}

.hero-decoration::before{
    content:"";

    position:absolute;

    width:250px;
    height:250px;

    right:-70px;
    top:-70px;

    border-radius:50%;

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

    box-shadow:
        0 0 0 45px rgba(255,255,255,.025);
}

.hero-decoration-line{
    position:absolute;

    width:260px;
    height:120px;

    left:65px;
    top:135px;

    border-top:
        1px dashed rgba(255,255,255,.22);

    border-radius:50%;

    transform:rotate(-5deg);
}

.hero-decoration-dot{
    position:absolute;

    width:7px;
    height:7px;

    border-radius:50%;

    background:#FFFFFF;

    box-shadow:
        0 0 0 5px rgba(255,255,255,.08);
}


.hero-decoration .dot-1{
    left:57px;
    top:130px;
}


.hero-decoration .dot-2{
    right:54px;
    bottom:125px;
}

.hero-card{
    position:absolute;

    overflow:hidden;

    background:#FFFFFF;

    border:
        1px solid rgba(49,39,130,.07);

    border-radius:22px;

    box-shadow:
        0 20px 48px rgba(24,18,71,.15);

    z-index:4;

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

.hero-card.principal{
    width:270px;

    top:12px;
    left:20px;

    transform:rotate(-2deg);
}

.hero-card.secundaria{
    width:270px;

    right:5px;
    bottom:5px;

    transform:rotate(2deg);

    z-index:5;
}

.hero-card-image{
    position:relative;

    width:100%;
    height:175px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:15px;

    overflow:hidden;

    background:
        linear-gradient(
            145deg,
            #FBFAFE,
            #F0EDF8
        );
}


.hero-card-image::before{
    content:"";

    position:absolute;

    width:140px;
    height:140px;

    left:50%;
    top:50%;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.95),
            transparent 68%
        );
}


.hero-card-image img{
    position:relative;

    z-index:2;

    display:block;

    width:100%;
    height:100%;

    object-fit:contain;

    filter:
        drop-shadow(
            0 9px 14px rgba(32,27,71,.08)
        );

    transition:
        transform .45s ease;
}

.hero-card-body{
    padding:19px 20px 21px;
}


.card-number{
    display:block;

    width:auto;
    height:auto;

    margin:0 0 7px;

    padding:0;

    border-radius:0;

    background:transparent;

    color:rgba(49,39,130,.42);

    font-size:.63rem;
    font-weight:800;

    letter-spacing:1.3px;
}


.hero-card h3{
    margin:0;

    color:#222126;

    font-size:1.15rem;
    font-weight:700;
}


.hero-line{
    width:30px;
    height:3px;

    margin:10px 0 12px;

    border-radius:20px;

    background:#312782;

    transition:width .35s ease;
}


.hero-card p {
    margin: 0;
    color: #706E76;

    font-size: .93rem;
    line-height: 1.65;

    text-align: left;
}

.hero-card.principal:hover{
    transform:
        translateY(-6px)
        rotate(-1deg);

    box-shadow:
        0 27px 58px rgba(24,18,71,.19);
}


.hero-card.secundaria:hover{
    transform:
        translateY(-6px)
        rotate(1deg);

    box-shadow:
        0 27px 58px rgba(24,18,71,.19);
}


.hero-card:hover .hero-card-image img{
    transform:scale(1.04);
}


.hero-card:hover .hero-line{
    width:47px;
}

.scroll-down{
    position:absolute;

    left:50%;
    bottom:18px;

    transform:translateX(-50%);

    display:flex;
    flex-direction:column;

    align-items:center;

    gap:6px;

    color:rgba(49,39,130,.48);

    font-size:.61rem;
    font-weight:700;

    letter-spacing:1px;

    text-transform:uppercase;
}


.scroll-down i{
    font-size:.68rem;

    animation:
        scrollMove 1.8s ease-in-out infinite;
}


@keyframes scrollMove{

    0%,
    100%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(5px);
    }

}

@media(max-width:992px){

    .hero{
        min-height:auto;

        padding:140px 0 75px;
    }


    .hero::before{
        width:100%;

        opacity:.55;
    }


    .hero-container{
        grid-template-columns:1fr;

        gap:50px;
    }


    .hero-text{
        max-width:700px;

        margin:auto;

        text-align:center;
    }


    .hero-tag{
        justify-content:center;

        margin-left:auto;
        margin-right:auto;
    }


    .hero-text h1,
    .hero-text p{
        margin-left:auto;
        margin-right:auto;
    }


    .hero-text h1{
        font-size:3.45rem;
    }


    .hero-text h1::after{
        margin-left:auto;
        margin-right:auto;
    }


    .hero-buttons{
        justify-content:center;
    }


    .hero-visual{
        max-width:620px;

        height:480px;

        margin:auto;
    }


    .scroll-down{
        display:none;
    }

}


.empresa{
    position:relative;

    padding:110px 0;

    overflow:hidden;

    background:#FFFFFF;
}

.empresa .container{
    position:relative;
    z-index:2;

    display:grid;

    grid-template-columns:
        minmax(0,.9fr)
        minmax(0,1.1fr);

    align-items:center;

    gap:100px;
}

.empresa-left{
    position:relative;
}

.empresa .section-tag{
    display:flex;
    align-items:center;

    gap:12px;

    width:max-content;

    margin:0 0 22px;

    padding:0;

    border:0;
    border-radius:0;

    background:transparent;

    color:#312782;

    font-size:.72rem;
    font-weight:700;

    letter-spacing:1.8px;

    text-transform:uppercase;
}


.empresa .section-tag::before{
    content:"";

    width:30px;
    height:2px;

    flex-shrink:0;

    border-radius:20px;

    background:#312782;
}

.empresa-left h2{
    max-width:540px;

    margin:0;

    color:#222126;

    font-size:2.9rem;
    line-height:1.16;

    letter-spacing:-1.2px;
}

.empresa-left h2::after{
    content:"";

    display:block;

    width:52px;
    height:3px;

    margin-top:28px;

    border-radius:20px;

    background:#312782;
}

.empresa-right{
    position:relative;

    display:flex;
    flex-direction:column;

    align-items:flex-start;

    gap:28px;

    padding-left:48px;
}

.empresa-right::before{
    content:"";

    position:absolute;

    left:0;
    top:5px;

    width:1px;
    height:100%;

    background:
        linear-gradient(
            to bottom,
            rgba(49,39,130,.25),
            rgba(49,39,130,.04)
        );
}

.empresa-right p{
    max-width:620px;

    margin:0;

    color:#706E76;

    font-size:1rem;
    line-height:1.9;
}

.empresa-right .btn-primary{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-height:48px;

    padding:13px 24px;

    border-radius:13px;

    background:#312782;

    color:#FFFFFF;

    font-size:.85rem;
    font-weight:700;

    text-decoration:none;

    box-shadow:
        0 10px 24px rgba(49,39,130,.16);

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


.empresa-right .btn-primary:hover{
    transform:translateY(-3px);

    background:#241D66;

    box-shadow:
        0 16px 32px rgba(49,39,130,.22);
}

.empresa::before{
    content:"";

    position:absolute;

    width:430px;
    height:430px;

    left:-320px;
    top:50%;

    transform:translateY(-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(49,39,130,.04),
            transparent 68%
        );

    pointer-events:none;
}


.empresa::after{
    content:"";

    position:absolute;

    width:320px;
    height:320px;

    right:-250px;
    bottom:-220px;

    border-radius:50%;

    border:
        1px solid rgba(49,39,130,.045);

    pointer-events:none;
}

@media(max-width:992px){

    .empresa{
        padding:90px 0;
    }


    .empresa .container{
        grid-template-columns:1fr;

        max-width:760px;

        gap:42px;
    }


    .empresa-left{
        text-align:center;
    }


    .empresa .section-tag{
        justify-content:center;

        margin-left:auto;
        margin-right:auto;
    }


    .empresa-left h2{
        margin-left:auto;
        margin-right:auto;
    }


    .empresa-left h2::after{
        margin-left:auto;
        margin-right:auto;
    }


    .empresa-right{
        max-width:650px;

        margin:auto;

        align-items:center;

        padding-left:0;

        text-align:center;
    }


    .empresa-right::before{
        display:none;
    }

}

@media(max-width:576px){

    .empresa{
        padding:70px 0;
    }


    .empresa .container{
        width:90%;

        gap:32px;
    }


    .empresa .section-tag{
        margin-bottom:18px;

        font-size:.63rem;

        letter-spacing:1.2px;
    }


    .empresa .section-tag::before{
        width:21px;
    }


    .empresa-left h2{
        font-size:2rem;

        line-height:1.2;

        letter-spacing:-.5px;
    }


    .empresa-left h2::after{
        width:43px;

        margin-top:22px;
    }


    .empresa-right{
        gap:24px;
    }


    .empresa-right p{
        font-size:.89rem;

        line-height:1.8;
    }


    .empresa-right .btn-primary{
        min-height:46px;

        padding:12px 22px;

        font-size:.82rem;
    }

}
@media(max-width:430px){

    .empresa{
        padding:60px 0;
    }


    .empresa-left h2{
        font-size:1.8rem;
    }

}

.home-productos{
    position:relative;

    padding:110px 0;

    overflow:hidden;

    background:#F7F8FC;
}

.home-productos .section-title{
    max-width:760px;

    margin:0 auto 60px;

    text-align:center;
}


.home-productos .section-title span{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:11px;

    width:max-content;

    margin:0 auto 17px;

    color:#312782;

    font-size:.72rem;
    font-weight:700;

    letter-spacing:1.8px;

    text-transform:uppercase;
}


.home-productos .section-title span::before,
.home-productos .section-title span::after{
    content:"";

    width:27px;
    height:1px;

    background:rgba(49,39,130,.40);
}


.home-productos .section-title h2{
    max-width:680px;

    margin:0 auto;

    color:#222126;

    font-size:2.8rem;
    line-height:1.17;

    letter-spacing:-1px;
}

.productos-grid{
    display:flex;
    flex-direction:column;

    gap:28px;
}

.producto-home{
    position:relative;

    min-height:390px;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        minmax(380px,.82fr);

    align-items:stretch;

    gap:0;

    padding:0;

    overflow:hidden;

    border-radius:26px;

    background:#FFFFFF;

    border:
        1px solid rgba(49,39,130,.07);

    box-shadow:
        0 16px 42px rgba(32,27,71,.055);

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


.producto-home:hover{
    transform:translateY(-6px);

    border-color:
        rgba(49,39,130,.13);

    box-shadow:
        0 25px 58px rgba(32,27,71,.10);
}

.producto-info{
    position:relative;

    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;

    padding:55px 60px;
}

.producto-info::before{
    display:block;

    margin-bottom:17px;

    color:#312782;

    font-size:.68rem;
    font-weight:700;

    letter-spacing:1.7px;

    text-transform:uppercase;
}


.producto-home:first-child .producto-info::before{
    content:"PRODUCTO 01";
}


.producto-home:nth-child(2) .producto-info::before{
    content:"PRODUCTO 02";
}

.producto-info > span{
    display:none;
}

.producto-info h3{
    max-width:480px;

    margin:0 0 20px;

    color:#222126;

    font-size:2.15rem;
    line-height:1.2;

    letter-spacing:-.6px;
}


.producto-info h3::after{
    content:"";

    display:block;

    width:42px;
    height:3px;

    margin-top:15px;

    border-radius:20px;

    background:#312782;

    transition:width .35s ease;
}


.producto-home:hover .producto-info h3::after{
    width:62px;
}

.producto-info p{
    max-width:550px;

    margin:0 0 29px;

    color:#706E76;

    font-size:.94rem;
    line-height:1.85;
}

.producto-info .btn-primary{
    min-height:47px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:12px 23px;

    border-radius:12px;

    background:#312782;

    color:#FFFFFF;

    font-size:.83rem;
    font-weight:700;

    text-decoration:none;

    box-shadow:
        0 10px 24px rgba(49,39,130,.16);

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

.producto-info .btn-primary:hover{
    transform:translateY(-3px);

    background:#241D66;

    box-shadow:
        0 16px 32px rgba(49,39,130,.22);
}

.producto-img{
    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    min-height:390px;

    overflow:hidden;

    background:
        linear-gradient(
            145deg,
            #29206E,
            #312782 52%,
            #5145B5
        );
}

.producto-img::before{
    content:"";

    position:absolute;

    width:320px;
    height:320px;

    left:50%;
    top:50%;

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

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(255,255,255,.10),
            transparent 67%
        );

    pointer-events:none;
}

.producto-img::after{
    content:"";

    position:absolute;

    width:270px;
    height:270px;

    left:50%;
    top:50%;

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

    border-radius:50%;

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

    transition:
        transform .5s ease,
        border-color .5s ease;
}

.producto-shape{
    position:relative;

    z-index:3;

    width:auto;
    height:auto;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;

    border-radius:0;

    background:transparent;

    box-shadow:none;

    color:#FFFFFF;

    font-size:2.4rem;
    font-weight:800;

    letter-spacing:5px;

    text-transform:uppercase;

    transition:
        transform .4s ease,
        letter-spacing .4s ease;
}

.producto-shape::after{
    content:"";

    position:absolute;

    left:50%;
    bottom:-20px;

    width:45px;
    height:2px;

    transform:translateX(-50%);

    border-radius:20px;

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

    transition:width .4s ease;
}

.producto-home:hover .producto-shape{
    transform:translateY(-4px);

    letter-spacing:6px;
}


.producto-home:hover .producto-shape::after{
    width:70px;
}


.producto-home:hover .producto-img::after{
    transform:
        translate(-50%,-50%)
        scale(1.05);

    border-color:
        rgba(255,255,255,.14);
}

.producto-home.reverse{
    direction:rtl;
}


.producto-home.reverse > *{
    direction:ltr;
}

.producto-home.reverse .producto-img{
    background:
        linear-gradient(
            145deg,
            #4B3FA9,
            #312782 55%,
            #241D66
        );
}

@media(max-width:992px){

    .home-productos{
        padding:90px 0;
    }


    .home-productos .section-title{
        margin-bottom:48px;
    }


    .home-productos .section-title h2{
        font-size:2.4rem;
    }


    .producto-home,
    .producto-home.reverse{
        grid-template-columns:1fr;

        min-height:auto;

        direction:ltr;
    }


    .producto-info{
        padding:48px;
    }


    .producto-img{
        min-height:280px;

        grid-row:1;
    }


    .producto-shape{
        font-size:2.1rem;
    }

}

@media(max-width:576px){

    .home-productos{
        padding:70px 0;
    }


    .home-productos .container{
        width:90%;
    }


    .home-productos .section-title{
        margin-bottom:36px;
    }


    .home-productos .section-title span{
        margin-bottom:14px;

        font-size:.62rem;

        letter-spacing:1.15px;
    }


    .home-productos .section-title span::before,
    .home-productos .section-title span::after{
        width:18px;
    }


    .home-productos .section-title h2{
        font-size:1.95rem;

        line-height:1.2;
    }


    .productos-grid{
        gap:18px;
    }


    .producto-home{
        border-radius:20px;
    }


    .producto-info{
        padding:32px 27px 35px;
    }


    .producto-info::before{
        margin-bottom:14px;

        font-size:.61rem;

        letter-spacing:1.2px;
    }


    .producto-info h3{
        margin-bottom:18px;

        font-size:1.6rem;
    }


    .producto-info p{
        margin-bottom:25px;

        font-size:.88rem;

        line-height:1.75;
    }


    .producto-img{
        min-height:220px;
    }


    .producto-img::before{
        width:220px;
        height:220px;
    }


    .producto-img::after{
        width:190px;
        height:190px;
    }


    .producto-shape{
        font-size:1.65rem;

        letter-spacing:3px;
    }


    .producto-home:hover{
        transform:none;
    }

}
@media(max-width:430px){

    .home-productos{
        padding:60px 0;
    }


    .home-productos .section-title h2{
        font-size:1.8rem;
    }


    .producto-info{
        padding:28px 23px 31px;
    }


    .producto-img{
        min-height:195px;
    }


    .producto-shape{
        font-size:1.45rem;
    }

}

.beneficios{
    position:relative;

    padding:110px 0;

    overflow:hidden;

    background:#FFFFFF;
}

.beneficios .section-title{
    max-width:720px;

    margin:0 auto 58px;

    text-align:center;
}


.beneficios .section-title span{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:11px;

    width:max-content;

    margin:0 auto 17px;

    color:#312782;

    font-size:.72rem;
    font-weight:700;

    letter-spacing:1.8px;

    text-transform:uppercase;
}


.beneficios .section-title span::before,
.beneficios .section-title span::after{
    content:"";

    width:27px;
    height:1px;

    background:rgba(49,39,130,.40);
}


.beneficios .section-title h2{
    margin:0;

    color:#222126;

    font-size:2.8rem;
    line-height:1.17;

    letter-spacing:-1px;
}

.beneficios-grid{
    position:relative;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    max-width:1250px;

    margin:0 auto;

    border-top:1px solid rgba(49,39,130,.10);
    border-bottom:1px solid rgba(49,39,130,.10);
}

.beneficio{
    position:relative;

    min-height:285px;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;

    padding:38px 34px;

    overflow:hidden;

    background:transparent;

    border:0;
    border-radius:0;

    box-shadow:none;

    text-align:left;

    transition:
        background .35s ease,
        transform .35s ease;
}


.beneficio:not(:last-child){
    border-right:1px solid rgba(49,39,130,.10);
}

.beneficio-numero{
    position:absolute;

    top:28px;
    right:28px;

    color:rgba(49,39,130,.28);

    font-size:.65rem;
    font-weight:800;

    letter-spacing:1px;

    transition:color .35s ease;
}

.beneficio-icono{
    width:56px;
    height:56px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:25px;

    border-radius:16px;

    background:#EEEAFE;

    color:#312782;

    font-size:1.3rem;

    transition:
        transform .35s ease,
        background .35s ease,
        color .35s ease,
        box-shadow .35s ease;
}

.beneficio-linea{
    width:34px;
    height:3px;

    margin-bottom:16px;

    border-radius:20px;

    background:#312782;

    transition:width .35s ease;
}

.beneficio h3{
    margin:0 0 14px;

    color:#222126;

    font-size:1.25rem;
    font-weight:700;
}


.beneficio p{
    max-width:245px;

    margin:0;

    color:#706E76;

    font-size:.89rem;
    line-height:1.75;
}

.beneficio:hover{
    transform:translateY(-5px);

    background:
        linear-gradient(
            180deg,
            rgba(49,39,130,.015),
            rgba(49,39,130,.05)
        );
}


.beneficio:hover .beneficio-icono{
    transform:translateY(-3px);

    background:#312782;

    color:#FFFFFF;

    box-shadow:
        0 11px 25px rgba(49,39,130,.17);
}


.beneficio:hover .beneficio-linea{
    width:52px;
}


.beneficio:hover .beneficio-numero{
    color:#312782;
}
.beneficios::before{
    content:"";

    position:absolute;

    width:450px;
    height:450px;

    right:-330px;
    top:50%;

    transform:translateY(-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(49,39,130,.035),
            transparent 68%
        );

    pointer-events:none;
}
@media(max-width:992px){

    .beneficios{
        padding:90px 0;
    }


    .beneficios .section-title{
        margin-bottom:46px;
    }


    .beneficios .section-title h2{
        font-size:2.4rem;
    }


    .beneficios-grid{
        max-width:760px;

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


    .beneficio{
        min-height:270px;
    }


    .beneficio:nth-child(1),
    .beneficio:nth-child(2){
        border-bottom:1px solid rgba(49,39,130,.10);
    }


    .beneficio:nth-child(2){
        border-right:0;
    }

}
@media(max-width:576px){

    .beneficios{
        padding:70px 0;
    }


    .beneficios .container{
        width:90%;
    }


    .beneficios .section-title{
        margin-bottom:35px;
    }


    .beneficios .section-title span{
        margin-bottom:14px;

        font-size:.62rem;
        letter-spacing:1.15px;
    }


    .beneficios .section-title span::before,
    .beneficios .section-title span::after{
        width:18px;
    }


    .beneficios .section-title h2{
        font-size:1.95rem;
    }


    .beneficios-grid{
        width:100%;

        grid-template-columns:1fr;
    }


    .beneficio{
        min-height:auto;

        padding:28px 8px;

        border-right:0 !important;
        border-bottom:1px solid rgba(49,39,130,.10);
    }


    .beneficio:last-child{
        border-bottom:0;
    }


    .beneficio-icono{
        width:50px;
        height:50px;

        margin-bottom:20px;

        border-radius:14px;

        font-size:1.15rem;
    }


    .beneficio-numero{
        top:30px;
        right:8px;
    }


    .beneficio h3{
        font-size:1.15rem;
    }


    .beneficio p{
        max-width:100%;

        font-size:.87rem;
    }


    .beneficio:hover{
        transform:none;
    }

}

.proceso{
    position:relative;

    padding:110px 0;

    overflow:hidden;

    background:#F7F8FC;
}

.proceso .section-title{
    max-width:760px;

    margin:0 auto 65px;

    text-align:center;
}


.proceso .section-title span{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:11px;

    width:max-content;

    margin:0 auto 17px;

    color:#312782;

    font-size:.72rem;
    font-weight:700;

    letter-spacing:1.8px;

    text-transform:uppercase;
}


.proceso .section-title span::before,
.proceso .section-title span::after{
    content:"";

    width:27px;
    height:1px;

    background:rgba(49,39,130,.40);
}


.proceso .section-title h2{
    max-width:700px;

    margin:0 auto;

    color:#222126;

    font-size:2.8rem;
    line-height:1.17;

    letter-spacing:-1px;
}

.proceso-grid{
    position:relative;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

    max-width:1250px;

    margin:0 auto;
}

.proceso-grid::before{
    content:"";

    position:absolute;

    top:37px;

    left:9%;
    right:9%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(49,39,130,.08),
            rgba(49,39,130,.30),
            rgba(49,39,130,.08)
        );

    z-index:0;
}

.paso{
    position:relative;

    z-index:2;

    padding:0 18px 20px;

    text-align:left;

    transition:transform .35s ease;
}


.paso:hover{
    transform:translateY(-5px);
}

.paso-top{
    position:relative;

    height:74px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    margin-bottom:27px;
}

.paso-numero{
    width:74px;
    height:74px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

    border-radius:20px;

    background:#312782;

    color:#FFFFFF;

    font-size:1rem;
    font-weight:800;

    box-shadow:
        0 12px 28px rgba(49,39,130,.18);

    transition:
        transform .35s ease,
        border-radius .35s ease,
        background .35s ease;
}

.paso-top i{
    width:43px;
    height:43px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:13px;

    background:#FFFFFF;

    border:1px solid rgba(49,39,130,.09);

    color:#312782;

    font-size:1rem;

    box-shadow:
        0 8px 20px rgba(32,27,71,.055);

    transition:
        transform .35s ease,
        background .35s ease,
        color .35s ease;
}

.paso h3{
    margin:0 0 14px;

    color:#222126;

    font-size:1.3rem;
    font-weight:700;
}


.paso h3::after{
    content:"";

    display:block;

    width:32px;
    height:3px;

    margin-top:11px;

    border-radius:20px;

    background:#312782;

    transition:width .35s ease;
}

.paso p{
    max-width:245px;

    margin:0;

    color:#706E76;

    font-size:.88rem;
    line-height:1.75;
}

.paso:hover .paso-numero{
    transform:translateY(-3px);

    border-radius:50%;

    background:#241D66;
}


.paso:hover .paso-top i{
    transform:translateY(-3px);

    background:#312782;

    color:#FFFFFF;
}


.paso:hover h3::after{
    width:52px;
}
.proceso::before{
    content:"";

    position:absolute;

    width:500px;
    height:500px;

    left:-370px;
    bottom:-350px;

    border-radius:50%;

    border:1px solid rgba(49,39,130,.04);

    box-shadow:
        0 0 0 60px rgba(49,39,130,.01);

    pointer-events:none;
}

@media(max-width:992px){

    .proceso{
        padding:90px 0;
    }


    .proceso .section-title{
        margin-bottom:50px;
    }


    .proceso .section-title h2{
        font-size:2.4rem;
    }


    .proceso-grid{
        max-width:760px;

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

        gap:45px 30px;
    }


    .proceso-grid::before{
        display:none;
    }


    .paso{
        padding:0 15px 20px;
    }

}

@media(max-width:576px){

    .proceso{
        padding:70px 0;
    }


    .proceso .container{
        width:90%;
    }


    .proceso .section-title{
        margin-bottom:38px;
    }


    .proceso .section-title span{
        margin-bottom:14px;

        font-size:.62rem;

        letter-spacing:1.15px;
    }


    .proceso .section-title span::before,
    .proceso .section-title span::after{
        width:18px;
    }


    .proceso .section-title h2{
        font-size:1.95rem;

        line-height:1.2;
    }


    .proceso-grid{
        grid-template-columns:1fr;

        gap:0;
    }


    .paso{
        display:grid;

        grid-template-columns:62px 1fr;

        column-gap:18px;

        padding:20px 0;

        border-bottom:
            1px solid rgba(49,39,130,.09);
    }


    .paso:last-child{
        border-bottom:0;
    }


    .paso-top{
        grid-row:1 / 3;

        width:62px;
        height:auto;

        display:block;

        margin:0;
    }


    .paso-numero{
        width:58px;
        height:58px;

        border-radius:16px;

        font-size:.85rem;
    }


    .paso-top i{
        display:none;
    }


    .paso h3{
        margin:2px 0 10px;

        font-size:1.15rem;
    }


    .paso h3::after{
        margin-top:8px;
    }


    .paso p{
        max-width:none;

        font-size:.86rem;

        line-height:1.7;
    }


    .paso:hover{
        transform:none;
    }


    .paso:hover .paso-numero{
        transform:none;

        border-radius:16px;
    }

}
@media(max-width:430px){

    .proceso{
        padding:60px 0;
    }


    .proceso .section-title h2{
        font-size:1.8rem;
    }

}

.cta-home{
    position:relative;

    padding:100px 0;

    overflow:hidden;

    color:#FFFFFF;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(116,99,220,.20),
            transparent 45%
        ),
        linear-gradient(
            120deg,
            #21195F 0%,
            #312782 52%,
            #5044B2 100%
        );
}

.cta-content{
    position:relative;

    z-index:3;

    width:90%;
    max-width:780px;

    margin:0 auto;

    display:flex;
    flex-direction:column;

    align-items:center;

    text-align:center;
}

.cta-content > span{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:11px;

    margin-bottom:20px;

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

    font-size:.68rem;
    font-weight:700;

    letter-spacing:1.8px;

    text-transform:uppercase;
}


.cta-content > span::before,
.cta-content > span::after{
    content:"";

    width:25px;
    height:1px;

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

.cta-content h2{
    max-width:700px;

    margin:0 auto 19px;

    color:#FFFFFF;

    font-size:2.8rem;
    line-height:1.16;

    letter-spacing:-1px;
}

.cta-content p{
    max-width:620px;

    margin:0 auto 31px;

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

    font-size:.95rem;
    line-height:1.8;
}

.cta-home .btn-primary{
    min-height:49px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:13px 27px;

    border-radius:13px;

    background:#FFFFFF;

    color:#312782;

    font-size:.85rem;
    font-weight:700;

    text-decoration:none;

    box-shadow:
        0 12px 28px rgba(18,12,64,.18);

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


.cta-home .btn-primary:hover{
    transform:translateY(-3px);

    background:#F3F1FC;

    box-shadow:
        0 18px 37px rgba(18,12,64,.25);
}

.cta-home::before{
    content:"";

    position:absolute;

    width:550px;
    height:550px;

    left:-420px;
    bottom:-430px;

    border-radius:50%;

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

    box-shadow:
        0 0 0 60px rgba(255,255,255,.012);

    pointer-events:none;
}
.cta-home::after{
    content:"";

    position:absolute;

    width:600px;
    height:600px;

    right:-460px;
    top:-470px;

    border-radius:50%;

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

    box-shadow:
        0 0 0 70px rgba(255,255,255,.01);

    pointer-events:none;
}

@media(max-width:992px){

    .cta-home{
        padding:85px 0;
    }


    .cta-content h2{
        font-size:2.4rem;
    }

}

@media(max-width:576px){

    .cta-home{
        padding:70px 0;
    }


    .cta-content{
        width:90%;
    }


    .cta-content > span{
        margin-bottom:17px;

        font-size:.6rem;

        letter-spacing:1.15px;
    }


    .cta-content > span::before,
    .cta-content > span::after{
        width:17px;
    }


    .cta-content h2{
        margin-bottom:17px;

        font-size:1.95rem;

        line-height:1.2;
    }


    .cta-content p{
        margin-bottom:26px;

        font-size:.87rem;

        line-height:1.75;
    }


    .cta-home .btn-primary{
        min-height:46px;

        padding:12px 23px;

        font-size:.82rem;
    }


    .cta-home::before{
        width:320px;
        height:320px;

        left:-260px;
        bottom:-260px;
    }


    .cta-home::after{
        width:340px;
        height:340px;

        right:-280px;
        top:-280px;
    }

}


@media(max-width:430px){

    .cta-home{
        padding:60px 0;
    }


    .cta-content h2{
        font-size:1.8rem;
    }

}

@media (max-width: 576px){

    .hero{
        display:block !important;

        width:100%;
        min-height:0 !important;
        height:auto !important;

        padding-top:125px;
        padding-bottom:60px;

        overflow:visible !important;
    }

    .hero .hero-container{
        position:relative;

        width:90%;
        height:auto !important;
        min-height:0 !important;

        display:flex !important;
        flex-direction:column;

        gap:38px;

        margin:0 auto;
    }

    .hero .hero-text{
        position:relative;

        width:100%;
        height:auto;

        flex:none;

        text-align:center;
    }

    .hero .hero-visual{
        position:relative !important;

        width:100% !important;

        height:auto !important;
        min-height:0 !important;

        display:flex !important;
        flex-direction:column !important;

        align-items:stretch !important;
        justify-content:flex-start !important;

        gap:16px;

        margin:0 !important;
        padding:0 !important;

        overflow:visible !important;
    }

    .hero .hero-card,
    .hero .hero-card.principal,
    .hero .hero-card.secundaria{
        position:relative !important;

        inset:auto !important;

        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        left:auto !important;

        display:block;

        width:100% !important;

        height:auto !important;
        min-height:0 !important;

        flex:none;

        margin:0 !important;

        transform:none !important;

        animation:none !important;

        overflow:hidden;
    }
    .hero .hero-card-image{
        position:relative;

        width:100%;

        height:170px !important;
        min-height:170px;

        display:flex;

        align-items:center;
        justify-content:center;

        padding:15px;

        overflow:hidden;
    }


    .hero .hero-card-image img{
        display:block;

        width:100%;
        height:100%;

        max-width:250px;
        max-height:140px;

        margin:auto;

        object-fit:contain !important;
        object-position:center !important;
    }

    .hero .hero-card-body{
        position:relative;

        width:100%;

        height:auto !important;
        min-height:0 !important;

        display:block;

        padding:22px 24px 25px;

        text-align:center;
    }


    .hero .card-number{
        display:block;

        margin:0 0 8px;

        text-align:center;
    }


    .hero .hero-card h3{
        margin:0;

        text-align:center;
    }


    .hero .hero-line{
        margin:
            11px auto
            13px;
    }


    .hero .hero-card p{
        margin:0;

        text-align:center;
    }
    .hero .hero-decoration{
        display:none !important;
    }

    .hero .scroll-down{
        display:none !important;
    }

}
@media (max-width: 430px){

    .hero{
        padding-top:115px;
        padding-bottom:55px;
    }


    .hero .hero-container{
        width:88%;

        gap:32px;
    }


    .hero .hero-card-image{
        height:155px !important;
        min-height:155px;
    }


    .hero .hero-card-image img{
        max-width:225px;
        max-height:125px;
    }


    .hero .hero-card-body{
        padding:20px 21px 23px;
    }

}

@media (max-width: 576px){

    .hero{
        overflow-x:hidden !important;
    }

    .hero .hero-container{
        left:auto !important;
        right:auto !important;
        transform:none !important;
    }

    .hero .hero-text{
        width:100% !important;
        max-width:100% !important;

        margin-left:auto !important;
        margin-right:auto !important;

        left:auto !important;
        right:auto !important;

        transform:none !important;

        text-align:center;
    }
    .hero .fade-left,
    .hero .fade-right,
    .hero .fade-up,
    .hero .zoom{
        transform:none !important;
    }

    .hero .hero-text h1{
        width:100%;
        max-width:100%;

        margin-left:auto;
        margin-right:auto;

        font-size:2.5rem;
        line-height:1.12;

        overflow-wrap:break-word;
    }

    .hero .hero-text p{
        width:100%;
        max-width:100%;

        margin-left:auto;
        margin-right:auto;
    }

    .hero .hero-buttons{
        width:100%;
        justify-content:center;
    }
}

@media (max-width:430px){

    .hero .hero-text h1{
        font-size:2.2rem;
    }

}
@media (max-width: 576px) {
    .hero-text p {
        font-size: 0.96rem;
        line-height: 1.75;
        text-align: left;
    }
}
@media (max-width: 576px) {
    .hero-card p {
        font-size: .88rem;
        line-height: 1.6;
        text-align: center;
    }
}