/* Container */
.partners-section { padding: 48px 0; overflow-x: hidden; overflow-y: visible; }

/* Carousel viewport */
.partners-carousel {
  position: relative;
  overflow-x: hidden;
  overflow-y: hidden; /* prevent vertical scrolling inside carousel */
  touch-action: pan-x; /* allow only horizontal panning inside carousel */
  overscroll-behavior-y: contain; /* prevent inner vertical scroll chaining */
}

/* Tracks (two identical tracks to allow seamless loop) */
.partners-track {
  display: flex;
  align-items: center;
  gap: var(--logo-gap, 56px);
  will-change: transform;
  backface-visibility: hidden;
  touch-action: pan-x; /* restrict touch gestures to horizontal */
}

/* Duplicate uses same layout */
.partners-track.clone { position: absolute; left: 0; top: 0; }

/* Each logo gets a standardized box to normalize visual size */
.logo-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--logo-box-w, 240px);
  height: var(--logo-box-h, 88px);
  flex: 0 0 auto;
  overflow: visible; /* do not clip scaled images */
  touch-action: pan-x; /* ignore vertical scroll gestures on logo items */
}

/* Images always fit inside their box without distortion */
.logo-item img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
  image-rendering: auto;
  filter: none;
  opacity: 1;
}

/* Optional soft fade on the extreme edges so items don’t “pop in” */
.partners-carousel::before,
.partners-carousel::after {
  content: "";
  position: absolute;
  top: 0; width: 10%; height: 100%;
  pointer-events: none; z-index: 2;
}
.partners-carousel::before {
  left: 0;
  /* Match page background to avoid visible dark overlay */
  background: linear-gradient(to right, rgba(17,17,17,1), rgba(17,17,17,0));
}
.partners-carousel::after {
  right: 0;
  /* Match page background to avoid visible dark overlay */
  background: linear-gradient(to left, rgba(17,17,17,1), rgba(17,17,17,0));
}

/* Debug overlays (only enabled via ?debug=logos) */
.logo-debug-overlay {
  position: absolute;
  pointer-events: none;
  border: 1px dashed rgba(0, 255, 180, 0.8);
  background: rgba(0, 255, 180, 0.15);
}

.logo-debug-scale {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -1.1rem;
  font-size: 0.7rem;
  color: #9be7d7;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

/* Responsive */
@media (max-width: 768px) {
  .logo-item {
    width: 180px;
    height: 72px;
  }
  .partners-track { gap: 40px; }
}

/* Per-logo visual scale corrections: ONLY these two */
img[src$="/jji_lely.png"],
img[data-logo="jji_lely.png"] {
  transform: scale(4) !important;
  transform-origin: center;
}

img[src$="/nova-college12.png"],
img[data-logo="nova-college12.png"] {
  transform: scale(4) !important;
  transform-origin: center;
}

img[src$="/orionrounded.png"],
img[data-logo="orionrounded.png"] {
  transform: scale(2) !important; /* 2x larger as requested */
  transform-origin: center;
  max-height: 100%;
  height: auto;
  width: auto;
  object-fit: contain;
}

/* Support alternate filename variant if used */
img[src$="/orion-college.png"],
img[data-logo="orion-college.png"] {
  transform: scale(2) !important; /* 2x larger as requested */
  transform-origin: center;
  max-height: 100%;
  height: auto;
  width: auto;
  object-fit: contain;
}

/* Double only the FunX logo */
.partner-logo--funx {
  transform: scale(2) !important; /* 2x larger as requested */
  transform-origin: center;
  max-height: 100%;
  height: auto;
  width: auto;
  object-fit: contain;
}

/* Ensure transforms do not affect spacing box in the flex row */
.partners-carousel .logo-item {
  overflow: visible;
}