/* Responsive Fixes for Elevate International Website */

/* Make all images responsive by default */
img {
  max-width: 100%;
  height: auto;
}

/* Fix video responsiveness */
video {
  max-width: 100%;
  height: auto;
}

/* Fix iframe responsiveness (for Google Maps, etc.) */
iframe {
  max-width: 100%;
}

/* Mobile-specific fixes */
@media (max-width: 767px) {
  /* Remove white-space:nowrap on mobile */
  h1, h2, h3, h4, h5, h6 {
    white-space: normal !important;
  }

  /* Make government logos smaller on mobile */
  img[style*="width: 100px"] {
    width: 70px !important;
  }

  /* Ensure proper text wrapping */
  .sec-title {
    word-wrap: break-word;
    overflow-wrap: break-word;
  }

  /* Fix card heights on mobile */
  .service-card,
  [style*="height: 100%"] {
    height: auto !important;
    min-height: 200px;
  }

  /* Make icon containers smaller on mobile */
  [style*="width: 70px; height: 70px;"] {
    width: 50px !important;
    height: 50px !important;
  }

  /* Fix button sizing on mobile */
 .team-item-wrap .team-item{
   margin-bottom: 0;
 }
 .team-item-wrap .team-item.active .team-item-inner{
          margin-bottom: 10px;
 }
 .widget-nav-menu ul li a{
  font-size: 12px;
 }
 .widget-nav-menu ul li{
  padding: 0;
 }
 .widget-nav-menu{
  margin-top: 15px;
 }
 .footer-widget .title{
  margin-top: 10px;
 }
 .h10-testimonial .swiper-pagination-bullet{
  background-color: #fff;
  opacity: 1;
 }

  /* Fix step numbers on mobile */
  [data-step]::before {
    width: 30px !important;
    height: 30px !important;
    font-size: 12px !important;
  }
}

/* Tablet-specific fixes */
@media (min-width: 768px) and (max-width: 991px) {
  /* Adjust spacing for tablets */
  .section-gap {
    padding: 60px 0;
  }

  /* Make columns stack better on tablets */
  .col-md-6 {
    margin-bottom: 30px;
  }
}

/* Fix grid system to ensure proper stacking */
@media (max-width: 575px) {
  [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 15px;
  }
}

/* Fix list styling on mobile */
@media (max-width: 767px) {
  .tick-list li,
  ul[style*="columns"] {
    columns: 1 !important;
    -webkit-columns: 1 !important;
    -moz-columns: 1 !important;
  }
}

/* Ensure proper image aspect ratios */
.about-img img,
.faq-img img,
.cta-img img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Fix overflow issues */
.overflow-hidden {
  overflow: hidden;
}

