/*==================================================
  OUR CERTIFICATIONS
  Namespace : ba-cert-marquee-
==================================================*/

.ba-cert-marquee-section{
    background:#18181b;
    padding:70px 0;
    overflow:hidden;
}

.ba-cert-marquee-wrapper{
    max-width:1320px;
    margin:0 auto;
    padding:0 20px;
}

.ba-cert-marquee-heading{
    text-align:center;
    margin-bottom:50px;
}

.ba-cert-marquee-title{
    margin:0;
    font-family:Inter,sans-serif;
    font-size:clamp(32px,4vw,46px);
    font-weight:700;
    color:#fff;
    letter-spacing:2px;
    text-transform:uppercase;
}

/*=========================
Viewport
==========================*/

.ba-cert-marquee-viewport{

    overflow:hidden;
    width:100%;
    position:relative;

}

/*=========================
Track
==========================*/

.ba-cert-marquee-track{

    display:flex;

    align-items:center;

    gap:24px;

    width:max-content;

    animation:ba-cert-marquee-scroll 28s linear infinite;

    will-change:transform;

}

/* Pause */

.ba-cert-marquee-viewport:hover
.ba-cert-marquee-track{

    animation-play-state:paused;

}

/*=========================
Cards
==========================*/

.ba-cert-marquee-card{

    width:220px;

    height:150px;

    flex-shrink:0;

    background:#ffffff;

    border-radius:14px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:24px;

    box-shadow:

    0 10px 30px rgba(0,0,0,.18);

    transition:

    transform .35s,

    box-shadow .35s;

}

.ba-cert-marquee-card:hover{

    transform:

    translateY(-8px);

    box-shadow:

    0 18px 45px rgba(0,0,0,.28);

}

/*=========================
Logo
==========================*/

.ba-cert-marquee-logo{

    width:100%;

    max-width:150px;

    max-height:80px;

    object-fit:contain;

    transition:transform .3s;

}

.ba-cert-marquee-card:hover
.ba-cert-marquee-logo{

    transform:scale(1.08);

}

/*=========================
Infinite Animation
==========================*/

@keyframes ba-cert-marquee-scroll{

    from{

        transform:translate3d(0,0,0);

    }

    to{

        transform:translate3d(-50%,0,0);

    }

}

/*=========================
Responsive
==========================*/

@media(max-width:991px){

.ba-cert-marquee-card{

    width:180px;
    height:130px;

}

}

@media(max-width:768px){

.ba-cert-marquee-card{

    width:160px;
    height:120px;

}

.ba-cert-marquee-track{

    gap:18px;

    animation-duration:22s;

}

}

@media(max-width:480px){

.ba-cert-marquee-card{

    width:135px;
    height:100px;
    padding:16px;

}

.ba-cert-marquee-logo{

    max-width:95px;

}

.ba-cert-marquee-track{

    animation-duration:18s;

}

}
/*==================================================
    Production Upgrade
==================================================*/

/* GPU Rendering */
.ba-cert-marquee-track{
    transform:translate3d(0,0,0);
    backface-visibility:hidden;
    perspective:1000px;
}

/* Smooth Image Rendering */
.ba-cert-marquee-logo{
    display:block;
    image-rendering:auto;
}

/* Optional Speed Classes */

.ba-cert-marquee-track.ba-cert-marquee-speed-slow{
    animation-duration:40s;
}

.ba-cert-marquee-track.ba-cert-marquee-speed-normal{
    animation-duration:28s;
}

.ba-cert-marquee-track.ba-cert-marquee-speed-fast{
    animation-duration:18s;
}

/* Optional Reverse Direction */

.ba-cert-marquee-track.ba-cert-marquee-reverse{

    animation-direction:reverse;

}

/* Accessibility */

@media (prefers-reduced-motion:reduce){

.ba-cert-marquee-track{

animation:none;

}

}