/* Apex Paving — migration overrides (loaded after the Webflow CSS).
   Off-platform fixes: deterministic mobile menu, accessibility landmark, contact-form
   hardening, area-search box, gallery filter, reviews widget polish, mobile layout.
   Brand accent kept on-brand (Apex orange) rather than the dark --color--secondary. */

/* Injected-UI accent darkened from the brand orange #e97d02 so white-on-accent
   and accent-on-white both clear WCAG AA (the brand orange was ~2.8:1). */
:root { --apx-accent: #b35900; }

main { display: block; }

/* Footer section titles shipped as --gold (#a50112) on the #1f1f1f footer = 2.05:1.
   Use the brand orange (~5.2:1) so they're legible while staying on-brand. */
.footer_menu-title { color: #e97d02; }

/* Honeypot — visually removed, kept in the accessibility tree out of the way */
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; opacity: 0; }

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

/* Deterministic hamburger <-> close-X (Webflow toggles .w--open on the button) */
.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; }

/* Service-card + service-area hover affordance */
.service-boxes__title { transition: color .2s ease; }
.service-top:hover .service-boxes__title { color: var(--apx-accent); }
.service-area__text { transition: color .2s ease; }
.service-area__item:hover .service-area__text,
a.service-area__text:hover { color: var(--apx-accent); }

/* iOS: 16px inputs prevent auto-zoom; border-color focus (no box-shadow spread) */
.quote__form-input, .area-search__input { font-size: 16px; }
.quote__form-input:focus { border-color: var(--apx-accent); outline: none; }

/* ALTCHA widget spacing inside the form */
/* The contact form sits on the dark (#1f1f1f) form block, so the ALTCHA widget
   text is white and the widget blends with the form (transparent base, light border). */
altcha-widget.altcha-widget {
  display: block; margin: 0 0 14px; max-width: 280px;
  --altcha-border-width: 1px; --altcha-border-radius: 10px;
  --altcha-color-base: transparent;
  --altcha-color-border: rgba(255, 255, 255, 0.45);
  --altcha-color-border-focus: #ffffff;
  --altcha-color-text: #ffffff;
}

/* ---- Service-areas hub: instant search box ---- */
.area-search { max-width: 560px; margin: 0 auto 2rem; }
.area-search__input {
  width: 100%; box-sizing: border-box; padding: 0.9rem 1.1rem;
  font-size: 1rem; border: 1px solid #d9d9d9; border-radius: 10px; outline: none;
  transition: border-color .2s ease;
}
.area-search__input:focus { border-color: var(--apx-accent); }
.area-search__empty {
  max-width: 520px; margin: 1rem auto 0; padding: 12px 18px; border-radius: 10px;
  background: var(--apx-accent); color: #fff; font-weight: 600; text-align: center; line-height: 1.45;
}
.area-search__empty a, .area-search__phone { color: #fff; font-weight: 800; text-decoration: underline; }
.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; }

/* ---- Area mini-list pagination controls (home / reviews / quote / area pages) ---- */
.area-paginate { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 28px; }
.area-paginate__btn {
  font-family: inherit; cursor: pointer; border: 2px solid var(--apx-accent);
  background: var(--apx-accent); color: #fff; padding: 10px 22px; border-radius: 10px;
  font-weight: 700; font-size: 15px; transition: background .2s ease, color .2s ease;
}
.area-paginate__btn:hover:not(:disabled) { background: transparent; color: var(--apx-accent); }
.area-paginate__btn:disabled { opacity: .4; cursor: default; }
.area-paginate__info {
  font-weight: 700; font-size: 1rem; line-height: 1; letter-spacing: .02em; white-space: nowrap;
  color: #fff; background: var(--color--primary, #01182a); border: 1px solid rgba(255,255,255,.3);
  padding: 11px 18px; border-radius: 999px; text-align: center;
}

/* ---- Gallery service-filter tabs ---- */
.gallery__filter-list { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; max-width: 1000px; margin: 0 auto 2.5rem; }
.gallery__filter-tab {
  font-family: inherit; cursor: pointer; border: 1px solid #d9d9d9; background: #fff;
  color: var(--color--primary, #01182a); padding: 9px 18px; border-radius: 999px;
  font-weight: 600; font-size: 14px; transition: all .2s ease;
}
.gallery__filter-tab:hover { border-color: var(--apx-accent); color: var(--apx-accent); }
.gallery__filter-tab.is-active { background: var(--apx-accent); border-color: var(--apx-accent); color: #fff; }
.project-grid .w-dyn-item[style*="display: none"], .project-grid .w-dyn-item.is-hidden { display: none !important; }

/* ---- Elfsight reviews ---- */
.reviews__grid-code, .reviews__wrap .elfsight-app-82448765-5e2d-4529-8122-fd8774e4e86e { min-height: 480px; }
.carousel-reviews .elfsight-app-82448765-5e2d-4529-8122-fd8774e4e86e { min-height: 0; }
.reviews__wrap .es-load-more-button-container { margin-top: 40px !important; display: flex !important; justify-content: center !important; }
.reviews__wrap .es-load-more-button.es-button-base-container {
  font-family: "Oswald","Open Sans",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;
}
.carousel-reviews__wrap > .button { display: block; width: max-content; max-width: 100%; margin-left: auto; margin-right: auto; }

/* ---- Mobile layout fixes ---- */
@media screen and (max-width: 991px) {
  .location.full-location > .w-layout-blockcontainer.container,
  .location.full-location > .container { display: flex; flex-direction: column; }
  .location.full-location .map-absolute {
    position: relative; width: 100%; margin-left: 0; height: 320px; margin-top: 24px;
    border-radius: 12px; overflow: hidden; order: 2;
  }
  .location.full-location .map-absolute iframe { width: 100%; height: 100%; border: 0; }
  .location.full-location .location__wrap.reverse { grid-template-columns: 1fr; order: 1; }
}