/* Homepage/hero image WebP overrides (originals kept as rollback). */
.slide-1 {
  background-image: url('/img/houseGirl.webp');
}
.slide-2 {
  background-image: url('/img/banner-kitchen2.webp');
}
.slide-3 {
  background-image: url('/img/banner-baby.webp');
}
.section.with-image-5 {
  background-image: linear-gradient(90deg, rgba(89, 39, 70, .9), rgba(89, 39, 70, .14)), linear-gradient(180deg, rgba(89, 39, 70, .7), rgba(89, 39, 70, .7)), url('/img/promo.webp');
}

/* Service icons as WebP <img> instead of CSS backgrounds */
.service-icon {
  background-image: none;
}
.service-icon img {
  display: block;
  width: 90px;
  height: 90px;
  margin: 0 auto;
}

/* ===== UX fixes 2026-11-10 (rollback: restore this file + templates) ===== */

/* 1. Mobile header: keep the phone link above the logo image */
.navigation-style-5 .phonehead {
  position: relative;
  z-index: 30;
}
.navigation-style-5 .brand-logo {
  position: relative;
  z-index: 10;
}
@media (max-width: 479px) {
  .navigation-style-5 .phonehead a {
    display: inline-block;
    position: relative;
    z-index: 30;
    padding: 6px 8px;
    min-height: 32px;
    line-height: 1.2;
  }
}

/* 2. /services intro: don't pull the lead-in over the burgundy page background */
.container-services.services-overview {
  top: auto;
  margin-top: 0;
  padding-top: 16px;
  padding-bottom: 20px;
}
.container-services.services-overview > p.align-center {
  background-color: #fff;
  color: #121212;
  padding: 16px 20px 24px;
  margin: 0 auto 8px;
  max-width: 100%;
}

/* 3. Contrast: keep the brand gold, use burgundy text + icons so AA passes.
      Hover keeps the existing dark fill with white text/icons. */
.button-icon {
  color: #592746;
  background-image: none;
}
.button-icon::before {
  content: "";
  display: block;
  position: absolute;
  left: 17px;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  background-color: currentColor;
  -webkit-mask: url('/img/font-awesome_4-7-0_phone_100_0_ffffff_none.png') center / 16px no-repeat;
  mask: url('/img/font-awesome_4-7-0_phone_100_0_ffffff_none.png') center / 16px no-repeat;
  pointer-events: none;
}
.button-icon {
  position: relative;
}
.button-icon.arrow::before {
  -webkit-mask-image: url('/img/font-awesome_4-7-0_arrow-circle-o-right_100_0_ffffff_none.png');
  mask-image: url('/img/font-awesome_4-7-0_arrow-circle-o-right_100_0_ffffff_none.png');
}
.button-icon.form-button::before,
.button-icon.envelope::before {
  -webkit-mask-image: url('/img/font-awesome_4-7-0_paper-plane_100_0_ffffff_none.png');
  mask-image: url('/img/font-awesome_4-7-0_paper-plane_100_0_ffffff_none.png');
}
.button-icon.envelope::before {
  -webkit-mask-image: url('/img/font-awesome_4-7-0_envelope-open_100_0_ffffff_none.png');
  mask-image: url('/img/font-awesome_4-7-0_envelope-open_100_0_ffffff_none.png');
}
.button-icon.no-icon::before,
.button-icon.other-color.no-icon::before,
.button-icon.previous::before,
.button-icon.next-project::before {
  display: none;
}
.button-icon:hover {
  color: #fff;
}
/* Burgundy buttons already use white text; keep them white */
.button-icon.other-color {
  color: #fff;
  background-image: none;
}
.button-icon.other-color:hover {
  color: #fff;
}

.learn-more {
  color: #4a4a4a;
}
.learn-more:hover {
  color: #592746;
}

/* Service-area tagline: force light text on the burgundy header */
a.brand-logo .servicearea,
.brand-logo .servicearea {
  color: #fff;
}

/* 4. Visible form labels on the burgundy estimate panel */
.estimate-form .field-label,
.pd-form .field-label {
  display: block;
  margin: 0 0 4px;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  text-align: left;
}
.estimate-form .gray-field.text-field-footer,
.estimate-form .w-select {
  margin-top: 0;
  margin-bottom: 12px;
}

/* 5. Skip link and visible focus */
.skip-link {
  position: absolute;
  left: 12px;
  top: -100px;
  z-index: 10000;
  padding: 8px 14px;
  background: #032649;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  border-radius: 4px;
}
.skip-link:focus,
.skip-link:focus-visible {
  top: 8px;
  outline: 3px solid #e9c377;
  outline-offset: 2px;
  color: #fff;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.w-nav-button:focus-visible,
.w-dropdown-toggle:focus-visible {
  outline: 3px solid #e9c377;
  outline-offset: 2px;
}
.button-icon:focus-visible {
  outline: 3px solid #032649;
  outline-offset: 2px;
}

/* Footer privacy link */
.footer-legal {
  margin-top: 16px;
  font-size: 14px;
}
.footer-legal a {
  color: #592746;
  text-decoration: underline;
}
.footer-legal a:hover {
  color: #032649;
}

/* 7. Hide the broken 1x1 BBB seal (markup kept for a later working badge) */
.bbb-seal {
  display: none;
}

/* Keep the added Services item on one row with the existing desktop nav */
@media (min-width: 992px) {
  .navigation-style-5 .navigation-link {
    padding-left: 10px;
    padding-right: 12px;
  }
  .navigation-style-5 .dropdown-toggle {
    padding-left: 8px;
    padding-right: 14px;
  }
}