/* Make hero a positioning context */
.hero-slider-container {
  position: relative;
  height: calc(100vh - 60px);
  margin-top: 60px;
  width: 100vw;
  overflow: hidden;
}

/* Just in case: old text slider is hidden */
.slideshow-text {
  display: none !important;
}

/* Slider layers BELOW the overlay text */
.slideshow,
.slideshow .slider,
.slideshow .slider .item,
.slideshow .slider .item img {
  z-index: 1 !important;
}

/* ✅ NEW TITLE OVERLAY – ALWAYS ON TOP */
.fixed-hero-titles {
  position: absolute;
  bottom: 60px;
  left: 0;
  right: 0;
  z-index: 99999 !important; /* higher than everything */
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 80px;
  pointer-events: none;
  font-family: "Montserrat", sans-serif;
  color: #fff;
}

/* Title blocks */
.fixed-left,
.fixed-right {
  font-size: 32px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  text-shadow: 0 3px 8px rgba(0,0,0,0.9);
}

/* Align each side */
.fixed-left {
  text-align: left;
  flex: 1;
}

.fixed-right {
  text-align: right;
  flex: 1;
}

/* TEMP: background to confirm it's above images – you can remove later */
.fixed-hero-titles {
  background: linear-gradient(to top, rgba(0,0,0,0.5), transparent);
}

/* Mobile */
@media (max-width: 767px) {
  .fixed-hero-titles {
    flex-direction: column;
    align-items: center;
    padding: 0 20px 40px;
    bottom: 40px;
  }

  .fixed-left,
  .fixed-right {
    text-align: center;
    width: 100%;
    font-size: 22px;
    letter-spacing: 1px;
  }
}