/* Seamless ribbons: only two tracks animate, original assets stay unchanged. */
.brands{position:relative;padding:90px 0 95px;overflow:clip;background:linear-gradient(180deg,#0000,#050d0bcc 35%,#050d0bee 75%,#0000)}
.brands-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:50px;margin-bottom:55px}
.brands-heading h2{font-size:clamp(42px,4.5vw,64px);line-height:1.06;letter-spacing:-.045em}
.brands-heading h2 span{color:#a8b8b5}.brands-heading .eyebrow{margin-bottom:23px;font-size:10px;letter-spacing:1.4px}
.brands-intro{font-size:15px;line-height:1.7;color:#a6aaa9;max-width:310px;padding-bottom:5px}
.brand-ribbons{display:grid;gap:16px}
.brand-window{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;scrollbar-color:#345b4e transparent;border-block:1px solid #b2dfc413;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.brand-window:focus-visible{outline:1px solid #70dcca;outline-offset:-3px}
.brand-track{display:flex;width:max-content}
.brand-group{display:flex;flex-shrink:0;gap:24px;padding:14px 24px 14px 0;margin:0;list-style:none}
.brand-cell{width:210px;min-height:144px;flex-shrink:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:20px 15px;text-align:center;border:1px solid transparent;border-radius:12px;transition:background .4s,border-color .4s;color:#c1d0cb}
.brand-cell:hover{background:#51896e0c;border-color:#80d2b91c}
/* Even an ultrawide viewport stays narrower than one complete logo group. */
@media(min-width:2100px){.brand-cell{width:16vw}}
.client-name{font-size:21px;font-weight:400;letter-spacing:-.035em;line-height:1.25;text-wrap:balance;overflow-wrap:anywhere}
.brand-cell-long .client-name{font-size:17px}
.client-logo{display:block;width:100%;max-width:180px;height:70px;object-fit:contain;filter:brightness(0) invert(1);opacity:.83;transition:opacity .4s}
.brand-cell:hover .client-logo{opacity:1}
.brand-cell-logo .client-name,.brand-cell-logo.brand-cell-long .client-name{font-size:10px;line-height:1.35;letter-spacing:.025em;color:#96aaa2}
.logo-compact .client-logo{max-width:110px;height:58px;margin-block:6px}
.logo-round .client-logo,.logo-square .client-logo{max-width:84px}
.logo-paper .client-logo{max-width:104px;filter:grayscale(1) invert(1);mix-blend-mode:screen}
.client-logo[src$="bmx-tr.png"],.client-logo[src$="blum.svg"]{filter:grayscale(1)}
.client-logo[src$="yorulmaz.png"]{filter:grayscale(1);mix-blend-mode:screen}
.client-logo[src$="fen-bilimleri.png"],.client-logo[src$="fettahoglu.png"]{filter:grayscale(1)}
.client-logo[src$="sushibacks.png"],.client-logo[src$="k9-turk.png"]{filter:grayscale(1) invert(1);mix-blend-mode:screen}
.brands-ready .brand-window{overflow:hidden}
.brands-ready .brand-track{animation:brand-flow var(--cms-ribbon-duration,96s) linear infinite;animation-play-state:paused}
.brands-ready .brand-window:nth-child(2) .brand-track{animation-duration:calc(var(--cms-ribbon-duration,96s) * .9167);animation-direction:reverse;animation-delay:-28s}
.brands-running:not(.brands-paused) .brand-track{animation-play-state:running}
.cms-static-ribbons .brand-track{animation:none!important;transform:none!important}
@media(hover:hover){.brand-ribbons:hover .brand-track{animation-play-state:paused!important}}
.brand-ribbons:focus-within .brand-track{animation-play-state:paused!important}
@keyframes brand-flow{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.brands-bottom{display:flex;align-items:center;flex-wrap:wrap;gap:22px 30px;padding-top:28px}
.brands-caption{color:#8e9f98;font-size:11px;line-height:1.6;max-width:330px}
.brands-controls{display:flex;gap:8px;margin-left:auto}
.brands-controls button{border:1px solid #b2dfc425;border-radius:24px;background:#10251a66;color:#afc9bf;padding:10px 16px;font-size:11px;line-height:1.4;min-height:40px}
.brands-controls button[hidden]{display:none}
.brands-controls button:hover,.brands-controls button[aria-pressed="true"]{border-color:#70dcca88;color:#ddfff0}
.brands-invite{font-size:12px;color:#70dcca;display:inline-flex;gap:12px;align-items:center;padding-block:12px}
.brands-invite span{font-size:19px}
@media(max-width:1000px){.brands-heading{gap:30px}.brands-intro{max-width:270px;font-size:14px}.brands-controls{margin-left:0}}
@media(max-width:700px){
 .brands{padding:50px 0 65px}.brands-heading{display:block;margin-bottom:35px}.brands-heading h2{font-size:43px;line-height:1.07}
 .brands-heading .eyebrow{font-size:8px;letter-spacing:1px;margin-bottom:20px}.brands-intro{max-width:350px;margin-top:25px;font-size:15px}
 .brand-ribbons{gap:10px}.brand-group{gap:16px;padding:10px 16px 10px 0}.brand-cell{width:170px;min-height:126px;padding:18px 13px;gap:14px}
 .client-logo{height:60px;max-width:144px}.client-name{font-size:19px}.brand-cell-logo .client-name,.brand-cell-logo.brand-cell-long .client-name{font-size:9px}
 .logo-compact .client-logo{max-width:92px;height:48px}.logo-round .client-logo,.logo-square .client-logo{max-width:72px}
 .brands-ready .brand-track{animation-duration:calc(var(--cms-ribbon-duration,96s) * 1.1667)}.brands-ready .brand-window:nth-child(2) .brand-track{animation-duration:calc(var(--cms-ribbon-duration,96s) * 1.0729)}
 .brands-bottom{padding-top:24px;gap:18px}.brands-caption{font-size:11px;max-width:320px}.brands-controls{width:100%;gap:8px}.brands-controls button{min-height:44px;padding:10px 14px}
 .footer>div{flex-wrap:wrap;row-gap:12px}
}
@media(max-width:360px){.brands-heading h2{font-size:37px}}
@media(prefers-reduced-motion:reduce){
 .brands *{transition:none!important}.brands .brand-track{animation:none!important;transform:none!important;width:100%}
 .brands .brand-window{overflow:visible!important;mask-image:none;border:0}
 .brands .brand-group{width:var(--page);margin:auto;display:flex;flex-wrap:wrap;justify-content:center;padding:0;gap:12px}
 .brands .brand-cell{width:calc(25% - 12px);border-color:#b2dfc419}.brands .brand-clone,.brands-controls{display:none}
}
@media(prefers-reduced-motion:reduce) and (max-width:700px){.brands .brand-cell{width:calc(50% - 6px)}}
