/* ============================================================
       05. LOGOS (SWIPER)
    ============================================================ */
.logos {
  padding-block: var(--sp-lg);
  border-top: 1px solid rgba(116, 54, 187, 0.25);
  border-bottom: 1px solid rgba(116, 54, 187, 0.25);
  overflow: hidden;
}

.logos__label {
  text-align: center;
  font-family: "Barlow", sans-serif;
  font-size: var(--fs-sm);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--global-palette11);
  margin-bottom: 2rem;
}

.logos .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.55;
  filter: grayscale(1) brightness(1.5);
  transition:
    opacity var(--transition),
    filter var(--transition);
}

.logos .swiper-slide:hover {
  opacity: 1;
  filter: none;
}

.logos__logo {
  font-family: var(--global-heading-font-family);
  font-weight: 800;
  font-size: 1.1rem;
  color: var(--global-palette3);
  letter-spacing: 0.05em;
  padding: 12px 24px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: var(--radius-sm);
  white-space: nowrap;
}