/* ==========================================================================
   custom.css — Hill Country Asphalt & Chip Seal
   Post-Webflow-migration additions. Loaded after hill-country-asphalt.css on
   every page. Kept intentionally small: the original Webflow CSS already handles
   most responsive behavior (map stacking, card layouts, nav). These rules only
   add what self-hosting needs.
   ========================================================================== */

/* --- Keep the sticky navbar above background videos / hero overlays on scroll --- */
.navbar { z-index: 1000; }

/* --- Footer menu headings: the brand red (#bf0a30) on the near-black footer is only
   ~2.8:1 (fails WCAG AA). Use white for legibility. (Revert to var(--tertiary) if the
   red accent is preferred over the contrast.) --- */
.footer_menu-title { color: #fff; }

/* --- Mobile nav: deterministic hamburger <-> close toggle.
   Webflow's IX2 normally swaps these icons; if it initializes late, both can show.
   Key off the reliable .w--open class that the core nav toggles. --- */
.navbar__close-icon-wrap { display: none; }
.navbar__menu-button.w--open .navbar__hamburguer-icon { display: none !important; }
.navbar__menu-button.w--open .navbar__close-icon-wrap { display: flex !important; }

/* --- iOS: inputs under 16px trigger an auto-zoom (and horizontal scroll) on focus.
   Only bump on mobile so the desktop design is unchanged. --- */
@media screen and (max-width: 767px) {
  .quote__form-input,
  .w-input,
  .w-select,
  #area-search-input { font-size: 16px; }
}

/* --- Service-card + service-area link hover (subtle brand-color shift) --- */
.service-boxes__title-link { color: inherit; text-decoration: none; transition: color .2s ease; }
.service-boxes__title-link:hover { color: var(--color--secondary); }
.service-area__text { transition: color .2s ease; }
.service-area__text:hover { color: var(--color--secondary); }
.s-area-item h4 { transition: color .2s ease; }
.s-area-item:hover h4 { color: var(--color--secondary); }

/* --- ALTCHA widget: keep it tidy inside the form --- */
altcha-widget { display: block; max-width: 100%; margin: 0 0 14px; }

/* --- Service-areas hub instant filter (city / county search box) --- */
.area-search { max-width: 520px; margin: 0 auto 2rem; }
.area-search__input {
  width: 100%; box-sizing: border-box; padding: 0.85rem 1.1rem;
  font-size: 1rem; border: 1px solid #d9d9d9; border-radius: 8px; outline: none;
  transition: border-color .15s ease;
}
/* border-color (not box-shadow spread) on focus — a spread ring can cause iOS horizontal scroll */
.area-search__input:focus { border-color: var(--color--secondary, #eb7000); }
.area-search__empty { text-align: center; margin-top: 1rem; opacity: .8; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* --- Elfsight "Load More" button on the reviews page: use the site font, not Montserrat --- */
.reviews__wrap .es-load-more-button.es-button-base-container,
.reviews__grid-code .es-load-more-button {
  font-family: "DM Sans", "Arvo", sans-serif !important;
}
