.section-photo-highlight {
  height: 1350px;
  background: #0c0c0c;
  color: #f5f5dc;
  padding: 100px 20px;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 1200px) {
  .section-photo-highlight {
    height: 950px;
  }
}

.highlight-container {
  max-width: 1200px;
  margin: auto;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.highlight-text h2 {
  font-size: 48px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 20px;
}

.highlight-text p {
  max-width: 600px;
  font-size: 16px;
  color: #ccc;
  margin-bottom: 20px;
}

.highlight-button {
  background-color: #fff;
  color: #000;
  padding: 10px 20px;
  border-radius: 4px;
  text-decoration: none;
  font-weight: bold;
  transition: 0.3s ease;
}

.highlight-button:hover {
  background-color: #f0e68c;
  color: #000;
}

/* Floating Images */
.highlight-images {
  position: relative;
  margin-top: 50px;
}

.highlight-img {
  position: relative;
  width: 150px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgb(91 67 53 / 50%);
  transition: transform 0.3s;
}

.highlight-img:hover {
  transform: scale(1.05);
}

.img1 { top: 70px; left: -180px; }
.img2 { top: -100px; right: -330px; }
.img3 { top: -400px; width: 300px; }
.img4 { top: -460px; left: -120px; }
.img5 { top: -650px; right: -250px; }

/* Responsive for small screens */
@media (max-width: 768px) {
  .img1 { top: -230px; left: -180px; }
  .img2 { top: -400px; right: -250px; }
  .img3 { top: -700px; width: 220px; }
  .img4 { top: -760px; left: -110px; }
  .img5 { top: -950px; right: -160px; }
}


@media (max-width: 1200px) {
  .img1 { top: 0px;
        width: 110px;
        left: -140px; }
  .img2 { top: -130px;
        right: -210px;
        width: 110px; }
  .img3 { top: -350px;
        width: 180px; }
  .img4 { top: -380px;
        left: -90px;
        width: 130px; }
  .img5 { top: -560px;
        right: -140px;
        width: 130px; }
}

@media (max-width: 992px) {
  .img1 { top: 20px;
        left: -120px;
        width: 100px; }
  .img2 { top: -110px;
        right: -180px;
        width: 100px; }
  .img3 { top: -300px;
        right: 0px;
        width: 165px; }
  .img4 { top: -330px;
        width: 120px;
        left: -90px; }
  .img5 { top: -500px;
        right: -130px;
        width: 120px; }
  }


@media (max-width: 576px) {
  .img1 { top: -35px;;
        left: -109px;
        width: 90px; }
  .img2 { top: -150px;
        right: -150px;
        width: 90px; }
  .img3 { top: -320px;
        right: 0px;
        width: 130px;}
  .img4 { top: -340px;
        width: 90px;
        left: -70px; }
  .img5 { top: -470px;
        right: -100px;
        width: 90px; }
}