/* Howdy Holiday Lights — post-migration overrides (self-hosted on Cloudflare Pages).
   Everything here is additive to the Webflow export CSS. */

/* ---- Honeypot: visually hidden but present for bots ---- */
.hp-field {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ---- ALTCHA widget: pin an explicit light theme so the "I'm not a robot"
   label stays legible on dark hero/quote forms (it defaults to currentColor). ---- */
altcha-widget {
  display: block;
  margin: 0 0 16px;
  max-width: 300px;
  --altcha-color-base: #ffffff;
  --altcha-color-text: #1a1a1a;
  --altcha-color-border: #cbd2d9;
  --altcha-color-border-focus: #c1121f;
  --altcha-color-active: #c1121f;
  --altcha-color-error-text: #b42318;
  --altcha-color-footer-bg: #f4f6f8;
  --altcha-border-radius: 10px;
}
altcha-widget, .form-book altcha-widget { color: #1a1a1a; }

/* ---- Form success box: a real green confirmation (Webflow default is washed out) ---- */
.w-form-done {
  display: none;
  background: #e7f7ec;
  border: 1.5px solid #1a7f37;
  color: #0f5132;
  border-radius: 12px;
  padding: 24px 22px;
  text-align: center;
  font-weight: 600;
}

/* ---- Footer location names: re-leveled h6 -> h3 for valid heading order (a11y).
   .text-white is color-only, so restore the exact original h6 metrics (20px/24px) so
   the footer looks identical. ---- */
.footer-links-large-wrapper h3.text-white {
  font-size: 20px;
  line-height: 24px;
}

/* ---- Navbar above hero videos / overlays on scroll ---- */
.navbar, .w-nav, .navbar-absolute { z-index: 1000; }

/* ---- Navbar goes solid dark once scrolled (matches the live IX2 behavior),
   handled by a robust scroll listener so it never depends on Webflow interactions ---- */
.navbar-absolute { transition: background-color .3s ease; }
.navbar-absolute.nav-solid { background-color: rgba(7, 13, 0, 0.96) !important; }

/* ---- Deterministic mobile hamburger <-> close-X (don't rely on IX2 timing) ---- */
.menu-button.w--open .hamburger-icon,
.menu-button.w--open .menu-icon { display: none !important; }
.menu-button.w--open .close-icon-wrap,
.menu-button.w--open .close-icon { display: flex !important; }
.close-icon-wrap, .close-icon { display: none; }

/* ---- Service / area card hover ---- */
.service-boxes__title-link, .link-service, .card-service a {
  transition: color .2s ease;
}

/* ---- Elfsight "Load More" button styling (ships with padding:0, wrong font) ---- */
.es-load-more-button-container {
  margin-top: 32px !important;
  display: flex !important;
  justify-content: center !important;
}
.es-load-more-button.es-button-base-container {
  font-family: "Bricolage Grotesque", "Inter", sans-serif !important;
  padding: 14px 30px !important;
  min-height: 0 !important;
  height: auto !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  font-size: 16px !important;
}

/* ---- iOS: inputs must be >=16px to prevent auto-zoom / horizontal scroll ---- */
@media screen and (max-width: 767px) {
  .contact-input, .w-input, .w-select, input[type="text"], input[type="email"], input[type="tel"] {
    font-size: 16px;
  }
}

/* ---- Map section: stack info above map on mobile (absolute map disappears otherwise) ---- */
@media screen and (max-width: 991px) {
  .map-absolute {
    position: relative !important;
    width: 100% !important;
    height: 320px;
    margin-left: 0;
    margin-top: 24px;
    border-radius: 12px;
    overflow: hidden;
  }
  .map-absolute iframe { width: 100%; height: 100%; border: 0; }
}