/* =========================================================
   PARTNERS SECTION
   File: static/assets/css/partners.css
   ========================================================= */

.partners-section{
    position:relative;
    padding:90px 0 70px;
    background:
        radial-gradient(circle at 15% 20%, rgba(53,93,184,.08), transparent 40%),
        radial-gradient(circle at 85% 80%, rgba(245,163,0,.08), transparent 40%),
        linear-gradient(180deg,#f7f9fd 0%,#ffffff 100%);
    overflow:hidden;
}

/* ---------- Heading ---------- */
.partners-head{
    margin-bottom:50px;
}

.partners-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:6px 18px;
    border-radius:999px;
    background:rgba(53,93,184,.08);
    color:#355db8;
    font-size:13px;
    font-weight:700;
    letter-spacing:1.5px;
    text-transform:uppercase;
    margin-bottom:14px;
}

.partners-title{
    font-size:clamp(28px,3vw,40px);
    font-weight:800;
    color:#183153;
    text-transform:none;
    margin-bottom:12px;
}

.partners-subtitle{
    max-width:620px;
    margin:0 auto;
    color:#6b7689;
    font-size:16px;
    line-height:1.8;
}

.partners-divider{
    width:90px;
    height:4px;
    margin:22px auto 0;
    border-radius:4px;
    background:#e3e8f2;
    overflow:hidden;
}

.partners-divider span{
    display:block;
    width:40%;
    height:100%;
    border-radius:4px;
    background:linear-gradient(90deg,#355db8,#f5a300);
    animation:partnersDivider 2.5s ease-in-out infinite alternate;
}

@keyframes partnersDivider{
    to{ transform:translateX(150%); }
}

/* ---------- Marquee ---------- */
.partners-marquee{
    position:relative;
    padding:20px 0;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
            mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
}

.partners-track{
    display:flex;
    flex-wrap:nowrap !important;
    gap:28px;
    width:max-content;
    animation:partnersScroll 80s linear infinite;
}

.partners-marquee:hover .partners-track{
    animation-play-state:paused;
}

@keyframes partnersScroll{
    from{ transform:translateX(0); }
    to  { transform:translateX(calc(-50% - 14px)); }
}

/* ---------- Card ---------- */
.partner-card{
    position:relative;
    flex:0 0 auto;
    width:220px;
    height:130px;
    padding:22px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    border:1px solid #e9edf5;
    border-radius:18px;
    box-shadow:0 6px 20px rgba(24,49,83,.06);
    transition:transform .4s ease, box-shadow .4s ease, border-color .4s ease;
    overflow:hidden;
}

/* gradient border on hover */
.partner-card::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:18px;
    padding:2px;
    background:linear-gradient(135deg,#355db8,#f5a300);
    -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
            mask-composite:exclude;
    opacity:0;
    transition:opacity .4s ease;
    pointer-events:none;
}

.partner-card img{
    max-width:100%;
    max-height:70px;
    width:auto;
    object-fit:contain;
    filter:grayscale(100%);
    opacity:.65;
    transition:filter .4s ease, opacity .4s ease, transform .4s ease;
}

.partner-card:hover{
    transform:translateY(-8px);
    border-color:transparent;
    box-shadow:0 18px 40px rgba(53,93,184,.18);
}

.partner-card:hover::before{
    opacity:1;
}

.partner-card:hover img{
    filter:grayscale(0);
    opacity:1;
    transform:scale(1.08);
}

/* ---------- Responsive ---------- */
@media (max-width:767px){
    .partners-section{
        padding:60px 0 50px;
    }

    .partners-track{
        gap:16px;
        animation-name:partnersScrollMobile;
        animation-duration:28s;
    }

    .partner-card{
        width:160px;
        height:100px;
        padding:16px;
        border-radius:14px;
    }

    /* no hover on touch devices — show logos in color */
    .partner-card img{
        max-height:52px;
        filter:none;
        opacity:1;
    }
}

@keyframes partnersScrollMobile{
    from{ transform:translateX(0); }
    to  { transform:translateX(calc(-50% - 8px)); }
}

/* ---------- Accessibility: reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
    .partners-marquee{
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }
    .partners-marquee::-webkit-scrollbar{
        display:none;
    }
    .partners-track{
        animation:none;
    }
    .partner-card[aria-hidden="true"]{
        display:none;
    }
    .partners-divider span{
        animation:none;
    }
}