/* ============================================================
   OUR STACK
   ============================================================ */
.stack{background:#fff}
.marquee{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee+.marquee{margin-top:40px}
.marquee__track{display:flex;width:max-content;animation:mq 42s linear infinite}
.marquee--rev .marquee__track{animation-direction:reverse}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tech{
  display:flex;align-items:center;gap:14px;padding:0 40px;flex:none;
  border-right:1px solid var(--line);
  transition:transform .35s var(--ease);
}
.tech:hover{transform:translateY(-3px)}
.tech svg{width:30px;height:30px;flex:none}
.tech span{font-size:1.32rem;font-weight:700;letter-spacing:-.02em;white-space:nowrap;color:#11181F}


@media (max-width:760px){
  .tech{padding:0 26px}
  .tech span{font-size:1.1rem}
}
@media (prefers-reduced-motion:reduce){
  .marquee__track{animation:none;transform:none;flex-wrap:wrap;width:100%;justify-content:center}
  .marquee{-webkit-mask-image:none;mask-image:none}
}

/* Server-rendered logos: real images need the sizing the inline SVGs had. */
.tech img{width:30px;height:30px;object-fit:contain;flex:none}
.marquee__track{list-style:none;margin:0;padding:0}