/* ==================================================
   aapolix Dynamic CTA
   Mobile First
================================================== */

.apx-cta-slider{
    position:relative;
    width:100%;
    margin:20px auto;
    padding:20px 15px;
    background:linear-gradient(135deg,#4f46e5 0%, #6d28d9 55%, #7c3aed 100%);
    border:1px solid rgba(255,255,255,.12);
    border-radius:12px;
    overflow:hidden;
    box-sizing:border-box;
    box-shadow:0 12px 32px rgba(79,70,229,.25);
}
.apx-cta-slider::before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at top right,
        rgba(255,255,255,.18),
        transparent 45%);
    pointer-events:none;
}

.apx-slide{
    display:none;
    text-align:center;
    animation:apxFade 1.5s ease-in-out;
}

.apx-slide.active{
    display:block;
}

.apx-small{
    font-size:13px;
    font-weight:600;
    color:var(--apx-bg);
    margin-bottom:8px;
}

.apx-heading{
    margin:0 0 12px;
    font-size:22px;
    line-height:1.4;
    font-weight:700;
   color:var(--apx-bg);
}

.apx-title{
    color:#facc15;
}

.apx-desc{
    margin-bottom:20px;
    font-size:15px;
    line-height:1.6;
    color:var(--apx-bg);
}

.apx-btn{
    display:inline-block;
    padding:12px 22px;
    font-size:15px;
    font-weight:600;
    text-decoration:none;

    background:#facc15;
    color:#111827;

    border:2px solid #facc15;
    border-radius:6px;

    transition:all .25s ease;
}

.apx-btn:hover{
    background:#fde047;
    border-color:#fde047;
    color:#111827;
    transform:translateY(-2px);
    box-shadow:0 8px 20px rgba(250,204,21,.35);
}


@keyframes apxFade{

    from{
        opacity:0;
    }

    to{
        opacity:1;
    }

}

/* ===========================
   Tablet
=========================== */

@media (min-width:768px){

    .apx-cta-slider{

        max-width:720px;

        padding:30px;

    }

    .apx-heading{

        

    }

    .apx-desc{

     

    }

}

/* ===========================
   Desktop
=========================== */

@media (min-width:1024px){

    .apx-cta-slider{

        max-width:860px;

        padding:40px;

    }

    .apx-heading{

       font-size:30px;
font-weight: 700;
    }

    .apx-small{

      font-size:16px; 
font-weight: 700;
    }

    .apx-desc{
font-size:16px; 
        

    }

    .apx-btn{

        padding:14px 28px;

    }

}