/* Make tables responsive */
table {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* Fix banner video responsiveness */
.h10-hero-banner-video video {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Fix brand slider images */
.brand-item img {
  max-width: 150px;
  height: auto;
  margin: 0 auto;
}

@media (max-width: 767px) {
  .brand-item img {
    max-width: 100px;
  }
}

/* Fix contact cards stacking */
@media (max-width: 575px) {
  .contact-info-card {
    margin-bottom: 20px;
  }
}

/* Fix blog image cards */
.blog-item img,
.post-item img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* Fix Google Maps iframe */
.map-wrapper iframe {
  width: 100%;
  height: 450px;
}

@media (max-width: 767px) {
  .map-wrapper iframe {
    height: 300px;
  }
}

/* Ensure proper spacing on mobile */
@media (max-width: 767px) {
  .section-gap {
    padding: 40px 0;
  }

  .mb-4 {
    margin-bottom: 20px !important;
  }

  .mt-4 {
    margin-top: 20px !important;
  }
}

/* Fix hero banner on mobile */
@media (max-width: 767px) {
  .banner-title {
    font-size: 28px;
    line-height: 1.3;
  }

  .banner-desc {
    font-size: 14px;
  }
}

/* Fix about section images */
.about-img-area img {
  width: 100%;
  height: auto;
}

/* Fix service cards grid */
@media (max-width: 767px) {
  .col-lg-4.mb-4 {
    flex: 0 0 100%;
    max-width: 100%;
    margin-bottom: 20px;
  }
}

/* Fix CTA section responsiveness */
.tj-cta-section {
  padding: 40px 0;
}

@media (max-width: 767px) {
  .tj-cta-section {
    padding: 30px 0;
  }

  .cta-content h2 {
    font-size: 24px;
  }
}

/* Mobile Hamburger Menu Styling - Global */
@media (max-width: 768px) {
  /* Hamburger menu background - white with black text */
  .hamburger-area,
  .hamburger_wrapper {
    background: #ffffff !important;
  }

  .hamburger_inner {
    background: #ffffff !important;
  }

  /* Hide logo and top section in hamburger menu */
  .hamburger-area .hamburger_top {
    display: none !important;
  }

  .hamburger_logo,
  .hamburger_top .hamburger_logo {
    display: none !important;
  }

  .hamburger-title {
    color: #0c1e21 !important;
  }

  .hamburger-infos .subtitle {
    color: #364e52 !important;
  }

  .hamburger-infos .contact-link {
    color: #0c1e21 !important;
  }

  .mean-nav > ul > li > a {
    color: #0c1e21 !important;
  }

  /* Social media section in hamburger */
  .hamburger-socials {
    background: #ffffff !important;
    border-top: 1px solid #e0e0e0 !important;
  }

  .hamburger-socials .hamburger-title {
    color: #0c1e21 !important;
  }

  .hamburger-socials .social-links a {
    color: #55313d !important;
    background: #f8f8f8 !important;
  }

  .hamburger-socials .social-links svg {
    fill: #55313d !important;
  }

  /* Close button */
  .hamburger_close_btn {
    color: #0c1e21 !important;
  }

  .hamburger_close_btn i {
    color: #0c1e21 !important;
  }

  /* Mobile menu dropdown fix */
  .mobile_menu .mean-nav li {
    position: relative !important;
  }

  .mobile_menu .mean-nav li > ul {
    display: none !important;
    width: 100% !important;
    background: #ffffff !important;
    padding: 10px 15px !important;
    margin: 0 !important;
    list-style: none !important;
  }

  .mobile_menu .mean-nav li.active > ul {
    display: block !important;
  }

  /* Mega menu mobile styling */
  .mobile_menu .mean-nav .mega-menu {
    display: none !important;
    position: static !important;
    transform: none !important;
    box-shadow: none !important;
    background: #ffffff !important;
    padding: 15px !important;
  }

  .mobile_menu .mean-nav li.active > .mega-menu {
    display: block !important;
  }

  .mobile_menu .mean-nav .mega-menu .container-fluid,
  .mobile_menu .mean-nav .mega-menu .row {
    padding: 0 !important;
    margin: 0 !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-wrapper {
    display: block !important;
    flex-direction: column !important;
    padding: 0 !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single {
    width: 100% !important;
    padding: 0 !important;
    margin-bottom: 20px !important;
    border-bottom: 1px solid #e0e0e0 !important;
    padding-bottom: 15px !important;
    background: transparent !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single-inner {
    background: transparent !important;
    padding: 0 !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-title,
  .mobile_menu .mean-nav .mega-menu h6,
  .mobile_menu .mean-nav .mega-menu h6.mega-menu-title,
  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single h6,
  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single-inner h6 {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #0c1e21 !important;
    background: #f8f8f8 !important;
    margin: 0 0 10px 0 !important;
    padding: 10px 15px !important;
    border-left: 4px solid #55313d !important;
    display: block !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-radius: 4px !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-list {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    min-height: 50px !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-list a {
    color: #364e52 !important;
    font-size: 14px !important;
    padding: 10px 15px !important;
    display: block !important;
    text-decoration: none !important;
    border: none !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
    opacity: 1 !important;
    visibility: visible !important;
    line-height: 1.5 !important;
    pointer-events: auto !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 999 !important;
  }

  .mobile_menu .mean-nav .mega-menu .mega-menu-list a:hover,
  .mobile_menu .mean-nav .mega-menu .mega-menu-list a.active {
    color: #55313d !important;
    background: #f8f8f8 !important;
  }

  /* Force all text inside mega-menu to be visible */
  .mobile_menu .mean-nav .mega-menu,
  .mobile_menu .mean-nav .mega-menu * {
    opacity: 1 !important;
    visibility: visible !important;
  }

  .mobile_menu .mean-nav .mega-menu a,
  .mobile_menu .mean-nav .mega-menu .mega-menu-list a,
  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single a {
    color: #364e52 !important;
    font-size: 14px !important;
    display: block !important;
  }

  .mobile_menu .mean-nav .mega-menu h6,
  .mobile_menu .mean-nav .mega-menu .mega-menu-title {
    color: #0c1e21 !important;
    font-size: 15px !important;
    display: block !important;
  }

  /* Ensure container and wrapper are visible */
  .mobile_menu .mean-nav .mega-menu .container-fluid,
  .mobile_menu .mean-nav .mega-menu .row,
  .mobile_menu .mean-nav .mega-menu .mega-menu-wrapper,
  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single,
  .mobile_menu .mean-nav .mega-menu .mega-menu-pages-single-inner,
  .mobile_menu .mean-nav .mega-menu .mega-menu-list {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Regular submenu styling */
  .mobile_menu .mean-nav li > ul li {
    padding: 8px 0 !important;
    border-bottom: 1px solid #e0e0e0 !important;
  }

  .mobile_menu .mean-nav li > ul li:last-child {
    border-bottom: none !important;
  }

  .mobile_menu .mean-nav li > ul li a {
    color: #364e52 !important;
    font-size: 14px !important;
    padding: 5px 0 !important;
    display: block !important;
  }

  .mobile_menu .mean-nav li > ul li a:hover {
    color: #55313d !important;
  }

  .mean-expand,
  .custom-expand {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    width: 46px !important;
    height: 46px !important;
    line-height: 46px !important;
    text-align: center !important;
    cursor: pointer !important;
    font-size: 24px !important;
    font-weight: bold !important;
    background: #f8f8f8 !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 4px !important;
    color: #55313d !important;
  }

  .mean-expand:hover,
  .custom-expand:hover {
    background: #55313d !important;
    color: #ffffff !important;
  }
  /* Parent Section */
.pro-services-section {
  padding: 30px 0 0;
}
.apply-section h3, .premium-residency-section h3, .key-benifits h3, .pro-section-title, .docs-section h3, .factory-ready-section h3, .gro-services-container h3{
  margin-bottom: 20px !important;
}
.process-card-wrapper,.pro-service-card,.updates-card-wrapper,.key-benifits .benefit-card{
  padding: 15px;
}
.key-benifits{
  margin: 0 0 30px 0
}
.cta-banner{
  margin: 20px 0;
}
.challenge-card{
  padding: 15px;
}
}