 /* ========================================
     BACK TO TOP BUTTON
     ======================================== */

  .back-to-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 999;

    display: flex;
    width: 56px;
    height: 56px;
    padding: 0;
    align-items: center;
    justify-content: center;

    color: red;
    background: transparent;
    border: 0;
    border-radius: 8px;
    cursor: pointer;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(12px);

    transition:
      opacity 250ms ease,
      visibility 250ms ease,
      transform 250ms ease,
      color 200ms ease,
      background-color 200ms ease;
  }

  .back-to-top svg {
    display: block;
    width: 56px;
    height: 56px;
  }

  /* Shown after the visitor scrolls down */
  .back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
  }

  .back-to-top:hover {
    fill: red;
    background-color: #C9C6C2;
  }

  .back-to-top:focus-visible {
    outline: 3px solid rgba(29, 29, 29, 0.35);
    outline-offset: 4px;
  }

  /* Mobile positioning */
  @media screen and (max-width: 767px) {
    .back-to-top {
      right: 16px;
      bottom: 16px;
    }
  }

  /* Removes animation for reduced-motion preferences */
  @media (prefers-reduced-motion: reduce) {
    .back-to-top {
      transition: none;
    }
  }

  /* ========================================
   MEMBERSHIP LOGO — HOVER EFFECT
   ======================================== */

.logos-memberships {
  position: relative;
  transition:
    transform 300ms ease,
    box-shadow 300ms ease;
  transform-origin: center;
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  .logos-memberships:hover {
    transform: translateY(-3px) scale(1.015);
    box-shadow: 0 4px 8px rgba(17, 17, 17, 0.12);
  }
}

/* Matches the hover effect when the block is keyboard-focused */
.logos-memberships:focus-visible {
  transform: translateY(-6px) scale(1.025);
  box-shadow: 0 16px 32px rgba(17, 17, 17, 0.12);
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

/* Respects reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
  .logos-memberships {
    transition: box-shadow 200ms ease;
  }

  .logos-memberships:hover,
  .logos-memberships:focus-visible {
    transform: none;
  }
}
