.focus-carousel {
    background: #fff9d5;
      position: relative;
      width: 100vw;
      object-fit: cover;
      max-width: 2500px;
      height: 160vh;
      margin: auto;
      padding: 0;
      overflow: hidden;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .focus-carousel .slide {
      position: absolute;
      width: 30%;
      height: 40%;
      object-fit: cover;
      border-top-left-radius: 20px;
      border-bottom-right-radius: 20px;
      border-radius: 20px;
      transition: all 0.6s ease-in-out;
      opacity: 0;
      transform: scale(0.7);
      box-shadow: grey 0px 15px 20px -5px;
      z-index: 0;
    }

    .focus-carousel .slide.active {
      opacity: 1;
      transform: scale(1) translateY(-20px);
      z-index: 3;
    }

    .focus-carousel .slide.prev {
      opacity: 0.6;
      transform: translateX(-70%) scale(0.8);
      z-index: 2;
    }

    .focus-carousel .slide.next {
      opacity: 0.6;
      transform: translateX(70%) scale(0.8);
      z-index: 2;
    }

    @media (min-width: 768px) and (max-width: 1024px) {
      .focus-carousel {
        height: 60vh;
      }
      .focus-carousel .slide {
        top: 40%;
        width: 40%;
        height: 50%;
      }
    }

    @media (max-width: 768px) {
      .focus-carousel {
        height: 60vh;
      }
      .focus-carousel .slide {
        top: 40%;
        width: 50%;
        height: 50%;
      }
    }


    


.sections-title {
  position: absolute;
  top: 30px;               /* distance from top */
  left: 50%;              /* center horizontally */
  transform: translateX(-50%);
   font-size: clamp(2.5rem, 5vw, 4rem);
    color: #000000;
    margin: 0;           /* visible on dark bg */ /* glow for readability */
  z-index: 4;             /* above images */
}

.sections-subtitle {
  position: absolute;
  top: 110px;               /* distance from top */
  left: 50%;              /* center horizontally */
  transform: translateX(-50%);
  font-size: var(--font-size-xl);
    color: #86868B;
    margin: 0;           /* visible on dark bg */ /* glow for readability */
  z-index: 4;             /* above images */
}


@media (max-width: 768px) {
 .sections-subtitle {
  position: absolute;
  top: 80px;               /* distance from top */
  left: 50%;              /* center horizontally */
  transform: translateX(-50%);
  font-size: var(--font-size-xl);
    color: #86868B;
    margin: 0;           /* visible on dark bg */ /* glow for readability */
  z-index: 4;             /* above images */
}
}