/* Apex Landscaping — post-migration overrides (loaded after the Webflow stylesheet). */

/* --- Contact form success box: a real green confirmation that replaces the form --- */
.success-message.w-form-done,
.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;
  font-size: 17px;
}
.error-message.w-form-fail,
.w-form-fail { border-radius: 10px; }

/* ALTCHA widget: render as a readable white chip on the dark/green form background.
   (The widget defaults --altcha-color-text to currentColor, which on these forms is a
   light green that's unreadable — pin explicit colors instead.) */
altcha-widget {
  display: block;
  margin: 4px 0 14px;
  max-width: 280px;
  color: #234a1c;
  --altcha-border-width: 1px;
  --altcha-border-radius: 8px;
  --altcha-color-base: #ffffff;
  --altcha-color-text: #234a1c;
  --altcha-color-border: #cdd6cd;
  --altcha-color-border-focus: #006132;
  --altcha-color-error-text: #b3141d;
  --altcha-color-footer-bg: #ffffff;
}
altcha-widget * { color: #234a1c; }

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

/* --- Service-card / area-link hover affordance --- */
.heading-hover,
.home-blogs-title,
.service-list-2-title-wrapper h4,
.location-link-block .w-dyn-item,
.location-link-block div { transition: color .2s ease; }
.services-list-item:hover .heading-hover,
.home-blog-item:hover .home-blogs-title,
.location-link-block:hover div { color: var(--secondary); }
.link-with-icon { transition: opacity .2s ease; }
.link-with-icon:hover { opacity: .8; }

/* Heading-order fix: these card titles were changed from h4 to h3 for correct
   document outline — keep their original h4 sizing so nothing looks different. */
.about-info-cards-wrap h3 { font-size: 28px; margin: 10px 0; }
.service-list-2-title-wrapper h3.heading-hover { font-size: 28px; margin: 10px 0; }

/* --- Area search box (service-area hub) --- */
.area-search { max-width: 520px; margin: 0 auto 2rem; }
.area-search__input {
  width: 100%; box-sizing: border-box; padding: .85rem 1.1rem;
  font-size: 16px; border: 1px solid #cdd6cd; border-radius: 8px;
  outline: none; background: #fff; color: #234a1c;
}
.area-search__input:focus { border-color: #006132; } /* border, not box-shadow (iOS scroll-safe) */
.area-search__input::placeholder { color: #7a887a; }
.area-search__empty { text-align: center; margin-top: 1rem; color: #fff; opacity: .9; }
.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;
}

/* --- Pagination controls (replaces Webflow/Finsweet pagination) --- */
.areas-pagination {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
  align-items: center; margin: 32px auto 0;
}
.areas-page-btn {
  font: inherit; font-weight: 700; font-size: 15px; cursor: pointer;
  min-width: 42px; padding: 9px 12px; border-radius: 8px;
  border: 1px solid #cdd6cd; background: #fff; color: #006132;
  transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.areas-page-btn:hover:not(:disabled) { background: #006132; color: #fff; border-color: #006132; }
.areas-page-btn.is-active { background: #006132; color: #fff; border-color: #006132; }
.areas-page-btn:disabled { opacity: .4; cursor: default; }
.areas-page-dots { padding: 0 4px; color: #cdd6cd; }

/* --- Gallery lightbox thumbnails: consistent tiles --- */
.gallery-list .inner-gallery-image,
.gallery-image img { width: 100%; height: 100%; object-fit: cover; }

/* --- Small-screen safety --- */
@media screen and (max-width: 767px) {
  .areas-page-btn { min-width: 38px; padding: 8px 10px; font-size: 14px; }
  .area-search { margin-bottom: 1.25rem; }
}