[x-cloak] { display: none !important; }

html { scroll-behavior: smooth; }

.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

::selection { background: #c8102e; color: #fff; }

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ---- Partner marquee ---- */

.marquee {
  position: relative;
  width: 100%;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%);
}

.marquee-track {
  display: flex;
  width: max-content;
  gap: 4rem;
  align-items: center;
  animation: wpsb-marquee 32s linear infinite;
  will-change: transform;
}

.marquee:hover .marquee-track,
.marquee:focus-within .marquee-track {
  animation-play-state: paused;
}

.marquee-item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1rem;
  width: 160px;
  height: 64px;
}

.marquee-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(100%);
  opacity: 0.55;
  transition: filter 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

.marquee-item img:hover {
  filter: grayscale(0%);
  opacity: 1;
  transform: scale(1.08);
}

@keyframes wpsb-marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(calc(-50% - 2rem)); }
}

@media (prefers-reduced-motion: reduce) {
  .marquee-track {
    animation: none;
  }
  .marquee {
    overflow-x: auto;
  }
}