/* Menu icons for Services dropdown (small inline emoji icons) */
.dropdown-menu a .menu-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:8px;
  margin-right:10px;
  font-size:18px;
  background:rgba(67,129,61,.06);
  color:var(--green);
}

/* When header is scrolled, make the nav row background white for clarity */
.site-header.scrolled .nav-row{
  background:#fff;
}

/* Ensure the header container itself is white when scrolled */
.site-header.scrolled{
  background:#fff;
}

/* Override residential and commercial icons with clearer emoji */
.home-icon:before{content:"🏡"}
.building-icon:before{content:"🏢"}

/* Mobile header: maximize logo and remove paddings/margins */
@media (max-width:640px){
  .nav-row{padding:14px 0;position:relative}
  .nav-row .logo-link{margin:0;padding:0;display:flex;align-items:center;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:60}
  .nav-row .logo{width:140px;height:140px;object-fit:contain;}
  .site-header.scrolled .nav-row{padding:12px 0}
  /* Make scrolled (sticky) logo smaller on mobile to prevent overflow */
  .site-header.scrolled .logo{width:75px;height:75px;padding-bottom:10px}
  /* lift scrolled logo up and keep nav above it to avoid overlapping the nav background */
  .site-header.scrolled .logo-link{top:36%;transform:translate(-50%,-36%)}
  .nav-row .main-nav{position:relative;z-index:70}
  /* vertically center top-bar content and phone */
  .top-bar{padding:6px 0}
  .top-bar .top-bar-inner{align-items:center}
  .top-bar .top-contact{display:flex;align-items:center;gap:10px}
  .top-bar .top-contact a[href^="tel:"]{display:inline-flex;align-items:center;justify-content:center}
}

/* Keep client portal pill on one line in mobile */
@media (max-width:640px){
  .client-pill{
    white-space:nowrap;
    padding:6px 8px;
    font-size:14px;
    display:inline-block;
  }
  /* hide email in the top-bar on small screens */
  .top-bar .top-contact a[href^="mailto:"]{display:none!important}
}

/* Mobile phone repositioning: hide topbar phone and show before menu icon */
.mobile-phone{display:none}

@media (max-width:1000px){
  .mobile-phone{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-right:8px;
    font-weight:800;
    color:#fff;
    background:var(--green);
    border-radius:18px;
    padding:8px 12px;
    text-decoration:none;
    box-shadow:0 8px 20px rgba(67,129,61,.18);
    white-space:nowrap;
    font-size:14px;
  }
  .mobile-phone::before{
    content:"📞";
    display:inline-block;
    transform:translateY(1px);
  }
}

/* Mobile menu button: transparent background, primary-colored lines, controlled size */
@media (max-width:1000px){
  .mobile-menu-btn{
    background:transparent !important;
    color:var(--green) !important;
    font-size:20px !important;
    padding:6px !important;
    border-radius:6px !important;
    box-shadow:none !important;
    line-height:1 !important;
  }
  .mobile-menu-btn svg{ width:26px; height:18px; display:block; }
  .mobile-menu-btn:hover,.mobile-menu-btn:focus{background:transparent !important;opacity:0.9}
}
