/* FINAL LOCAL PATCHES - readability, original scrolling header, working roof tool */
:root { --ge-blue:#051f3d; --ge-yellow:#f2b705; }
html body #header,
html body header.u-header,
html body header.u-sticky,
html body .u-sticky,
html body .u-sticky-fixed,
html body .u-sticky-placeholder { position: relative !important; top: auto !important; left: auto !important; right: auto !important; transform: none !important; }
html body { padding-top: 0 !important; }
/* no white-on-white or blue-on-blue */
.u-white p, .u-white h1, .u-white h2, .u-white h3, .u-white h4, .u-white h5, .u-white h6,
.u-grey-5 p, .u-grey-5 h1, .u-grey-5 h2, .u-grey-5 h3, .u-grey-5 h4, .u-grey-5 h5, .u-grey-5 h6,
.u-grey-light-2 p, .u-grey-light-2 h1, .u-grey-light-2 h2, .u-grey-light-2 h3, .u-grey-light-2 h4, .u-grey-light-2 h5, .u-grey-light-2 h6,
.u-section-1:not(.u-custom-color-2):not(.u-image) .u-text,
.u-section-2:not(.u-custom-color-2):not(.u-image) .u-text,
.u-section-3:not(.u-custom-color-2):not(.u-image) .u-text { color: var(--ge-blue) !important; }
.u-custom-color-2 .u-text, .u-custom-color-2 p, .u-custom-color-2 h1, .u-custom-color-2 h2, .u-custom-color-2 h3, .u-custom-color-2 h4, .u-custom-color-2 h5, .u-custom-color-2 h6 { color:#fff !important; }
/* financing banner text treatment — all blue, spans yellow */
.ge-low-interest-banner-text { color:#051f3d !important; -webkit-text-fill-color:#051f3d !important; text-shadow:none !important; }
.ge-low-interest-banner-text * { color:#051f3d !important; -webkit-text-fill-color:#051f3d !important; }
.ge-low-interest-banner-text span,
.ge-low-interest-banner-text .u-text-custom-color-1 { color:#f2b705 !important; -webkit-text-fill-color:#f2b705 !important; }
/* keep roof type cards visible and not distorted */
#stepRoofType .roof-type-card img { object-fit: cover !important; object-position: center center !important; }
#stepRoofType .roof-type-label { background: var(--ge-yellow) !important; color: var(--ge-blue) !important; }

/* ── FAQ ACCORDION: + / × icon ── */
/* Hide the original SVG-based plus icon */
.u-accordion-link-icon svg {
  display: none !important;
}
/* Replace with a text + sign */
.u-accordion-link-icon::after {
  content: '+';
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  color: #051f3d !important;
  -webkit-text-fill-color: #051f3d !important;
  border: 2px solid #051f3d;
  border-radius: 4px;
  background: #fff;
  box-sizing: border-box;
  transition: transform 0.2s ease;
}
/* When the link is active (open), show × */
.u-accordion-link.active .u-accordion-link-icon::after {
  content: '×';
  font-size: 26px;
}

/* ── "Safety and Service / get a free quote" yellow strip: fix uneven height/two-tone ── */
.u-section-7 .u-layout-row {
  align-items: stretch !important;
}
.u-section-7 .u-layout-cell-1,
.u-section-7 .u-layout-cell-2 {
  min-height: 165px !important;
  background-color: var(--ge-yellow) !important;
  background-image: none !important;
}
@media (max-width: 1199px) {
  .u-section-7 .u-layout-cell-1,
  .u-section-7 .u-layout-cell-2 {
    min-height: 136px !important;
  }
}
@media (max-width: 991px) {
  .u-section-7 .u-layout-cell-1,
  .u-section-7 .u-layout-cell-2 {
    min-height: 146px !important;
  }
}
@media (max-width: 767px) {
  .u-section-7 .u-layout-cell-1,
  .u-section-7 .u-layout-cell-2 {
    min-height: 202px !important;
  }
}

/* ── 9-CARD SERVICE GRID: static grid, no carousel ── */
.u-section-10 .u-sheet-1 {
  min-height: 0 !important;
  padding-top: 40px;
  padding-bottom: 40px;
}
.ge-service-grid {
  display: grid !important;
  position: static !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  overflow: visible !important;
}
.ge-service-grid-repeater {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  position: static !important;
  transform: none !important;
}
.ge-service-grid-repeater .u-repeater-item {
  position: static !important;
  width: 100% !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
}
.ge-service-grid-repeater .u-container-layout {
  height: auto !important;
  min-height: 0 !important;
  padding: 16px !important;
}
.ge-service-grid-repeater .u-image {
  position: relative !important;
  height: 200px !important;
  margin-bottom: 12px !important;
}
.ge-service-grid-repeater h4 {
  margin: 0 !important;
}
@media (max-width: 991px) {
  .ge-service-grid-repeater {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 599px) {
  .ge-service-grid-repeater {
    grid-template-columns: 1fr !important;
  }
  .ge-service-grid-repeater .u-image {
    height: 220px !important;
  }
}

/* gap-fix-2026-06-14: remove oversized white content gaps before yellow section/footer */
.u-section-3 .u-sheet-1,
.u-section-3 .u-layout-cell-1,
.u-section-3 .u-layout-cell-2,
.u-section-3 .u-image-1 {
  min-height: 0 !important;
}

.u-section-3 .u-layout-wrap-1 {
  margin-bottom: 30px !important;
}

.u-section-3 .u-text-1,
.u-section-3 .u-text-2 {
  margin-bottom: 20px !important;
}

.u-section-3 {
  padding-bottom: 0 !important;
}

/* site-wide-2026-06-15: top-align the "Hiring The Wrong Roofing Company" block
   on every page (block id is consistent site-wide regardless of section number) */
#block-18 .u-sheet-1,
#block-18 .u-layout-row {
  align-items: flex-start !important;
}

#block-18 .u-layout-cell {
  vertical-align: top !important;
}

#block-18 .u-layout-cell-1 .u-container-layout-1 {
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

/* site-wide-2026-06-15: hide the Google reCAPTCHA "Invalid domain for site key"
   error UI everywhere (badge, iframe, and any error tooltip it injects) */
.g-recaptcha,
.grecaptcha-badge,
iframe[src*="recaptcha"],
iframe[title*="recaptcha" i],
div[class*="recaptcha"],
div[id*="recaptcha"],
.rc-anchor,
.rc-imageselect {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

/* ===== Safety & Service banner color swap: yellow strip, blue button ===== */
.ge-safety-banner.u-clearfix,
.ge-safety-banner .u-layout-cell.u-custom-color-2 {
    background-color: #f7b50b !important;
}
/* Strip heading text -> dark for contrast on yellow */
.ge-safety-banner .u-custom-color-2 .u-text,
.ge-safety-banner .u-text-1 {
    color: #111111 !important;
}
/* "Get a Free Quote" button -> blue with white text */
.ge-safety-banner a.u-btn.u-custom-color-1,
.ge-safety-banner .u-button-style.u-custom-color-1 {
    background-color: #0d1b30 !important;
    color: #ffffff !important;
}
.ge-safety-banner a.u-btn.u-custom-color-1:hover,
.ge-safety-banner a.u-btn.u-custom-color-1:focus,
.ge-safety-banner a.u-btn.u-custom-color-1:active {
    background-color: #16294a !important;
    color: #ffffff !important;
}

/* ===== "Hiring The Wrong Roofing Company..." section ===== */
/* Background -> full-width white (targets stable marker class, any section number) */
section.ge-hiring-section,
.ge-hiring-section,
.ge-hiring-section > .u-sheet,
.ge-hiring-section .u-sheet-1,
.ge-hiring-section .u-layout-cell:not(.u-image),
.ge-hiring-section .u-layout-cell:not(.u-image) .u-container-layout {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
}
/* Ensure the image cell and its inner layout stay transparent so the copper photo shows */
.ge-hiring-section .u-image,
.ge-hiring-section .u-image .u-container-layout {
    background-color: transparent !important;
}
section.ge-hiring-section::before,
section.ge-hiring-section::after {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
}
/* Heading -> yellow */
.ge-hiring-section h2.u-text-1 {
    color: #f7b50b !important;
    -webkit-text-fill-color: #f7b50b !important;
}
/* Sub-line ("...leads to:") -> blue */
.ge-hiring-section h2.u-text-1 .u-text-custom-color-2 {
    color: #0d1b30 !important;
    -webkit-text-fill-color: #0d1b30 !important;
}
/* List items ("Down payments...", etc.) -> blue */
.ge-hiring-section .u-text-2,
.ge-hiring-section .u-text-2 li,
.ge-hiring-section ul.u-custom-list,
.ge-hiring-section ul.u-custom-list li {
    color: #0d1b30 !important;
    -webkit-text-fill-color: #0d1b30 !important;
}