/* Scale fixes for header and hero area */

/* Container width adjustments */
@media (min-width: 1200px) {
  .container {
    max-width: 1400px !important;
  }
}

@media (min-width: 1400px) {
  .container {
    max-width: 1600px !important;
  }
}

/* Navbar improvements */
.navbar {
  padding: 15px 0 !important;
}

.navbar-brand img {
  width: 200px !important;
  height: 40px !important;
  object-fit: contain !important;
}

.top-nav-collapse .navbar-brand img {
  width: 180px !important;
  height: 36px !important;
  object-fit: contain !important;
}

/* Navigation menu spacing */
.navbar-expand-md .navbar-nav .nav-item {
  padding-left: 20px !important;
  padding-right: 5px !important;
}

.navbar-expand-md .navbar-nav .nav-link {
  font-size: 15px !important;
  padding: 8px 5px !important;
}

/* Hero area adjustments */
#hero-area,
.hero-area-bg {
  background-size: cover !important;
  background-position: center center !important;
  min-height: 700px !important;
  padding: 160px 0 100px !important;
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
}

#hero-area .contents .head-title {
  font-size: 48px !important;
  line-height: 65px !important;
  margin-bottom: 20px !important;
}

#hero-area .contents p {
  font-size: 18px !important;
  line-height: 28px !important;
  margin-bottom: 30px !important;
}

#hero-area .contents .header-button .btn {
  font-size: 16px !important;
  padding: 14px 35px !important;
}

/* Mobile intro image sizing */
.intro-img img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto !important;
}

/* Responsive adjustments */
@media (max-width: 1199px) {
  .navbar-expand-md .navbar-nav .nav-item {
    padding-left: 15px !important;
  }

  .navbar-expand-md .navbar-nav .nav-link {
    font-size: 14px !important;
  }

  #hero-area .contents .head-title {
    font-size: 38px !important;
    line-height: 50px !important;
  }
}

@media (max-width: 991px) {
  #hero-area,
  .hero-area-bg {
    min-height: 600px !important;
    padding: 140px 0 80px !important;
  }

  #hero-area .contents .head-title {
    font-size: 32px !important;
    line-height: 42px !important;
  }

  #hero-area .contents p {
    font-size: 16px !important;
    line-height: 26px !important;
  }
}

@media (max-width: 767px) {
  #hero-area,
  .hero-area-bg {
    background-size: cover !important;
    min-height: 500px !important;
    padding: 120px 0 60px !important;
  }

  #hero-area .contents .head-title {
    font-size: 28px !important;
    line-height: 38px !important;
  }

  #hero-area .contents p {
    font-size: 15px !important;
    line-height: 24px !important;
  }

  .navbar-brand img {
    height: 35px !important;
  }
}

/* Full width hero background */
#hero-area {
  background-image: url(../img/hero-area.svg) !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

/* Ensure container stays centered */
#hero-area .container {
  max-width: 1400px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
}

/* About section image spacing */
.about-image-wrapper {
  padding-left: 60px !important;
}

/* Responsive adjustments for about image */
@media (max-width: 991px) {
  .about-image-wrapper {
    padding-left: 30px !important;
    padding-right: 30px !important;
  }
}

@media (max-width: 767px) {
  .about-image-wrapper {
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-top: 30px !important;
  }
}