/* Hero Section Fixes */

/* 1. Fix logo vertical alignment - center logo in header (both normal and sticky states) */
.header_style_six_nw .header .logo_column,
.fixed-header .header_style_six_nw .header.get_sticky_header .logo_column {
  display: flex;
  align-items: center;
}

.header_style_six_nw .header .header_logo_box,
.fixed-header .header_style_six_nw .header.get_sticky_header .header_logo_box {
  display: flex;
  align-items: center;
  height: 100%;
}

/* 2. Fix menu text visibility on dark backgrounds - add text shadow (only when over hero/slider, not sticky) */
/* This applies to homepage hero - secondary pages handled by secondary-pages.css */
/* Include .dark_color to match theme's specificity and override it */
.slider ~ .header_area .header_style_six_nw .header.dark_color.transparent-bg:not(.get_sticky_header) .header_content_collapse .navigation_menu .navbar_nav > li > a.nav-link,
.header_style_six_nw .header.dark_color.transparent-bg:not(.get_sticky_header) .header_content_collapse .navigation_menu .navbar_nav > li > a.nav-link {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  color: #fff !important;
}

.header_style_six_nw .header:not(.get_sticky_header) .header_content_collapse .navigation_menu .navbar_nav li:hover a.nav-link,
.header_style_six_nw .header:not(.get_sticky_header) .header_content_collapse .navigation_menu .navbar_nav li.active a.nav-link {
  text-shadow: none;
}

/* Sticky header menu text (white background, so dark text) */
.fixed-header .header_style_six_nw .header.get_sticky_header .header_content_collapse .navigation_menu .navbar_nav li a.nav-link {
  color: var(--menu-color) !important;
  text-shadow: none;
}

/* 3. Fix Get In Touch button overflow (both normal and sticky states) */
.header_style_six_nw .header .header_content_collapse .header_right_content ul li.header-button,
.header_style_six_nw .header .header_content_collapse .header_right_content ul li.last,
.fixed-header .header_style_six_nw .header.get_sticky_header .header_content_collapse .header_right_content ul li.header-button,
.fixed-header .header_style_six_nw .header.get_sticky_header .header_content_collapse .header_right_content ul li.last {
  width: auto !important;
  min-width: auto;
  max-width: none;
  margin-right: 15px;
}

.header_style_six_nw .header .header_content_collapse .header_right_content ul li.header-button a,
.header_style_six_nw .header .header_content_collapse .header_right_content ul li.last a,
.fixed-header .header_style_six_nw .header.get_sticky_header .header_content_collapse .header_right_content ul li.header-button a,
.fixed-header .header_style_six_nw .header.get_sticky_header .header_content_collapse .header_right_content ul li.last a {
  white-space: nowrap;
  padding: 8px 20px !important;
  overflow: visible;
}

/* 4. Add dark overlay to slider images for better text visibility */
/* Override style_one's existing ::before overlay with a darker one */
.slider.style_one .slide-item-content::before {
  background: rgba(0, 0, 0, 0.5) !important;
  opacity: 1 !important;
}

/* Add light overlay for slider_version_v4 (designed for dark text) */
/* Use ::after on image-layer to ensure overlay appears above background image */
.slider.slider_version_v4 .slide-item-content .image-layer::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.75) !important;
  z-index: 1;
  pointer-events: none;
}

/* Make paragraph text darker for better readability in slider_version_v4 */
.slider.slider_version_v4 .slide-item-content .slider_content p {
  color: var(--text-color-dark) !important;
}

/* Add overlay for style_four */
.slider.style_four .slide-item-content::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 5;
  pointer-events: none;
}

/* Also add overlay directly on image-layer for style_four */
.slider.style_four .slide-item-content .image-layer::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5) !important;
  z-index: 2;
  pointer-events: none;
}

/* 5. Fix slider image sizing consistency - ensure all images fill height uniformly */
.slider.style_four .slide-item {
  min-height: 900px !important;
}

.slider.style_four .slide-item-content {
  min-height: 900px !important;
}

.slider.style_four .slide-item-content .image-layer {
  min-height: 900px !important;
  background-size: cover !important;
  background-position: center center !important;
}

@media (max-width: 992px) {
  .slider.style_four .slide-item,
  .slider.style_four .slide-item-content,
  .slider.style_four .slide-item-content .image-layer {
    min-height: 600px !important;
  }
}

@media (max-width: 768px) {
  .slider.style_four .slide-item,
  .slider.style_four .slide-item-content,
  .slider.style_four .slide-item-content .image-layer {
    min-height: 500px !important;
  }
}

/* Mobile Menu Logo - Responsive sizing for smaller devices */
.crt_mobile_menu .mobile-menu-logo {
  margin-bottom: 25px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border-color-dark, #e5e5e5);
  text-align: center;
}

.crt_mobile_menu .mobile-menu-logo a {
  display: inline-block;
}

.crt_mobile_menu .mobile-menu-logo img {
  max-width: 173px;
  width: 100%;
  height: auto;
}

@media (max-width: 767px) {
  .crt_mobile_menu .mobile-menu-logo {
    margin-bottom: 30px;
    padding-bottom: 25px;
  }

  .crt_mobile_menu .mobile-menu-logo img {
    max-width: min(138px, 28vw);
  }
}

@media (max-width: 480px) {
  .crt_mobile_menu .mobile-menu-logo {
    margin-bottom: 25px;
    padding-bottom: 20px;
  }

  .crt_mobile_menu .mobile-menu-logo img {
    max-width: min(180px, 42vw);
  }
}

@media (max-width: 360px) {
  .crt_mobile_menu .mobile-menu-logo img {
    max-width: min(104px, 40vw);
  }
}