/* ==========================================================================
   logos-marquee.css — infinite horizontal "running row" of platform logos in
   the hero. The track holds TWO identical copies of the logo set and slides by
   -50% (one full copy), so the loop is seamless. Logos are normalised to white
   via a filter so every brand (even black-on-transparent ones) stays visible on
   the dark hero; edges fade out with a mask.
   ========================================================================== */
.x3-logos-strip{
  width:100%;
  max-width:1100px;
  margin:44px auto 0;
  overflow:hidden;
  position:relative;
  z-index:3;
  /* Edge fade WITHOUT CSS mask-image: some Android GPUs (Mali chips, common
     in Huawei/Kirin phones) badly corrupt scroll compositing on pages that
     use mask-image, causing unrelated text to flash/ghost anywhere on the
     page during scroll. Two solid-to-transparent gradient overlays achieve
     the same visual fade with zero mask-image involved. */
}
.x3-logos-strip::before,
.x3-logos-strip::after{
  content:'';
  position:absolute;
  top:0;
  bottom:0;
  width:60px;
  max-width:8%;
  z-index:2;
  pointer-events:none;
}
.x3-logos-strip::before{
  left:0;
  background:linear-gradient(90deg,#101015 0,transparent 100%);
}
.x3-logos-strip::after{
  right:0;
  background:linear-gradient(270deg,#101015 0,transparent 100%);
}
.x3-logos-track{
  display:flex;
  flex-wrap:nowrap;
  align-items:center;
  gap:56px;
  width:max-content;
  will-change:transform;
  /* Movement is driven by JS (see the inline script before </body>) via a
     requestAnimationFrame loop instead of a CSS @keyframes animation — some
     Android WebViews (notably on HMS/Huawei devices) silently fail to start
     CSS keyframe animations loaded from an external stylesheet, and a rAF
     loop sidesteps that entirely. */
}
.x3-logos-track img{
  /* !important: on phones mobile-fix.css sets `.content_wrapper img{height:auto}`
     which would otherwise blow these logos up to their intrinsic size. */
  height:30px !important;
  width:auto !important;
  max-width:none !important;
  flex:0 0 auto;
  opacity:.9;              /* original brand colours, kept as-is */
  transition:opacity .2s ease;
}
.x3-logos-track img:hover{ opacity:1; }
.x3-logos-track img[src*="Onlyfans"]{ height:80px !important; }
@media only screen and (max-width:767px){
  .x3-logos-strip{ margin-top:24px; max-width:100%; }
  .x3-logos-track{ gap:34px; }
  .x3-logos-track img{ height:22px !important; }
}