*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Segoe UI',sans-serif;
}

body{
    background:#050505;
    color:white;
    overflow-x:hidden;
}

.background-glow{
    position:fixed;
    width:900px;
    height:900px;

    background:radial-gradient(
        circle,
        rgba(168,85,247,.18),
        transparent 70%
    );

    top:-350px;
    right:-250px;

    pointer-events:none;
    z-index:-1;
}

/* HERO */

.hero{
    max-width:1400px;

    margin:auto;

    padding:100px 50px;

    display:grid;

    grid-template-columns:1fr 1fr;

    align-items:center;

    gap:80px;
}

.plan-number{
    display:inline-flex;

    width:65px;
    height:65px;

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

    border-radius:16px;

    background:#0f0f0f;

    border:1px solid rgba(168,85,247,.4);

    font-weight:bold;

    font-size:1.2rem;

    margin-bottom:35px;
}

.hero-left h1{
    font-size:6rem;

    margin-bottom:15px;

    line-height:1;

    text-shadow:
    0 0 20px rgba(168,85,247,.5);
}

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

    color:#a855f7;

    margin-bottom:25px;

    line-height:1.3;
}

.hero-left p{
    color:#cfcfcf;

    font-size:1.1rem;

    line-height:1.9;

    max-width:650px;

    margin-bottom:35px;
}

.hero-buttons{
    display:flex;
    gap:15px;
    flex-wrap:wrap;
}

.hero-tag{
    padding:14px 20px;

    border-radius:14px;

    background:#111;

    border:1px solid rgba(168,85,247,.25);

    font-weight:600;
}

.hero-right{
    display:flex;
    justify-content:center;
}

.hero-right img{
    width:100%;
    max-width:600px;

    animation:float 5s ease-in-out infinite;

    filter:
    drop-shadow(0 0 20px rgba(168,85,247,.4))
    drop-shadow(0 0 60px rgba(168,85,247,.25));
}

@keyframes float{

    0%{
        transform:translateY(0px);
    }

    50%{
        transform:translateY(-15px);
    }

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

}

/* TITULO */

.section-title{
    text-align:center;

    margin-bottom:60px;
}

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

.section-title span{
    color:#a855f7;
}

/* CARDS */

.cards-grid{
    max-width:1400px;

    margin:auto;

    padding:0 40px 80px;

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(320px,1fr));

    gap:25px;
}

.service-card{
    background:#0d0d0d;

    border:1px solid rgba(168,85,247,.15);

    border-radius:24px;

    padding:35px;

    transition:.35s;

    position:relative;
}

.service-card:hover{

    transform:
    translateY(-8px);

    border-color:#a855f7;

    box-shadow:
    0 0 25px rgba(168,85,247,.25);
}

.icon{
    display:block;
    margin-bottom:20px;
}

.icon i{
    font-size:3rem;
    color:#a855f7;

    text-shadow:
    0 0 10px rgba(168,85,247,.5),
    0 0 25px rgba(168,85,247,.4);

    transition:.3s;
}

.service-card:hover .icon i{
    transform:scale(1.15);
}

.service-card h3{
    margin-bottom:15px;

    font-size:1.35rem;
}

.service-card p{
    color:#cfcfcf;

    line-height:1.8;
}

/* BENEFICIOS */

.benefits{
    max-width:1400px;
    margin:auto;
    padding:80px 40px 20px;
}

.benefits h2{
    text-align:center;

    font-size:2.5rem;

    margin-bottom:50px;
}

.benefits span{
    color:#a855f7;
}

.benefits-grid{

    display:grid;

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

    gap:0;

    background:#0d0d0d;

    border:1px solid rgba(168,85,247,.25);

    border-radius:24px;

    overflow:hidden;
}

.benefit{

    display:flex;

    align-items:center;

    gap:20px;

    padding:35px;

    border-right:1px solid rgba(255,255,255,.08);

    transition:.3s;
}

.benefit:last-child{
    border-right:none;
}

.benefit:hover{

    background:rgba(168,85,247,.05);
}

.benefit-icon i{

    font-size:3rem;

    color:#a855f7;

    text-shadow:
    0 0 10px rgba(168,85,247,.5),
    0 0 25px rgba(168,85,247,.3);
}

.benefit-content h3{

    font-size:1.2rem;

    margin-bottom:10px;
}

.benefit-content p{

    color:#bdbdbd;

    line-height:1.6;
}
/* TIMELINE */

.timeline{
    overflow: visible !important;
    max-width:1400px;
    margin:auto;
    padding:20px 40px 80px;
}

.timeline h2{
    text-align:center;

    font-size:2.5rem;

    margin-bottom:50px;
}

.timeline span{
    color:#a855f7;
}

.timeline-grid{
    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(220px,1fr));

    gap:20px;
}

.process-grid{
    overflow: visible !important;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:15px;
    flex-wrap:wrap;
    margin-top:40px;

}

.step{

    width:200px;

    min-height:250px;

    background:#0d0d0d;

    border:1px solid rgba(168,85,247,.25);

    border-radius:20px;

    padding:30px;

    text-align:center;

    transition:.3s;
}

