:root{
    --tp-blue:#0d7cff;
    --tp-navy:#08254f;
    --tp-muted:#66758b;
    --tp-border:#cfe5fa;
}

*{box-sizing:border-box}

html,body{
    margin:0;
    padding:0;
    width:100%;
    overflow-x:hidden;
    background:#fff;
    font-family:Arial,Helvetica,sans-serif;
}

.trusted-partners{
    width:100%;
    padding:42px 20px 55px;
    background:
        radial-gradient(circle at 50% 18%,rgba(13,124,255,.035),transparent 38%),
        linear-gradient(180deg,#fff 0%,#fbfdff 100%);
}

/* Requested typography */
.trusted-title{
    margin:0;
    text-align:center;
    font-size:24px;
    line-height:1.25;
    font-weight:800;
    color:var(--tp-navy);
}

.trusted-title span{
    color:var(--tp-blue);
}

.title-underline{
    width:42px;
    height:3px;
    margin:8px auto;
    border-radius:20px;
    background:var(--tp-blue);
}

.trusted-subtitle{
    margin:0 0 28px;
    text-align:center;
    font-size:20px;
    line-height:1.35;
    font-weight:400;
    color:var(--tp-muted);
}

/* Carousel shell */
.partners-carousel{
    position:relative;
    width:100%;
    max-width:2008px;
    margin:0 auto;
    padding:8px 58px;
    border:1px solid var(--tp-border);
    border-radius:20px;
    background:#fff;
    box-shadow:0 4px 18px rgba(33,116,190,.06);
    overflow:hidden;
}

.partners-viewport{
    width:100%;
    overflow:hidden;
}

.partners-track{
    display:flex;
    width:max-content;
    transform:translate3d(0,0,0);
    transition:none !important;
    will-change:transform;
}

/*
  Logo size reduced approximately 30% from the previous version.
  Desktop: compact 72px-high cards / max 106x42 logo.
  Mobile: 64px-high cards / max 82x36 logo.
*/
.partner-item{
    width:calc((100vw - 136px) / 8);
    max-width:210px;
    min-width:125px;
    height:76px;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:5px 12px;
    border-right:1px solid var(--tp-border);
    background:#fff;
}

.partner-item:last-child{
    border-right:0;
}

.partner-item img{
    display:block;
    width:auto;
    max-width:106px;
    height:42px;
    object-fit:contain;
    object-position:center;
}

/* Navigation arrows */
.partner-arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    z-index:10;
    width:48px;
    height:48px;
    padding:0;
    border:1px solid #d8ebff;
    border-radius:50%;
    background:#fff;
    color:var(--tp-blue);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:35px;
    line-height:1;
    font-weight:300;
    box-shadow:0 2px 10px rgba(13,124,255,.07);
    cursor:pointer;
    transition:background .2s ease,border-color .2s ease,transform .2s ease;
}

.partner-arrow:hover{
    background:#f7fbff;
    border-color:#b9dcff;
}

.partner-arrow:active{
    transform:translateY(-50%) scale(.96);
}

.partner-arrow.left{left:8px}
.partner-arrow.right{right:8px}

.partner-arrow span{
    display:block;
    transform:translateY(-2px);
}

/* Desktop/tablet */
@media (max-width:1199.98px){
    .partner-item{
        width:calc((100vw - 136px) / 6);
        min-width:135px;
    }
}

/* Tablet */
@media (max-width:991.98px){
    .trusted-partners{
        padding:38px 15px 48px;
    }

    .partners-carousel{
        padding-left:54px;
        padding-right:54px;
    }

    .partner-item{
        width:calc((100vw - 124px) / 4);
        min-width:125px;
    }
}

/* Mobile: exactly 2 logos visible */
@media (max-width:575.98px){
    .trusted-partners{
        padding:30px 10px 40px;
    }

    .trusted-title{
        font-size:16px;
    }

    .trusted-subtitle{
        font-size:14px;
        margin-bottom:20px;
    }

    .partners-carousel{
        padding:7px 42px;
        border-radius:17px;
    }

    .partner-item{
        width:50vw;
        min-width:0;
        height:64px;
        padding:4px 7px;
    }

    .partner-item img{
        max-width:82px;
        height:36px;
    }

    .partner-arrow{
        width:38px;
        height:38px;
        font-size:29px;
    }

    .partner-arrow.left{left:4px}
    .partner-arrow.right{right:4px}
}

@media (max-width:360px){
    .partners-carousel{
        padding-left:39px;
        padding-right:39px;
    }

    .partner-item{
        height:60px;
    }

    .partner-item img{
        max-width:76px;
        height:33px;
    }

    .partner-arrow{
        width:35px;
        height:35px;
        font-size:27px;
    }
}

@media (prefers-reduced-motion:reduce){
    .partners-track{transition:none}
}