html, body {
  overflow-x: hidden;
}

header nav ul li.dropdown .dropdown-menu {
    display: none !important;
    
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    border-radius: 6px;
    padding: 0.25rem 0;
    min-width: 140px;
    z-index: 50;
  }

  
  header nav ul li.dropdown.open .dropdown-menu {
    display: flex !important;
    flex-direction: column !important;
  }

  
  header nav ul li.dropdown .dropdown-menu li a {
    display: block !important;
    padding: 0.5rem 1rem !important;
    white-space: nowrap !important;
    color: var(--text) !important;
  }

  

@media (max-width: 768px) {
  .hero,
  .about-hero,
  .industry-hero,
  .services,
  .content-box,
  .box-container,
  .thank-you-container,
  .industry-detail .container {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 2rem 1rem !important;
  }
  
  
  .two-col,
  .offices-grid,
  .gallery-row {
    display: block !important;
  }
  .two-col > *,
  .offices-grid > *,
  .gallery-item {
    width: 100% !important;
    margin-bottom: 1.5rem;
  }
  
  
  .services-grid,
  .process-grid,
  .value-grid,
  .industries-icons,
  .reasons-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
    margin: 0 1rem !important;
  }
  
  
  .service-card,
  .value-card,
  .icon-card,
  .reason-hex,
  .process-step {
    width: 100% !important;
    margin: 0 !important;
  }

 
  .contact-form-wrapper,
  .talk-form,
  .office-form {
    max-width: 400px !important;
    margin: 0 auto !important;
  }

  
  h1, h2, h3 {
    line-height: 1.2;
    margin: 1rem 1rem 0.5rem;
  }
  p, ul {
    margin: 0.5rem 1rem 1rem;
    line-height: 1.5;
  }
}

@media (max-width: 768px) {
  
  
  header {
    display: flex !important;
    flex-direction: column;      
    align-items: center;         
    padding: 0.4rem 1rem;        
  }

  
  header .logo {
    order: 1;
    margin-bottom: 0.3rem;
    margin-right: 3rem;
  }

  
  header nav {
    order: 2;
    display: flex !important;
    width: 100%;
    justify-content: center;
    margin-bottom: 1rem;
  }
  header nav ul {
    display: flex !important;
    flex-direction: row !important;
    gap: 1rem;
    padding: 0;
    margin: 0;
  }
  header nav ul li {
    margin: 0;
  }

  
  .header-ctas {
    order: 3;
    width: 100%;
    text-align: center;
  }
  .header-ctas .btn-quote {
    display: inline-block;
    width: 90%;
    max-width: 300px;
    margin: 0.3rem auto 0;
    padding: 0.4rem 0.8rem;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
  }

  
  body {
    padding-top: calc( /* header height */ 0.4rem + 1rem /* nav */ + 2.5rem /* approx button + margins */ );
  }

  .dropdown-menu li {
  margin: 0;
}

header nav ul li.dropdown 

header nav ul li.dropdown {
  position: relative;   
}


header nav ul li.dropdown .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;            
  left: 0;
  background: #fff;
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  border-radius: 6px;
  padding: 0.25rem 0;
  min-width: 140px;     
  z-index: 50;
}


header nav ul li.dropdown.open .dropdown-menu {
  display: block;
}


header nav ul li.dropdown .dropdown-menu li a {
  display: block;
  padding: 0.5rem 1rem;
  color: var(--text);
  white-space: nowrap;
}

}


@media (max-width: 768px) {
  header {
    padding: 0.2rem 0.8rem !important;    
  }

  
  header .logo {
    align-self: flex-start;               
    margin-bottom: -2.7rem; 
    margin-right: 2rem !important;
                
  }
  header .logo img {
    height: 50px !important;              
    width: auto;
    display: block;
  }

  
  header nav {
    margin: 0 !important;
    padding: 0 !important;
    margin-left: 2rem !important; 
    margin-bottom: 0.5rem !important;
    margin-top: 1rem !important;
  }
  header nav ul {
    margin: 0 !important;
    gap: -1rem;                          
  }
  header nav ul li {
    margin: 0;
  }

  
  .header-ctas .btn-quote {
    margin-top: 0.2rem !important;
    padding: 0.4rem 0.8rem !important;
    font-size: 0.9rem !important;
    box-shadow: none !important; 
    margin-right: 1rem !important;       
  }
}

@media (max-width: 768px) {
  
  header nav ul li.dropdown .dropdown-menu {
    display: none !important;
  }

  
  header nav ul li.dropdown.open .dropdown-menu {
    display: flex !important;
    flex-direction: column;
  }

  
  header nav ul li.dropdown .dropdown-menu li {
    width: 100%;
    margin: 0 !important;
  }
  header nav ul li.dropdown .dropdown-menu li a {
    display: block;
    padding: 0.6rem 1rem;
  }
}

@media (max-width: 768px) {
  
  .hero {
    margin-top: 1.5rem !important;
  }
  
  .hero h1 {
    font-size: 1.8rem !important;
  }
}