.step:hover{

    transform:translateY(-8px);

    box-shadow:
    0 0 25px rgba(168,85,247,.25);
}

.step-number{

    width:55px;
    height:55px;

    margin:0 auto 25px;

    border-radius:50%;

    background:#8b5cf6;

    display:flex;

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

    font-weight:bold;

    color:white;
}

.step h3{

    margin-bottom:20px;

    font-size:1.4rem;
}

.step p{

    color:#bdbdbd;

    line-height:1.7;
}

.step-arrow{

    font-size:2rem;

    color:#a855f7;

    font-weight:bold;

    text-shadow:
    0 0 10px rgba(168,85,247,.6);
}

/* CTA */

.cta{
    max-width:1400px;

    margin:100px auto;

    padding:0 40px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:30px;

    background:#080808;

    border:1px solid rgba(168,85,247,.25);

    border-radius:30px;

    padding:50px;
}

.cta-left{
    display:flex;
    align-items:center;
    gap:25px;
}

.cta-left img{
    width:90px;
}

.cta-left h2{
    margin-bottom:10px;
}

.cta-left p{
    color:#cfcfcf;
}

.cta button{
    background:#8b5cf6;

    color:white;

    border:none;

    border-radius:14px;

    padding:18px 35px;

    cursor:pointer;

    font-weight:bold;

    transition:.3s;
}

.cta button:hover{
    transform:translateY(-3px);

    box-shadow:
    0 0 25px rgba(168,85,247,.35);
}

/* FOOTER FEATURES */

.footer-features{
    max-width:1400px;

    margin:auto;

    padding:0 40px 80px;

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(250px,1fr));

    gap:20px;
}

.footer-features div{
    background:#111;

    border:1px solid rgba(168,85,247,.15);

    border-radius:18px;

    padding:22px;

    text-align:center;

    font-weight:600;
}

/* RESPONSIVO */

@media(max-width:1000px){

    .hero{
        grid-template-columns:1fr;
        text-align:center;
    }

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

    .hero-left p{
        margin:auto auto 35px;
    }

    .hero-left h1{
        font-size:4rem;
    }

    .cta{
        flex-direction:column;
        text-align:center;
    }

    .cta-left{
        flex-direction:column;
    }
}


.step-icon{

    margin:15px 0 20px;

    text-align:center;
}

.step-icon i{

    font-size:3rem;

    color:#a855f7;

    text-shadow:
    0 0 10px rgba(168,85,247,.5),
    0 0 25px rgba(168,85,247,.4);

    transition:.3s;
}

.step:hover .step-icon i{

    transform:scale(1.15);
}

/* ===== GAPCORE MAX ===== */

.hero h1{
    font-size:6.5rem;

    background:linear-gradient(
    90deg,
    #ffffff,
    #a855f7);

    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
}

.hero h2{
    font-size:2.4rem;
}

.hero-right img{
    max-width:700px;

    filter:
    drop-shadow(0 0 30px rgba(168,85,247,.6))
    drop-shadow(0 0 80px rgba(168,85,247,.4))
    drop-shadow(0 0 150px rgba(168,85,247,.25));
}

.service-card{

    min-height:320px;

    background:
    linear-gradient(
    180deg,
    rgba(168,85,247,.08),
    rgba(168,85,247,.02));

    border:1px solid rgba(168,85,247,.35);
}

.service-card:hover{

    transform:
    translateY(-8px)
    scale(1.02);

    box-shadow:
    0 0 35px rgba(168,85,247,.35);
}

.icon{
    font-size:3.5rem;
}

.benefits-grid{
    grid-template-columns:repeat(4,1fr);
}

.process-grid{
    display:flex;
    justify-content:center;
    align-items:center;

    gap:10px;

    flex-wrap:nowrap;

    overflow-x:auto;

    padding-bottom:15px;
}

.step{
    width:180px;
    min-height:260px;
}

.step h3{

    font-size:1.2rem;

    min-height:55px;

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

    line-height:1.2;
}

.step-arrow{
    font-size:2.5rem;
}


.footer-features div{

    font-weight:700;

    background:
    linear-gradient(
    180deg,
    rgba(168,85,247,.08),
    rgba(168,85,247,.02));
}

.estrategia-card{
    transform: none !important;
}

.btn-zap{
    display:inline-flex;
    align-items:center;
    gap:10px;
    color:white;
    border:none;
    border-radius:14px;
    padding:14px 20px;
    font-weight:600;
    transition:.3s;
}

@media(max-width:768px){

    .hero-left h1{
        font-size:3rem;
        line-height:1;
    }

     .benefits-grid{
        grid-template-columns:1fr;
    }

    .benefit{
        border-right:none !important;
        border-bottom:1px solid rgba(168,85,247,.15);
    }

    .process-grid{
        flex-wrap:wrap;
         padding:0 15px;
    }

    .step-arrow{
        display:none;
    }
 

     .hero-right img{
        filter:none;
    }

}