/* A continuous brand ribbon with steady original colors and no glow. */
.brands-showcase { padding:48px 0 54px; background:#fff; }
.brands-layout { display:block; }
.brands-overview { text-align:center; margin:0 auto 26px; }
.brands-overview h2 { margin:0 0 12px; color:#202724; font-size:42px; line-height:1.15; font-weight:700; letter-spacing:-.02em; }
.brands-overview p { margin:0 auto; max-width:60ch; color:#66716c; font-size:18px; line-height:1.6; }
.brands-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; max-width:100%; padding:11px 26px; border:1px solid #007d91; border-radius:0; background:#007d91; color:#fff; font-size:16px; line-height:1.5; font-weight:600; text-align:center; transition:background-color .25s,border-color .25s; }
.brands-button:hover { background:#006679; border-color:#006679; color:#fff; }
.brands-showcase .logo-marquee { min-width:0; background:none; border-radius:0; }
.brands-showcase .logo-marquee-window { border:0; background:#fff; mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 2%,#000 98%,transparent); }
/* Two identical groups move by exactly one group for a seamless loop. */
.brands-showcase .logo-marquee-track { width:max-content; animation:brand-drift 52s linear infinite; }
.brands-showcase .logo-marquee-group { width:auto; justify-content:flex-start; }
.brands-showcase .logo-link { flex:0 0 clamp(220px,25vw,330px); width:clamp(220px,25vw,330px); height:200px; padding:28px 20px 38px; flex-direction:column; justify-content:flex-start; background:#fff; text-align:center; }
.brands-showcase .logo-link:before { content:none; background:none; }
.brands-showcase .logo-link:after { content:''; position:absolute; top:36px; right:0; height:92px; width:1px; background:#e6ebe8; }
.logo-visual { display:flex; align-items:center; justify-content:center; width:100%; height:64px; flex-shrink:0; margin-bottom:18px; }
.brands-showcase .logo-art { filter:none; opacity:1; transform:none; mix-blend-mode:multiply; transition:none; }
.brands-showcase .logo-art img { width:176px; max-width:100%; max-height:60px; }
.brands-showcase .logo-link-euchips .logo-art { padding:11px 14px; background:#252825; }
.brands-showcase .logo-link-euchips img { width:155px; max-height:42px; }
.brands-showcase .logo-link-done img { width:172px; }
.brands-showcase .logo-link-meanwell img { width:90px; }
.logo-category { display:block; max-width:100%; font-size:17px; font-weight:500; line-height:1.4; color:#4f5c56; }
.brands-showcase .logo-link-hint { bottom:16px; font-size:14px; line-height:1.4; color:#007d91; letter-spacing:0; transition:opacity .3s ease,transform .3s ease; }
.brands-showcase .logo-link:is(:hover,:focus-visible,:active) .logo-art { filter:none; opacity:1; transform:none; }
.brands-showcase .logo-link:is(:hover,:focus-visible,:active) .logo-category { color:#263e35; }
.brands-showcase .logo-marquee-controls { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:20px; padding-top:22px; }
.brands-showcase .brands-button { grid-column:2; }
.brands-showcase .logo-motion-toggle { grid-column:3; justify-self:end; min-height:44px; min-width:76px; padding:8px; gap:8px; font-size:14px; font-weight:500; color:#66716c; }
.brands-showcase .logo-motion-toggle:hover { color:#007d91; }
.brands-showcase .logo-pause-icon { width:7px; height:9px; }
.brands-showcase .logo-motion-toggle[aria-pressed="true"] .logo-pause-icon { width:0; height:0; }
.brands-showcase .logo-marquee.is-keyboard .logo-marquee-window { mask-image:none; -webkit-mask-image:none; }
.brands-showcase .logo-marquee.is-keyboard .logo-marquee-track { animation:none; transform:none; width:max-content; }
.brands-showcase .logo-marquee.is-keyboard .logo-marquee-group { width:auto; }
.brands-showcase .logo-marquee.is-keyboard .logo-link { flex:0 0 260px; width:260px; }
.brands-showcase .logo-marquee[data-paused="true"] .logo-marquee-track { animation-play-state:paused; }
@media(hover:hover) { .brands-showcase .logo-marquee-window:hover .logo-marquee-track { animation-play-state:paused; } }
@media(max-width:850px) {
  .brands-overview h2 { font-size:36px; }
  .brands-overview p { font-size:17px; }
}
@media(max-width:600px) {
  .brands-showcase { padding:42px 0 46px; }
  .brands-overview { margin-bottom:20px; }
  .brands-overview h2 { font-size:32px; }
  .brands-overview p { max-width:32ch; }
  .brands-showcase .logo-link { flex-basis:220px; width:220px; height:186px; padding-inline:18px; }
  .brands-showcase .logo-art img { width:156px; max-height:54px; }
  .brands-showcase .logo-link-euchips img { width:144px; }
  .logo-category { font-size:16px; }
  .brands-showcase .logo-marquee-controls { position:relative; display:flex; justify-content:center; padding-top:16px; }
  .brands-showcase .brands-button { max-width:calc(100% - 96px); padding-inline:20px; }
  .brands-showcase .logo-motion-toggle { position:absolute; top:18px; right:0; min-width:44px; width:44px; height:44px; padding:8px; }
  .brands-showcase .logo-motion-label { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
}
@media(hover:none) { .brands-showcase .logo-art { filter:none; opacity:1; } }
@media(prefers-reduced-motion:reduce) {
  .brands-showcase .logo-marquee-window { mask-image:none; -webkit-mask-image:none; }
  .brands-showcase .logo-marquee-track { animation:none; transform:none; width:max-content; }
  .brands-showcase .logo-marquee-group { width:auto; }
  .brands-showcase .logo-link { flex:0 0 240px; width:240px; }
  .brands-showcase .logo-art { filter:none; opacity:1; }
  .brands-showcase .logo-motion-toggle { display:none; }
  .brands-showcase .logo-marquee-controls { display:flex; justify-content:center; }
  .brands-button { transition:none; }
}

@keyframes brand-drift {
  from { transform:translateX(0); }
  to { transform:translateX(-50%); }
}