.swiper-section {
    position: relative;
    width: 100%;
    height: 400px;
    overflow: hidden;
    cursor: pointer;
  }
  .covers {
    position: absolute;
    bottom: 100px;
    left: 100px;
    color: white;
  }

  @layer utilities {
    .content-auto {
      content-visibility: auto;
    }
    .carousel-item-hidden {
      display: none;
    }
    .carousel-item-visible {
      display: block;
      animation: fadeVisibility 0.5s ease-in-out;
    }
    .carousel-dot-active {
      background-color: theme("colors.primary");
    }
    .text-shadow {
      text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    }
  } */

  @keyframes fadeVisibility {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }