/* Custom styles for contact page */
.tf-page-title.style-2 {
  /* make the hero taller but responsive */
  min-height: 360px; /* default height for desktop */
  display: flex;
  align-items: center; /* vertically center the heading */
  justify-content: center;
  padding: 40px 0; /* extra spacing on top/bottom */
  background-size: cover;
  background-position: center;
}

/* Increase height for larger screens */
@media (min-width: 992px) {
  .tf-page-title.style-2 {
    min-height: 353px;
    padding: 80px 0;
  }
}

/* Reduce height for small mobile devices */
@media (max-width: 575.98px) {
  .tf-page-title.style-2 {
    min-height: 260px;
    padding: 30px 0;
  }
  .tf-page-title.style-2 .heading {
    font-size: 28px; /* keep text readable on small screens */
  }
}

/* Change the color of the main heading on the hero */
.tf-page-title.style-2 .heading {
  color: #f3f4f6; /* light color, override as needed */
  font-weight: 700;
  text-shadow: 0 2px 6px rgba(0,0,0,0.35); /* help with text legibility on images */
}