/* ==========================================================================
   Fraser Plumbing design system (v1) - Elementor + UAE build
   Tokens map to Elementor Site Settings > Global Colors / Fonts, so edits
   made there flow through. Component classes are prefixed "fr-".
   ========================================================================== */
:root {
  --fr-red: var(--e-global-color-accent, #da3f1f);
  --fr-red-600: var(--e-global-color-frred600, #bf3418);
  --fr-red-50: var(--e-global-color-frred50, #fdf0ec);
  --fr-navy: var(--e-global-color-primary, #00205b);
  --fr-navy-900: var(--e-global-color-secondary, #06163a);
  --fr-blue: var(--e-global-color-frblue, #073d68);
  --fr-blue-400: #3c6d9c;
  --fr-blue-100: var(--e-global-color-frblue100, #dbe7f3);
  --fr-sky: var(--e-global-color-frsky, #eef4fa);
  --fr-sky-2: var(--e-global-color-frsky2, #f6f9fc);
  --fr-line: var(--e-global-color-frline, #dde5ee);
  --fr-line-2: #e9eff5;
  --fr-ink: var(--e-global-color-frink, #0d1a2e);
  --fr-text: var(--e-global-color-text, #34445a);
  --fr-muted: var(--e-global-color-frmuted, #5f6f84);
  --fr-head: "Manrope", "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --fr-body: "Inter", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --fr-r-sm: 12px;
  --fr-r: 18px;
  --fr-r-lg: 24px;
  --fr-sh-sm: 0 1px 2px rgba(6,22,58,.05), 0 4px 14px rgba(6,22,58,.05);
  --fr-sh-md: 0 2px 6px rgba(6,22,58,.05), 0 14px 34px rgba(6,22,58,.08);
  --fr-sh-lg: 0 30px 70px rgba(6,22,58,.16);
  --fr-topbar-h: 40px;
  --fr-header-h: 78px;
  --fr-ease: .2s ease;
}
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--fr-header-h) + 16px); }
html, body { overflow-x: clip; }
body { -webkit-font-smoothing: antialiased; }
:where(.fr-scope) :focus-visible, #masthead :focus-visible, .fr-footer :focus-visible { outline: 3px solid var(--fr-blue-400); outline-offset: 3px; border-radius: 6px; }

/* ---------- Icons (uploaded SVGs use stroke) ---------- */
svg.fr-svg { fill: none !important; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
svg.fr-svg-fill { fill: currentColor !important; stroke: none; }
.elementor-icon-list-icon svg.fr-svg, .elementor-button-icon svg.fr-svg { fill: none !important; }

/* ---------- Typography helpers ---------- */
.fr-eyebrow .elementor-heading-title {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--fr-head); font-size: 13px; font-weight: 800; line-height: 1.3;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fr-red);
}
.fr-eyebrow .elementor-heading-title::before { content: ""; width: 22px; height: 2px; background: currentColor; border-radius: 2px; flex: none; }
.fr-eyebrow--light .elementor-heading-title { color: #ff9c85; }
.fr-center, .fr-center .elementor-heading-title { text-align: center; justify-content: center; }
.fr-lead, .fr-lead p { font-size: 18px; line-height: 1.6; color: var(--fr-muted); }
.fr-lead p:last-child, .fr-text p:last-child { margin-bottom: 0; }
.fr-maxw { max-width: 640px; }
.fr-center.fr-maxw { margin-inline: auto; }
.fr-h1 .elementor-heading-title .fr-accent, .fr-accent { color: var(--fr-red); }
@media (min-width: 481px) { .fr-h1 .fr-accent { white-space: nowrap; } }

/* ---------- Buttons (Elementor button widget skins) ---------- */
.fr-btn .elementor-button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 52px; padding: 0 24px; border-radius: 12px; border: 1.5px solid transparent;
  font-family: var(--fr-head); font-weight: 800; font-size: 16px; line-height: 1.2; letter-spacing: -.005em;
  white-space: nowrap; text-decoration: none;
  transition: background-color var(--fr-ease), color var(--fr-ease), border-color var(--fr-ease), box-shadow var(--fr-ease), transform var(--fr-ease);
}
.fr-btn .elementor-button-content-wrapper { gap: 10px; align-items: center; }
.fr-btn .elementor-button-icon { display: inline-flex; }
.fr-btn .elementor-button-icon svg { width: 19px; height: 19px; }
.fr-btn .elementor-button:hover { transform: translateY(-1px); }
.fr-btn--red .elementor-button { background: var(--fr-red); color: #fff; box-shadow: 0 10px 24px rgba(218,63,31,.24); }
.fr-btn--red .elementor-button:hover, .fr-btn--red .elementor-button:focus-visible { background: var(--fr-red-600); color: #fff; box-shadow: 0 14px 30px rgba(218,63,31,.3); }
.fr-btn--navy .elementor-button { background: var(--fr-navy); color: #fff; box-shadow: none; }
.fr-btn--navy .elementor-button:hover, .fr-btn--navy .elementor-button:focus-visible { background: var(--fr-navy-900); color: #fff; }
.fr-btn--outline .elementor-button { background: #fff; color: var(--fr-navy); border-color: #c5d3e2; box-shadow: none; }
.fr-btn--outline .elementor-button:hover, .fr-btn--outline .elementor-button:focus-visible { background: #fff; color: var(--fr-navy); border-color: var(--fr-navy); }
.fr-btn--ghost .elementor-button { background: transparent; color: #fff; border-color: rgba(255,255,255,.4); box-shadow: none; }
.fr-btn--ghost .elementor-button:hover, .fr-btn--ghost .elementor-button:focus-visible { background: rgba(255,255,255,.06); color: #fff; border-color: #fff; }
.fr-btn--sm .elementor-button { min-height: 44px; padding: 0 18px; font-size: 15px; border-radius: 10px; }
.fr-btn--lg .elementor-button { min-height: 56px; padding: 0 26px; font-size: 17px; }
.fr-link-arrow .elementor-button {
  background: none; padding: 0; min-height: 44px; border: 0; box-shadow: none; border-radius: 0;
  color: var(--fr-navy); font-family: var(--fr-head); font-weight: 800; font-size: 15px;
}
.fr-link-arrow .elementor-button:hover, .fr-link-arrow .elementor-button:focus-visible { background: none; color: var(--fr-red); }
.fr-link-arrow .elementor-button-content-wrapper { gap: 8px; }
.fr-link-arrow .elementor-button-icon svg { width: 18px; height: 18px; transition: transform var(--fr-ease); }
.fr-link-arrow .elementor-button:hover .elementor-button-icon svg { transform: translateX(4px); }
.fr-btnrow { flex-wrap: wrap; }

/* ---------- Pills / status ---------- */
.fr-pill .elementor-heading-title {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 14px 8px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--fr-line);
  font-family: var(--fr-head); font-size: 14px; font-weight: 800; line-height: 1.3; color: var(--fr-navy);
  box-shadow: var(--fr-sh-sm);
}
.fr-pulse, .fr-pill .elementor-heading-title::before { position: relative; width: 10px; height: 10px; border-radius: 50%; background: var(--fr-red); flex: none; }
.fr-pill .elementor-heading-title::before { content: ""; box-shadow: 0 0 0 0 rgba(218,63,31,.5); animation: fr-pulse 2s ease-out infinite; }
.fr-pulse { display: inline-block; vertical-align: middle; box-shadow: 0 0 0 0 rgba(218,63,31,.5); animation: fr-pulse 2s ease-out infinite; }
@keyframes fr-pulse { 0% { box-shadow: 0 0 0 0 rgba(218,63,31,.55); } 100% { box-shadow: 0 0 0 10px rgba(218,63,31,0); } }

/* ==========================================================================
   Header (UAE template)
   ========================================================================== */
body #masthead, header#masthead { position: sticky !important; top: calc(var(--fr-topbar-h) * -1); z-index: 999; }
.e-con.fr-auto { --width: auto !important; width: auto !important; max-width: 100%; }
.admin-bar #masthead { top: calc(32px - var(--fr-topbar-h)); }
@media (max-width: 782px) { .admin-bar #masthead { top: calc(var(--fr-topbar-h) * -1); } }
.fr-topbar { background: var(--fr-navy-900); color: #cfdbeb; font-size: 14px; }
.fr-topbar > .e-con-inner { min-height: var(--fr-topbar-h); height: var(--fr-topbar-h); }
.fr-topbar p { margin: 0; line-height: 1.3; }
.fr-topbar strong { color: #fff; font-weight: 700; }
.fr-topbar a { color: #fff; text-decoration: none; }
.fr-topbar a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fr-topbar .fr-pulse { width: 8px; height: 8px; margin-right: 8px; }
.fr-topbar-links .elementor-icon-list-items { gap: 0 22px; }
.fr-topbar-links .elementor-icon-list-item { font-size: 14px; }
.fr-topbar-links .elementor-icon-list-item a, .fr-topbar-links .elementor-icon-list-text { color: #fff; }
.fr-topbar-links .elementor-icon-list-icon { color: #8fb0d3; }
.fr-topbar-links .elementor-icon-list-icon svg { width: 16px; height: 16px; }
.fr-topbar .fr-short { display: none; }
.fr-mainbar { background: rgba(255,255,255,.97); border-bottom: 1px solid var(--fr-line-2); transition: box-shadow .25s ease; }
@supports (backdrop-filter: blur(10px)) { .fr-mainbar { background: rgba(255,255,255,.92); backdrop-filter: saturate(160%) blur(12px); -webkit-backdrop-filter: saturate(160%) blur(12px); } }
@supports (animation-timeline: scroll()) {
  .fr-mainbar { animation: fr-hdr-shadow linear both; animation-timeline: scroll(root); animation-range: 0 140px; }
  @keyframes fr-hdr-shadow { from { box-shadow: 0 0 0 rgba(6,22,58,0); } to { box-shadow: 0 8px 28px rgba(6,22,58,.08); } }
}
.fr-mainbar > .e-con-inner { min-height: var(--fr-header-h); }
.fr-logo img { height: 42px; width: auto; max-width: none; display: block; }
.fr-hdr-phone .elementor-icon-box-wrapper { display: flex; align-items: center; gap: 10px; text-align: start; }
.fr-hdr-phone .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; }
.fr-hdr-phone .elementor-icon { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--fr-red-50); color: var(--fr-red); font-size: 18px; }
.fr-hdr-phone .elementor-icon svg { width: 18px; height: 18px; }
.fr-hdr-phone .elementor-icon-box-title { margin: 0; order: 2; font-family: var(--fr-head); font-size: 17px; font-weight: 800; line-height: 1.2; }
.fr-hdr-phone .elementor-icon-box-title a { color: var(--fr-navy); text-decoration: none; }
.fr-hdr-phone .elementor-icon-box-content { display: flex; flex-direction: column; }
.fr-hdr-phone .elementor-icon-box-description { order: 1; margin: 0; font-size: 12px; font-weight: 600; color: var(--fr-muted); line-height: 1.2; }
.fr-mobile-call { display: none; }
.fr-mobile-call .elementor-icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-red); color: #fff; font-size: 22px; }
.fr-mobile-call .elementor-icon svg { width: 22px; height: 22px; }

/* UAE navigation menu */
.fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a,
.fr-nav .hfe-nav-menu > li > a.hfe-menu-item {
  font-family: var(--fr-head); font-size: 15px; font-weight: 700; color: var(--fr-ink);
  padding: 10px 12px; border-radius: 10px; transition: color var(--fr-ease), background-color var(--fr-ease);
}
.fr-nav .hfe-nav-menu > li:hover > .hfe-has-submenu-container > a,
.fr-nav .hfe-nav-menu > li:hover > a.hfe-menu-item,
.fr-nav .hfe-nav-menu > li:focus-within > .hfe-has-submenu-container > a { color: var(--fr-navy); background: var(--fr-sky); }
.fr-nav .hfe-nav-menu > li.current-menu-item > a.hfe-menu-item { color: var(--fr-navy); }
.fr-nav .hfe-nav-menu .sub-arrow { color: var(--fr-muted); padding-left: 6px; }
@media (min-width: 1025px) {
  .fr-nav .hfe-nav-menu > li { margin: 0 2px; }
  .fr-nav .hfe-nav-menu .sub-menu {
    background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-lg);
    padding: 14px; min-width: 280px; top: calc(100% + 8px);
  }
  .fr-nav .hfe-nav-menu > li.fr-mega > .sub-menu { width: 560px; column-count: 2; column-gap: 18px; }
  .fr-nav .hfe-nav-menu > li.fr-mega > .sub-menu > li { break-inside: avoid; }
  .fr-nav .hfe-nav-menu .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
  .fr-nav .hfe-nav-menu .sub-menu li a.hfe-sub-menu-item {
    padding: 8px 10px; border-radius: 8px; font-size: 15px; line-height: 1.35; color: var(--fr-text);
    border: 0; background: transparent; white-space: normal;
  }
  .fr-nav .hfe-nav-menu .sub-menu li a.hfe-sub-menu-item:hover, .fr-nav .hfe-nav-menu .sub-menu li a.hfe-sub-menu-item:focus-visible { background: var(--fr-sky); color: var(--fr-navy); }
  .fr-nav .hfe-nav-menu .sub-menu li.fr-menu-all a.hfe-sub-menu-item { color: var(--fr-navy); font-family: var(--fr-head); font-weight: 800; }
  .fr-nav .hfe-nav-menu li.fr-menu-mobile-only { display: none !important; }
  .fr-nav .hfe-nav-menu .sub-menu li { border: 0 !important; }
}
/* Mobile / tablet menu */
.fr-nav .hfe-nav-menu__toggle { border: 1px solid var(--fr-line); border-radius: 12px; width: 46px; height: 46px; display: none; align-items: center; justify-content: center; color: var(--fr-navy); background: #fff; }
.fr-nav .hfe-nav-menu__toggle svg { width: 22px; height: 22px; }
@media (max-width: 1024px) {
  .fr-nav .hfe-nav-menu__toggle { display: inline-flex; }
  .fr-nav nav.hfe-dropdown { background: #fff; border-top: 1px solid var(--fr-line-2); box-shadow: 0 24px 40px rgba(6,22,58,.14); max-height: calc(100vh - var(--fr-header-h)); overflow-y: auto; }
  .fr-nav nav.hfe-dropdown .hfe-nav-menu { padding: 6px 16px 16px; }
  .fr-nav nav.hfe-dropdown li a.hfe-menu-item, .fr-nav nav.hfe-dropdown li a.hfe-sub-menu-item {
    font-family: var(--fr-head); font-size: 17px; font-weight: 800; color: var(--fr-ink); padding: 15px 4px; border-bottom: 1px solid var(--fr-line-2); background: none;
  }
  .fr-nav nav.hfe-dropdown .sub-menu li a.hfe-sub-menu-item { font-family: var(--fr-body); font-size: 16px; font-weight: 500; color: var(--fr-text); padding: 11px 14px; border-bottom: 0; }
  .fr-nav nav.hfe-dropdown .sub-menu { background: var(--fr-sky-2); border-radius: 12px; margin: 6px 0 10px; }
  .fr-nav nav.hfe-dropdown li.fr-menu-call a.hfe-menu-item, .fr-nav nav.hfe-dropdown li.fr-menu-cta a.hfe-menu-item {
    justify-content: center; margin-top: 12px; min-height: 52px; border-radius: 12px; border: 0; color: #fff; background: var(--fr-red);
  }
  .fr-nav nav.hfe-dropdown li.fr-menu-cta a.hfe-menu-item { background: #fff; color: var(--fr-navy); border: 1.5px solid #c5d3e2; margin-top: 10px; }
  .fr-hdr-phone, .fr-hdr-cta { display: none !important; }
  .fr-mobile-call { display: block; }
  .fr-logo img { height: 38px; }
  :root { --fr-header-h: 70px; }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .fr-hdr-phone .elementor-icon-box-icon, .fr-hdr-phone .elementor-icon-box-description { display: none; }
  .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a, .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding: 10px 8px; font-size: 14.5px; }
}
@media (max-width: 767px) {
  .fr-topbar .fr-long, .fr-topbar-links { display: none !important; }
  .fr-topbar .fr-short { display: inline; }
  .fr-topbar > .e-con-inner { justify-content: center !important; }
  .fr-topbar { font-size: 13px; }
  .fr-logo img { height: 34px; }
}

/* ==========================================================================
   Sections
   ========================================================================== */
.fr-sec--sky { background: var(--fr-sky-2); border-block: 1px solid var(--fr-line-2); }
.fr-sec--problems { background: var(--fr-sky); }
.fr-hero { position: relative; overflow: hidden; background: linear-gradient(180deg, #f3f7fc 0%, #f8fbfe 60%, #fff 100%); }
.fr-hero::after {
  content: ""; position: absolute; right: -120px; top: -140px; width: 620px; height: 620px; pointer-events: none;
  border: 1px solid rgba(7,61,104,.07); border-radius: 50%; box-shadow: 0 0 0 60px rgba(7,61,104,.025), 0 0 0 120px rgba(7,61,104,.02);
}
.fr-hero > .e-con-inner { position: relative; z-index: 1; }
.fr-h1 .elementor-heading-title { max-width: 15ch; }
.fr-hero-lede, .fr-hero-lede p { font-size: 19px; line-height: 1.6; color: var(--fr-muted); max-width: 560px; }
.fr-proof .elementor-icon-list-items { display: grid !important; grid-template-columns: repeat(2, max-content); gap: 12px 28px; }
.fr-proof .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; font-size: 15px; font-weight: 600; color: var(--fr-ink); }
.fr-proof .elementor-icon-list-item::after { display: none !important; }
.fr-proof .elementor-icon-list-icon { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--fr-navy); color: #fff; flex: none; margin-right: 10px; padding: 0; }
.fr-proof .elementor-icon-list-icon svg { width: 13px !important; height: 13px !important; stroke-width: 3; }
.fr-proof .elementor-icon-list-text { padding: 0 !important; }

/* Form card (hero + full) */
.fr-form-card { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r-lg); box-shadow: var(--fr-sh-lg); }
.fr-form-card--full { box-shadow: var(--fr-sh-md); }
.fr-form-title .elementor-heading-title { font-family: var(--fr-head); font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--fr-ink); }
.fr-form-sub, .fr-form-sub p { font-size: 15px; color: var(--fr-muted); margin: 0; line-height: 1.5; }
.fr-form-sub .fr-req, .fr-req { color: var(--fr-red); }
.fr-form-foot, .fr-form-foot p { font-size: 14px; color: var(--fr-muted); margin: 0; }
.fr-form-foot a { color: var(--fr-navy); font-weight: 700; text-decoration: none; }
.fr-form-foot a:hover { color: var(--fr-red); }

/* Gravity Forms skin (forms #4 hero, #5 full) */
.fr-form-card .gform_wrapper.gravity-theme { margin: 0; }
.fr-form-card .gform_wrapper.gravity-theme .gform_fields { grid-column-gap: 14px; grid-row-gap: 14px; }
.fr-form-card--full .gform_wrapper.gravity-theme .gform_fields { grid-column-gap: 18px; grid-row-gap: 18px; }
.fr-form-card .gform_wrapper.gravity-theme .gfield_label {
  font-family: var(--fr-body); font-size: 14px; font-weight: 700; color: var(--fr-ink); margin-bottom: 7px; padding: 0; line-height: 1.3;
}
.fr-form-card .gform_wrapper.gravity-theme .gfield_required { color: var(--fr-red); font-weight: 700; }
.fr-form-card .gform_wrapper.gravity-theme .gfield_required .gfield_required_text { font-size: 0; }
.fr-form-card .gform_wrapper.gravity-theme .gfield_required .gfield_required_text::after { content: "*"; font-size: 14px; }
.fr-form-card .gform_wrapper.gravity-theme input[type="text"],
.fr-form-card .gform_wrapper.gravity-theme input[type="tel"],
.fr-form-card .gform_wrapper.gravity-theme input[type="email"],
.fr-form-card .gform_wrapper.gravity-theme select,
.fr-form-card .gform_wrapper.gravity-theme textarea {
  width: 100%; min-height: 50px; padding: 12px 15px; border-radius: 12px; margin: 0;
  border: 1.5px solid #cfdbe7; background-color: #fbfcfe; font-family: var(--fr-body); font-size: 16px; line-height: 1.4; color: var(--fr-ink);
  transition: border-color var(--fr-ease), box-shadow var(--fr-ease), background-color var(--fr-ease);
  -webkit-appearance: none; appearance: none; box-shadow: none;
}
.fr-form-card .gform_wrapper.gravity-theme select {
  padding-right: 44px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2300205b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 14px center;
}
.fr-form-card .gform_wrapper.gravity-theme textarea { min-height: 96px; height: 96px; resize: vertical; }
.fr-form-card--full .gform_wrapper.gravity-theme textarea { min-height: 130px; height: 130px; }
.fr-form-card .gform_wrapper.gravity-theme ::placeholder { color: #8b99ab; opacity: 1; }
.fr-form-card .gform_wrapper.gravity-theme input:focus, .fr-form-card .gform_wrapper.gravity-theme select:focus, .fr-form-card .gform_wrapper.gravity-theme textarea:focus {
  outline: none; border-color: var(--fr-navy); background-color: #fff; box-shadow: 0 0 0 4px rgba(0,32,91,.1);
}
.fr-form-card .gform_wrapper.gravity-theme .gfield_error input, .fr-form-card .gform_wrapper.gravity-theme .gfield_error select, .fr-form-card .gform_wrapper.gravity-theme .gfield_error textarea { border-color: var(--fr-red); background-color: #fff; }
.fr-form-card .gform_wrapper.gravity-theme .gfield_error .gfield_label { color: var(--fr-ink); }
.fr-form-card .gform_wrapper.gravity-theme .gfield_validation_message, .fr-form-card .gform_wrapper.gravity-theme .validation_message {
  background: none; border: 0; padding: 6px 0 0; margin: 0; font-size: 13px; font-weight: 600; color: var(--fr-red-600);
}
.fr-form-card .gform_wrapper.gravity-theme .gform_validation_errors {
  border: 1px solid #f3c6ba; background: var(--fr-red-50); border-radius: 12px; box-shadow: none; padding: 12px 16px; margin: 0 0 16px;
}
.fr-form-card .gform_wrapper.gravity-theme .gform_validation_errors > h2 { font-family: var(--fr-body); font-size: 14px; font-weight: 700; color: var(--fr-red-600); margin: 0; }
.fr-form-card .gform_wrapper.gravity-theme .gform_validation_errors > h2 .gform-icon { display: none; }
.fr-form-card .gform_wrapper.gravity-theme .gform_validation_errors ol { display: none; }
.fr-form-card .gform_wrapper.gravity-theme .gfield--type-date .ginput_container_date { width: 100%; }
.fr-form-card .gform_wrapper.gravity-theme .gfield--type-date input { width: 100% !important; }
.fr-form-card .gform_wrapper.gravity-theme .gform_footer { margin: 16px 0 0; padding: 0; }
.fr-form-card .gform_wrapper.gravity-theme .gform_footer input[type="submit"], .fr-form-card .gform_wrapper.gravity-theme .gform_footer button {
  width: 100%; min-height: 54px; margin: 0; padding: 0 24px; border: 0; border-radius: 12px; cursor: pointer;
  background: var(--fr-red); color: #fff; font-family: var(--fr-head); font-size: 17px; font-weight: 800; letter-spacing: -.005em;
  box-shadow: 0 10px 24px rgba(218,63,31,.24); transition: background-color var(--fr-ease), box-shadow var(--fr-ease), transform var(--fr-ease);
}
.fr-form-card .gform_wrapper.gravity-theme .gform_footer input[type="submit"]:hover, .fr-form-card .gform_wrapper.gravity-theme .gform_footer input[type="submit"]:focus-visible { background: var(--fr-red-600); transform: translateY(-1px); }
.fr-form-card--full .gform_wrapper.gravity-theme .gform_footer input[type="submit"] { width: auto; min-width: 240px; }
.fr-form-card .gform_ajax_spinner { margin-left: 10px; }
.fr-form-success { text-align: center; padding: 28px 8px 12px; }
.fr-form-success__icon { width: 64px; height: 64px; margin: 0 auto 16px; border-radius: 50%; display: grid; place-items: center; background: var(--fr-navy); }
.fr-form-success__icon::before { content: ""; width: 30px; height: 30px; background: #fff;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/contain no-repeat; }
.fr-form-success strong { display: block; font-family: var(--fr-head); font-size: 24px; color: var(--fr-ink); }
.fr-form-success p { margin: 10px 0 0; color: var(--fr-muted); }
.fr-form-success a { color: var(--fr-navy); font-weight: 700; }
.gform_confirmation_wrapper:has(.fr-form-success) { margin: 0; }

/* Trust strip */
.fr-trust-card { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-md); }
.fr-trust-item { padding: 24px; }
.fr-trust-item + .fr-trust-item { border-left: 1px solid var(--fr-line-2); }
.fr-trust-item .elementor-icon-box-wrapper, .fr-benefit .elementor-icon-box-wrapper { text-align: start; }
.fr-trust-item .elementor-icon-box-wrapper { display: flex; align-items: center; gap: 14px; }
.fr-trust-item .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; }
.fr-trust-item .elementor-icon { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-red-50); color: var(--fr-red); font-size: 23px; }
.fr-trust-item .elementor-icon svg { width: 23px; height: 23px; }
.fr-trust-item .elementor-icon-box-title { margin: 0; font-family: var(--fr-head); font-size: 16px; font-weight: 800; line-height: 1.25; color: var(--fr-ink); }
.fr-trust-item .elementor-icon-box-description { margin: 2px 0 0; font-size: 14px; line-height: 1.4; color: var(--fr-muted); }

/* Section heads */
.fr-head-row { justify-content: space-between; }

/* Service cards */
.fr-svc-card {
  position: relative; background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); overflow: hidden;
  box-shadow: var(--fr-sh-sm); text-decoration: none; color: inherit;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.fr-svc-card:hover, .fr-svc-card:focus-visible { transform: translateY(-4px); box-shadow: var(--fr-sh-md); border-color: #c9d6e4; }
.fr-svc-media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--fr-sky); width: 100%; }
.fr-svc-media img { width: 100% !important; height: 100% !important; object-fit: cover; transition: transform .5s ease; display: block; }
.fr-svc-media--contain img { object-fit: contain; padding: 14px; background: #fff; }
.fr-svc-card:hover .fr-svc-media img { transform: scale(1.05); }
.fr-svc-body { flex: 1 1 auto; }
.fr-card-title .elementor-heading-title { font-family: var(--fr-head); font-size: 19px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: var(--fr-ink); }
.fr-card-text, .fr-card-text p { font-size: 15px; line-height: 1.55; color: var(--fr-muted); margin: 0; }
.fr-svc-body .fr-card-text { flex: 1 1 auto; }
.fr-more .elementor-heading-title { display: inline-flex; align-items: center; gap: 8px; font-family: var(--fr-head); font-weight: 800; font-size: 15px; color: var(--fr-red); line-height: 1.3; }
.fr-more .elementor-heading-title::after, .fr-problem::after {
  content: ""; width: 18px; height: 18px; background: currentColor; flex: none; transition: transform var(--fr-ease);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
}
.fr-svc-card:hover .fr-more .elementor-heading-title::after { transform: translateX(4px); }

/* Problem finder */
.fr-leak-box { background: #fff; border: 1px solid var(--fr-line); border-left: 4px solid var(--fr-red); border-radius: var(--fr-r); }
.fr-leak-box .fr-card-title .elementor-heading-title { font-size: 17px; }
.fr-leak-box .fr-card-title .elementor-heading-title::before {
  content: ""; display: inline-block; vertical-align: -3px; width: 20px; height: 20px; margin-right: 10px; background: var(--fr-red);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9v4M12 17h.01'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9v4M12 17h.01'/%3E%3C/svg%3E") center/contain no-repeat;
}
@media (min-width: 1025px) { .fr-sticky-aside { position: sticky; top: calc(var(--fr-header-h) + 32px); } }
.fr-problem {
  position: relative; display: flex; align-items: center; gap: 12px; padding: 18px; background: #fff; border-radius: 14px; border: 1px solid var(--fr-line);
  text-decoration: none; color: inherit; transition: border-color var(--fr-ease), box-shadow var(--fr-ease), transform var(--fr-ease);
}
.fr-problem::after { color: #9aabbe; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E"); width: 20px; height: 20px; }
.fr-problem:hover, .fr-problem:focus-visible { border-color: var(--fr-navy); box-shadow: var(--fr-sh-md); transform: translateY(-2px); }
.fr-problem:hover::after { color: var(--fr-navy); transform: translateX(3px); }
.fr-problem > .elementor-widget { flex: 1 1 auto; min-width: 0; }
.fr-problem .elementor-icon-box-wrapper { display: flex; align-items: center; gap: 16px; text-align: start; }
.fr-problem .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; }
.fr-problem .elementor-icon { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: var(--fr-sky); color: var(--fr-navy); font-size: 22px; transition: background-color var(--fr-ease), color var(--fr-ease); }
.fr-problem .elementor-icon svg { width: 22px; height: 22px; }
.fr-problem:hover .elementor-icon { background: var(--fr-navy); color: #fff; }
.fr-problem .elementor-icon-box-title { margin: 0; font-family: var(--fr-head); font-size: 17px; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; color: var(--fr-ink); }
.fr-problem .elementor-icon-box-description { margin: 4px 0 0; font-size: 14px; color: var(--fr-muted); line-height: 1.4; }
.fr-problem .elementor-icon-box-description b { color: var(--fr-red); font-weight: 700; }

/* Residential / commercial segments */
.fr-segment { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r-lg); overflow: hidden; box-shadow: var(--fr-sh-sm); }
.fr-segment-media { position: relative; aspect-ratio: 16 / 8.5; overflow: hidden; background: var(--fr-sky); }
.fr-segment-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(6,22,58,0) 50%, rgba(6,22,58,.45) 100%); pointer-events: none; }
.fr-segment-media .elementor-widget-image, .fr-segment-media .elementor-widget-image img { width: 100%; height: 100%; }
.fr-segment-media img { object-fit: cover; display: block; }
.fr-segment-tag { position: absolute !important; left: 20px; bottom: 18px; z-index: 1; width: auto !important; }
.fr-segment-tag .elementor-heading-title {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; background: #fff; color: var(--fr-navy);
  font-family: var(--fr-head); font-size: 14px; font-weight: 800; line-height: 1.2;
}
.fr-segment-title .elementor-heading-title { font-family: var(--fr-head); font-size: 30px; font-weight: 800; line-height: 1.12; letter-spacing: -.025em; color: var(--fr-ink); }
.fr-tick .elementor-icon-list-items { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px 20px; }
.fr-tick .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; align-items: flex-start !important; font-size: 15px; font-weight: 600; color: var(--fr-ink); line-height: 1.4; }
.fr-tick .elementor-icon-list-item::after { display: none !important; }
.fr-tick .elementor-icon-list-icon { color: var(--fr-red); margin-top: 1px; padding: 0; }
.fr-tick .elementor-icon-list-icon svg { width: 18px !important; height: 18px !important; stroke-width: 2.4; }
.fr-tick .elementor-icon-list-text { padding-left: 10px !important; }
.fr-tick--light .elementor-icon-list-item { color: #e3ebf5; font-weight: 500; }
.fr-tick--light .elementor-icon-list-icon { color: #ff9c85; }
.fr-tick--1col .elementor-icon-list-items { grid-template-columns: 1fr; gap: 8px; }
.fr-audience { border-top: 1px solid var(--fr-line-2); }
.fr-small-label .elementor-heading-title { font-family: var(--fr-head); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--fr-muted); line-height: 1.3; }
.fr-chips .elementor-icon-list-items { display: flex !important; flex-wrap: wrap; gap: 8px; }
.fr-chips .elementor-icon-list-item { margin: 0 !important; padding: 7px 13px !important; border-radius: 999px; background: var(--fr-sky); border: 1px solid var(--fr-line-2); font-size: 14px; font-weight: 600; color: var(--fr-navy); line-height: 1.3; }
.fr-chips .elementor-icon-list-item::after { display: none !important; }
.fr-chips .elementor-icon-list-icon { display: none; }
.fr-chips .elementor-icon-list-text { padding: 0 !important; color: var(--fr-navy); }
.fr-segment-ctas { margin-top: auto; }
.fr-repipe { background: var(--fr-sky-2); border: 1px solid var(--fr-line); border-radius: var(--fr-r); }
.fr-repipe-icon .elementor-icon { width: 56px; height: 56px; border-radius: 14px; display: grid; place-items: center; background: var(--fr-navy); color: #fff; font-size: 26px; }
.fr-repipe-icon .elementor-icon svg { width: 26px; height: 26px; }
.fr-inline-links .elementor-icon-list-items { gap: 6px 14px; }
.fr-inline-links .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.fr-inline-links .elementor-icon-list-item::after { display: none !important; }
.fr-inline-links .elementor-icon-list-item a { font-size: 14px; font-weight: 600; color: var(--fr-navy); border-bottom: 1px solid var(--fr-blue-100); line-height: 1.5; padding: 4px 0; }
.fr-inline-links .elementor-icon-list-item a:hover { border-color: var(--fr-navy); }
.fr-inline-links .elementor-icon-list-icon { display: none; }
.fr-inline-links .elementor-icon-list-text { color: inherit; padding: 0 !important; }

/* Why Fraser */
.fr-why-media { position: relative; border-radius: var(--fr-r-lg); overflow: hidden; aspect-ratio: 1 / 1.08; background: var(--fr-sky); box-shadow: var(--fr-sh-md); }
.fr-why-media > .elementor-widget-image { position: absolute !important; inset: 0; width: 100% !important; height: 100%; }
.fr-why-media > .elementor-widget-image img { width: 100%; height: 100%; object-fit: cover; object-position: 62% 40%; display: block; }
.fr-why-quote { position: absolute !important; left: 20px; right: 20px; bottom: 20px; width: auto !important; background: #fff; border-radius: 16px; box-shadow: var(--fr-sh-md); z-index: 1; }
.fr-why-quote .fr-card-title .elementor-heading-title { font-size: 20px; }
.fr-benefit { padding: 22px; border-radius: var(--fr-r); border: 1px solid var(--fr-line); background: #fff; transition: border-color var(--fr-ease), box-shadow var(--fr-ease); height: 100%; }
.fr-benefit:hover { border-color: #c9d6e4; box-shadow: var(--fr-sh-sm); }
.fr-benefit .elementor-icon-box-icon { margin: 0 0 14px !important; display: inline-flex; }
.fr-benefit .elementor-icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-sky); color: var(--fr-navy); font-size: 22px; }
.fr-benefit .elementor-icon svg { width: 22px; height: 22px; }
.fr-benefit .elementor-icon-box-title { margin: 0; font-family: var(--fr-head); font-size: 18px; font-weight: 800; line-height: 1.25; letter-spacing: -.01em; color: var(--fr-ink); }
.fr-benefit .elementor-icon-box-description { margin: 8px 0 0; font-size: 15px; line-height: 1.55; color: var(--fr-muted); }

/* Process */
.fr-steps { position: relative; }
.fr-steps::before { content: ""; position: absolute; top: 31px; left: 10%; right: 10%; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--fr-navy), var(--fr-blue-400)); opacity: .18; }
.fr-step { position: relative; text-align: center; }
.fr-step-num .elementor-heading-title {
  position: relative; z-index: 1; width: 64px; height: 64px; margin: 0 auto; border-radius: 50%; display: grid; place-items: center;
  background: #fff; border: 2px solid var(--fr-navy); box-shadow: 0 0 0 8px #fff;
  font-family: var(--fr-head); font-weight: 800; font-size: 20px; color: var(--fr-navy); line-height: 1;
}
.fr-step--last .fr-step-num .elementor-heading-title { background: var(--fr-red); border-color: var(--fr-red); color: #fff; }
.fr-step .fr-card-title .elementor-heading-title { font-size: 18px; line-height: 1.3; letter-spacing: -.01em; }

/* Reviews */
.fr-rating { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-sm); text-decoration: none; color: inherit; transition: border-color var(--fr-ease), box-shadow var(--fr-ease); }
.fr-rating:hover, .fr-rating:focus-visible { border-color: #c9d6e4; box-shadow: var(--fr-sh-md); }
.fr-rating-score .elementor-heading-title { font-family: var(--fr-head); font-size: 42px; font-weight: 800; line-height: 1; color: var(--fr-navy); letter-spacing: -.03em; }
.fr-stars .elementor-star-rating { color: var(--fr-red); font-size: 18px; }
.fr-stars .elementor-star-rating i::before { color: var(--fr-red); }
.fr-stars .elementor-star-rating i { color: #f3c6ba; }
.fr-stars--sm .elementor-star-rating { font-size: 16px; }
.fr-rating-label .elementor-heading-title { font-family: var(--fr-head); font-size: 15px; font-weight: 800; color: var(--fr-ink); line-height: 1.2; }
.fr-rating-sub, .fr-rating-sub p { font-size: 13px; color: var(--fr-muted); line-height: 1.3; margin: 0; }
.fr-rv-card { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-sm); transition: border-color var(--fr-ease), box-shadow var(--fr-ease); }
.fr-rv-card:hover { border-color: #c9d6e4; box-shadow: var(--fr-sh-md); }
.fr-rv-quote .elementor-icon { color: var(--fr-blue-100); font-size: 30px; }
.fr-rv-quote .elementor-icon svg { width: 30px; height: 22px; }
.fr-rv-text, .fr-rv-text p { font-size: 16px; line-height: 1.65; color: var(--fr-ink); margin: 0; }
.fr-rv-text { flex: 1 1 auto; }
.fr-rv-meta { border-top: 1px solid var(--fr-line-2); }
.fr-avatar .elementor-heading-title { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--fr-navy); color: #fff; font-family: var(--fr-head); font-weight: 800; font-size: 15px; line-height: 1; }
.fr-rv-name .elementor-heading-title { font-family: var(--fr-head); color: var(--fr-ink); font-size: 16px; font-weight: 800; line-height: 1.3; }
.fr-rv-role, .fr-rv-role p { font-size: 14px; color: var(--fr-muted); line-height: 1.4; margin: 0; }
.fr-rv-cta { background: var(--fr-navy); border-color: var(--fr-navy); }
.fr-rv-cta .fr-card-title .elementor-heading-title { color: #fff; font-size: 21px; }
.fr-rv-cta .fr-card-text, .fr-rv-cta .fr-card-text p { color: #c9d6e8; }
.fr-rv-cta--light { background: #fff; border-color: var(--fr-line); }
.fr-rv-cta--light .fr-card-title .elementor-heading-title { color: var(--fr-ink); }
.fr-rv-cta--light .fr-card-text, .fr-rv-cta--light .fr-card-text p { color: var(--fr-muted); }
.fr-platform .elementor-heading-title { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: rgba(255,255,255,.12); color: #fff; font-family: var(--fr-head); font-weight: 800; font-size: 18px; line-height: 1; }
.fr-rv-cta--light .fr-platform .elementor-heading-title { background: var(--fr-sky); color: var(--fr-navy); }

/* Service areas */
.fr-areas-photo { position: relative; border-radius: var(--fr-r-lg); overflow: hidden; aspect-ratio: 16 / 10; box-shadow: var(--fr-sh-md); background: var(--fr-sky); }
.fr-areas-photo > .elementor-widget-image { position: absolute !important; inset: 0; width: 100% !important; height: 100%; }
.fr-areas-photo > .elementor-widget-image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fr-float-card { position: absolute !important; left: 18px; bottom: 18px; width: auto !important; max-width: calc(100% - 36px); background: #fff; border-radius: 16px; box-shadow: var(--fr-sh-md); border: 1px solid var(--fr-line-2); z-index: 1; }
.fr-float-card .elementor-icon-box-wrapper { display: flex; align-items: center; gap: 12px; text-align: start; }
.fr-float-card .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; }
.fr-float-card .elementor-icon { color: var(--fr-red); font-size: 22px; }
.fr-float-card .elementor-icon svg { width: 22px; height: 22px; }
.fr-float-card .elementor-icon-box-title { margin: 0; font-family: var(--fr-head); font-size: 15px; font-weight: 800; color: var(--fr-ink); line-height: 1.3; }
.fr-float-card .elementor-icon-box-description { margin: 0; font-size: 13px; color: var(--fr-muted); line-height: 1.4; }
.fr-regions { border: 1px solid var(--fr-line); border-radius: var(--fr-r); background: #fff; overflow: hidden; }
.fr-region { padding: 26px 26px 28px; }
.fr-region + .fr-region { border-left: 1px solid var(--fr-line-2); }
.fr-region-title .elementor-heading-title { display: flex; align-items: center; gap: 8px; font-family: var(--fr-head); font-size: 16px; font-weight: 800; color: var(--fr-navy); line-height: 1.3; letter-spacing: 0; }
.fr-region-title .elementor-heading-title::before {
  content: ""; width: 18px; height: 18px; background: var(--fr-red); flex: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center/contain no-repeat;
}
.fr-region-list .elementor-icon-list-item { padding: 0 !important; margin: 0 !important; }
.fr-region-list .elementor-icon-list-item::after { display: none !important; }
.fr-region-list .elementor-icon-list-items { display: grid; gap: 2px; }
.fr-region-list .elementor-icon-list-icon { display: none; }
.fr-region-list .elementor-icon-list-item a { position: relative; display: block; padding: 5px 0 5px 14px; font-size: 15px; color: var(--fr-text); text-decoration: none; line-height: 1.4; }
.fr-region-list .elementor-icon-list-item a::before { content: ""; position: absolute; left: 0; top: calc(50% - 2.5px); width: 5px; height: 5px; border-radius: 50%; background: #9fb4ca; }
.fr-region-list .elementor-icon-list-item a:hover { color: var(--fr-navy); text-decoration: underline; text-underline-offset: 3px; }
.fr-region-list .elementor-icon-list-text { color: inherit; padding: 0 !important; }

/* FAQ (Elementor nested accordion) */
.fr-help-box { background: var(--fr-sky); border-radius: var(--fr-r); }
.fr-faq .e-n-accordion { border-top: 1px solid var(--fr-line); }
.fr-faq .e-n-accordion-item { border-bottom: 1px solid var(--fr-line); }
.fr-faq .e-n-accordion-item-title {
  padding: 22px 4px !important; border: 0 !important; background: transparent !important; gap: 20px; justify-content: space-between !important; cursor: pointer; min-height: 56px; align-items: center;
}
.fr-faq .e-n-accordion-item-title-text { font-family: var(--fr-head); font-size: 19px; font-weight: 800; color: var(--fr-ink); letter-spacing: -.01em; line-height: 1.35; margin: 0; }
.fr-faq .e-n-accordion-item-title:hover .e-n-accordion-item-title-text { color: var(--fr-navy); }
.fr-faq .e-n-accordion-item-title-icon { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--fr-line); display: grid !important; place-items: center; flex: none; color: var(--fr-navy); transition: background-color var(--fr-ease), border-color var(--fr-ease), color var(--fr-ease); }
.fr-faq .e-n-accordion-item-title-icon svg { width: 18px; height: 18px; }
.fr-faq .e-n-accordion-item[open] > .e-n-accordion-item-title .e-n-accordion-item-title-icon { background: var(--fr-navy); border-color: var(--fr-navy); color: #fff; }
.fr-faq .e-n-accordion-item > .e-con { border: 0 !important; padding: 0 60px 24px 4px !important; background: transparent !important; }
.fr-faq .e-n-accordion-item > .e-con p { color: var(--fr-muted); font-size: 16px; line-height: 1.65; margin: 0; }
.fr-faq .e-n-accordion-item > .e-con a { color: var(--fr-navy); font-weight: 600; }

/* CTA panel */
.fr-cta-panel { position: relative; overflow: hidden; border-radius: 28px; background: var(--fr-navy); color: #fff; }
.fr-cta-panel::before, .fr-cta-panel::after { content: ""; position: absolute; border: 2px solid rgba(255,255,255,.07); border-radius: 50%; pointer-events: none; }
.fr-cta-panel::before { width: 520px; height: 520px; right: -160px; top: -220px; }
.fr-cta-panel::after { width: 360px; height: 360px; right: -80px; top: -140px; }
.fr-cta-panel > * { position: relative; z-index: 1; }
.fr-cta-panel h2.elementor-heading-title { color: #fff; }
.fr-cta-text, .fr-cta-text p { color: #c9d6e8; font-size: 18px; line-height: 1.6; max-width: 540px; margin: 0; }
.fr-ec { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.14); border-radius: var(--fr-r); }
.fr-ec-head .elementor-heading-title { display: flex; align-items: center; gap: 12px; font-family: var(--fr-head); font-weight: 800; font-size: 18px; color: #fff; line-height: 1.3; }
.fr-ec-head .elementor-heading-title::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--fr-red); flex: none; animation: fr-pulse 2s ease-out infinite; }
.fr-ec-text, .fr-ec-text p { color: #c9d6e8; font-size: 15px; margin: 0; line-height: 1.55; }
.fr-ec-phone .elementor-heading-title { font-family: var(--fr-head); font-size: 32px; font-weight: 800; letter-spacing: -.02em; line-height: 1.1; }
.fr-ec-phone .elementor-heading-title a { color: #fff; text-decoration: none; }
.fr-ec-phone .elementor-heading-title a:hover { color: #ffc7b9; }

/* Request section */
.fr-contact-row .elementor-icon-box-wrapper { display: flex; align-items: center; gap: 14px; text-align: start; }
.fr-contact-row .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; }
.fr-contact-row .elementor-icon { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-sky); color: var(--fr-navy); font-size: 22px; }
.fr-contact-row .elementor-icon svg { width: 22px; height: 22px; }
.fr-contact-row .elementor-icon-box-content { display: flex; flex-direction: column; }
.fr-contact-row .elementor-icon-box-title { order: 2; margin: 0; font-family: var(--fr-head); font-size: 17px; font-weight: 800; color: var(--fr-ink); line-height: 1.3; word-break: break-word; }
.fr-contact-row .elementor-icon-box-title a { color: inherit; text-decoration: none; }
.fr-contact-row .elementor-icon-box-title a:hover { color: var(--fr-red); }
.fr-contact-row .elementor-icon-box-description { order: 1; margin: 0; font-size: 13px; font-weight: 600; color: var(--fr-muted); line-height: 1.3; }
.fr-next { background: var(--fr-sky-2); border: 1px solid var(--fr-line); border-radius: var(--fr-r); }
.fr-next ol { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; counter-reset: frns; }
.fr-next li { counter-increment: frns; display: flex; gap: 12px; font-size: 15px; color: var(--fr-text); line-height: 1.5; }
.fr-next li::before { content: counter(frns); width: 24px; height: 24px; border-radius: 50%; background: var(--fr-navy); color: #fff; font-size: 13px; font-weight: 800; display: grid; place-items: center; flex: none; margin-top: 1px; }

/* ==========================================================================
   Footer (UAE template)
   ========================================================================== */
.fr-footer { background: var(--fr-navy-900); color: #b9c7da; font-size: 15px; }
.fr-footer-cta { border-bottom: 1px solid rgba(255,255,255,.1); }
.fr-footer-cta-title .elementor-heading-title { display: flex; align-items: center; gap: 12px; font-family: var(--fr-head); color: #fff; font-size: 20px; font-weight: 800; letter-spacing: -.01em; line-height: 1.3; }
.fr-footer-cta-title .elementor-heading-title::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--fr-red); flex: none; animation: fr-pulse 2s ease-out infinite; }
.fr-footer-logo { display: inline-block; width: auto !important; background: #fff; border-radius: 12px; padding: 12px 16px; }
.fr-footer-logo img { height: 36px; width: auto; display: block; }
.fr-footer-about, .fr-footer-about p { color: #b9c7da; line-height: 1.6; max-width: 320px; margin: 0; }
.fr-footer-contact .elementor-icon-list-item { padding: 5px 0 !important; margin: 0 !important; }
.fr-footer-contact .elementor-icon-list-item::after { display: none !important; }
.fr-footer-contact .elementor-icon-list-item, .fr-footer-contact .elementor-icon-list-item a, .fr-footer-contact .elementor-icon-list-text { color: #fff; font-weight: 600; text-decoration: none; align-items: flex-start; }
.fr-footer-contact .elementor-icon-list-item a:hover .elementor-icon-list-text { color: #ffb6a4; }
.fr-footer-contact .elementor-icon-list-icon { color: #7f9cc0; padding-top: 2px; }
.fr-footer-contact .elementor-icon-list-icon svg { width: 17px !important; height: 17px !important; }
.fr-footer-contact .elementor-icon-list-text { padding-left: 10px !important; }
.fr-footer-h .elementor-heading-title { font-family: var(--fr-head); font-size: 13px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #fff; line-height: 1.3; }
.fr-footer-links .elementor-icon-list-item { padding: 0 !important; margin: 0 !important; }
.fr-footer-links .elementor-icon-list-item::after { display: none !important; }
.fr-footer-links .elementor-icon-list-items { display: grid; gap: 2px; }
.fr-footer-links .elementor-icon-list-icon { display: none; }
.fr-footer-links .elementor-icon-list-item a { display: block; padding: 4px 0; color: #b9c7da; text-decoration: none; line-height: 1.45; }
.fr-footer-links .elementor-icon-list-item a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.fr-footer-links .elementor-icon-list-text { color: inherit; padding: 0 !important; }
.fr-footer-bottom { border-top: 1px solid rgba(255,255,255,.1); }
.fr-footer-bottom .hfe-copyright-wrapper, .fr-footer-bottom .hfe-copyright-wrapper a, .fr-copyright, .fr-copyright p { color: #8fa2bb; font-size: 14px; margin: 0; }
.fr-legal .elementor-icon-list-items { gap: 6px 20px; }
.fr-legal .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.fr-legal .elementor-icon-list-item::after { display: none !important; }
.fr-legal .elementor-icon-list-icon { display: none; }
.fr-legal .elementor-icon-list-item a { color: #8fa2bb; font-size: 14px; text-decoration: none; padding: 4px 0; }
.fr-legal .elementor-icon-list-item a:hover { color: #fff; }
.fr-legal .elementor-icon-list-text { color: inherit; padding: 0 !important; }

/* ==========================================================================
   Responsive component adjustments
   ========================================================================== */
@media (max-width: 1024px) {
  .fr-trust-item:nth-child(3) { border-left: 0; }
  .fr-trust-item:nth-child(n+3) { border-top: 1px solid var(--fr-line-2); }
  .fr-steps::before { top: 32px; bottom: 32px; left: 31px; right: auto; width: 3px; height: auto; background: linear-gradient(180deg, var(--fr-navy), var(--fr-blue-400)); }
  .fr-step { text-align: start; display: grid !important; grid-template-columns: 64px 1fr; column-gap: 22px; row-gap: 6px !important; }
  .fr-step > .fr-step-num { grid-row: span 2; }
  .fr-step-num .elementor-heading-title { margin: 0; }
  .fr-step .fr-card-title { align-self: end; padding-top: 8px; }
  .fr-region:nth-child(3) { border-left: 0; }
  .fr-region:nth-child(n+3) { border-top: 1px solid var(--fr-line-2); }
  .fr-why-media { aspect-ratio: 16 / 9; }
  .fr-rv-grid > .fr-rv-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .fr-lead, .fr-lead p { font-size: 17px; }
  .fr-hero-lede, .fr-hero-lede p { font-size: 17px; }
  .fr-trust-item { padding: 16px 18px; }
  .fr-trust-item + .fr-trust-item { border-left: 0; border-top: 1px solid var(--fr-line-2); }
  .fr-trust-item .elementor-icon { width: 42px; height: 42px; }
  .fr-tick .elementor-icon-list-items { grid-template-columns: 1fr; }
  .fr-proof .elementor-icon-list-items { grid-template-columns: 1fr 1fr; gap: 12px 14px; }
  .fr-proof .elementor-icon-list-item { font-size: 14px; align-items: flex-start !important; }
  .fr-segment-title .elementor-heading-title { font-size: 24px; }
  .fr-faq .e-n-accordion-item-title-text { font-size: 17px; }
  .fr-faq .e-n-accordion-item > .e-con { padding-right: 8px !important; }
  .fr-btn--block-m, .fr-btn--block-m .elementor-button { width: 100%; }
  .fr-region + .fr-region { border-left: 0; border-top: 1px solid var(--fr-line-2); }
  .fr-ec-phone .elementor-heading-title { font-size: 28px; }
  .fr-form-card--full .gform_wrapper.gravity-theme .gform_footer input[type="submit"] { width: 100%; }
  .fr-form-card .gform_wrapper.gravity-theme .gfield--width-half { grid-column: span 12; }
  .fr-rating { width: 100%; }
}
@media (max-width: 400px) {
  .fr-proof .elementor-icon-list-items { grid-template-columns: 1fr; }
}
@media (hover: none) { .fr-svc-card:hover, .fr-problem:hover, .fr-btn .elementor-button:hover { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .fr-pulse, .fr-pill .elementor-heading-title::before, .fr-ec-head .elementor-heading-title::before, .fr-footer-cta-title .elementor-heading-title::before { animation: none; }
  .fr-svc-card, .fr-svc-media img, .fr-problem, .fr-btn .elementor-button { transition: none; }
}

/* ---------- v1.1 QA fixes ---------- */
.fr-faq .e-n-accordion-item-title { flex-direction: row !important; }
.fr-faq .e-n-accordion-item-title-header { flex: 1 1 auto; order: 1; justify-content: flex-start !important; text-align: start; }
.fr-faq .e-n-accordion-item-title-icon { order: 2; }
.fr-benefit .elementor-icon-box-wrapper { text-align: start !important; }
.fr-benefit .elementor-icon-box-icon { display: flex !important; justify-content: flex-start; }
.fr-rv-text blockquote { margin: 18px 0 0; padding: 0; border: 0; quotes: none; font-style: normal; }
.fr-tick .elementor-icon-list-items { align-items: start; }
.fr-tick .elementor-icon-list-item { display: flex !important; }
.fr-svc-media > .elementor-widget-image, .fr-svc-media > .elementor-widget-image a { width: 100%; height: 100%; }
.fr-segment-media > .elementor-widget-image { position: absolute; inset: 0; }
.fr-footer-logo { align-self: flex-start; }
.fr-form-card .gform_required_legend { display: none !important; }
.fr-form-card .ginput_container_date { display: block !important; }
.fr-form-card .ginput_container_date .ui-datepicker-trigger, .fr-form-card .ginput_container_date img, .fr-form-card .ginput_container_date .gform-datepicker__icon { display: none !important; }
.fr-form-card .ginput_container_date input.datepicker { width: 100% !important; }
.fr-steps::before { left: auto; right: auto; inset-inline: 10%; width: auto; }
@media (max-width: 1024px) { .fr-steps::before { inset-inline: 31px auto; width: 3px; } }
.fr-hdr-actions .elementor-widget-icon-box { width: auto; }
.e-con.fr-grow { --width: auto !important; width: auto !important; flex: 1 1 0% !important; min-width: 0; }
.fr-mainbar .fr-nav { flex: 1 1 auto !important; min-width: 0; }
@media (min-width: 1025px) and (max-width: 1280px) {
  .fr-mainbar > .e-con-inner { gap: 14px !important; }
  .fr-hdr-actions { gap: 12px !important; }
  .fr-nav .hfe-nav-menu > li { margin: 0; }
  .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a, .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding: 10px 7px; font-size: 14px; }
  .fr-logo img { height: 38px; }
  .fr-hdr-phone .elementor-icon-box-title { font-size: 15px; }
  .fr-hdr-cta .elementor-button { padding: 0 14px; }
}
/* Nav fit + chevrons (UAE's icon-font arrow isn't loaded) */
@media (min-width: 1025px) { .fr-nav .hfe-nav-menu__layout-horizontal .hfe-nav-menu { display: flex; flex-wrap: nowrap; } }
.fr-nav .sub-arrow i.fa { display: none; }
.fr-nav .hfe-nav-menu .sub-arrow { display: inline-flex; align-items: center; padding: 0 0 0 5px !important; margin: 0; border: 0 !important; }
.fr-nav .hfe-nav-menu .sub-arrow::after {
  content: ""; width: 14px; height: 14px; background: currentColor; transition: transform var(--fr-ease);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
}
.fr-nav .hfe-nav-menu > li:hover .sub-arrow::after, .fr-nav .hfe-nav-menu li.sub-menu-active > .hfe-has-submenu-container .sub-arrow::after { transform: rotate(180deg); }
@media (min-width: 1025px) {
  .fr-mainbar > .e-con-inner { gap: 20px !important; }
  .fr-nav .hfe-nav-menu > li { margin: 0 !important; }
  .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a, .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding: 10px 10px; white-space: nowrap; }
}
@media (max-width: 1024px) { .fr-nav .hfe-nav-menu .sub-arrow { padding: 8px !important; } .fr-nav .hfe-nav-menu .sub-arrow::after { width: 18px; height: 18px; } }
.fr-hdr-phone a, .fr-contact-row .elementor-icon-box-title a { display: inline-block; padding: 3px 0; }
@media (min-width: 1025px) {
  .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a.hfe-menu-item, .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding-left: 10px !important; padding-right: 10px !important; }
}
@media (min-width: 1025px) and (max-width: 1280px) {
  .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a.hfe-menu-item, .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding-left: 7px !important; padding-right: 7px !important; }
}
.fr-form-card .ginput_container_date { position: relative; }
.fr-form-card .ginput_container_date input.datepicker { padding-right: 52px !important; }
.fr-form-card .ginput_container_date .gform-datepicker-toggle {
  position: absolute !important; right: 6px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; margin: 0 !important; padding: 0 !important;
  display: grid !important; place-items: center; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--fr-navy) !important; border-radius: 8px; cursor: pointer;
}
.fr-form-card .ginput_container_date .gform-datepicker-toggle:hover { background: var(--fr-sky) !important; }
.fr-form-card .ginput_container_date .gform-datepicker-toggle .gform-calendar-icon { color: var(--fr-navy); font-size: 20px; width: 20px; height: 20px; }
/* Mobile header order: logo | call | hamburger */
@media (max-width: 1024px) {
  .fr-mainbar .fr-nav { order: 3; flex: 0 0 auto !important; }
  .fr-mainbar .fr-hdr-actions { order: 2; margin-left: auto; }
}
/* Icon boxes keep their inline layout on small screens */
.fr-trust-item .elementor-icon-box-wrapper, .fr-problem .elementor-icon-box-wrapper, .fr-contact-row .elementor-icon-box-wrapper, .fr-hdr-phone .elementor-icon-box-wrapper, .fr-float-card .elementor-icon-box-wrapper { flex-direction: row !important; text-align: start !important; }
.fr-legal .elementor-icon-list-items { margin: 0 !important; }
.fr-legal .elementor-icon-list-item { margin-inline: 0 !important; }
.fr-topbar-links .elementor-icon-list-items { margin: 0 !important; }
@media (max-width: 1024px) {
  .fr-mainbar .fr-nav { width: auto !important; --container-widget-width: auto; max-width: none; }
  .fr-mainbar .fr-nav .hfe-nav-menu__toggle { margin-left: 0; }
  .fr-rating { align-self: flex-start; }
}
@media (max-width: 1140px) { .fr-topbar-links .elementor-icon-list-item:nth-child(n+2) { display: none !important; } }
@media (max-width: 1024px) {
  .fr-mainbar { position: relative; }
  .fr-mainbar > .e-con-inner, .fr-mainbar .fr-nav, .fr-mainbar .fr-nav .elementor-widget-container, .fr-mainbar .fr-nav .hfe-nav-menu { position: static !important; }
  .fr-mainbar .fr-nav nav.hfe-dropdown { position: absolute !important; left: 0 !important; right: 0 !important; width: auto !important; top: 100% !important; z-index: 1000; }
}
@media (max-width: 1024px) {
  .fr-nav nav.hfe-dropdown ul.hfe-nav-menu { display: block !important; }
  .fr-nav nav.hfe-dropdown ul.hfe-nav-menu > li { display: block !important; width: 100%; margin: 0 !important; }
  .fr-nav nav.hfe-dropdown .hfe-has-submenu-container, .fr-nav nav.hfe-dropdown li > a.hfe-menu-item { width: 100%; }
  .fr-nav nav.hfe-dropdown .hfe-has-submenu-container > a.hfe-menu-item { display: flex; justify-content: space-between; align-items: center; }
  .fr-nav nav.hfe-dropdown .sub-menu { position: static !important; width: auto !important; box-shadow: none !important; border: 0 !important; column-count: 1 !important; }
  .fr-nav nav.hfe-dropdown .sub-menu li { display: block; }
}

/* ==========================================================================
   v1.2 — Hero background photo + sticky "Why Fraser" image
   ========================================================================== */
/* Photo layer spans from ~40% of the viewport to the right edge, full hero height.
   The CSS mask fades it into the hero's light background (no visible seam). */
.fr-hero--photo > .e-con-inner { position: static; }
.fr-hero--photo::after { display: none; }
.fr-hero-photo {
  position: absolute !important; top: 0; right: 0; bottom: 0; width: 60% !important; max-width: none; z-index: 0; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.12) 12%, rgba(0,0,0,.45) 24%, rgba(0,0,0,.82) 36%, #000 48%), linear-gradient(180deg, #000 78%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.12) 12%, rgba(0,0,0,.45) 24%, rgba(0,0,0,.82) 36%, #000 48%), linear-gradient(180deg, #000 78%, transparent 100%);
          mask-composite: intersect;
}
.fr-hero-photo > .elementor-widget-image { width: 100% !important; height: 100%; }
.fr-hero-photo img { width: 100% !important; height: 100% !important; max-width: none; object-fit: cover; object-position: 62% 42%; display: block; }
.fr-hero-grid { position: relative; z-index: 1; }
/* Compact, substantial hero form card floating over the photo */
.fr-hero--photo .fr-form-card--hero { box-shadow: 0 2px 6px rgba(6,22,58,.06), 0 30px 70px rgba(6,22,58,.22); border-color: rgba(221,229,238,.9); }
@media (min-width: 1025px) {
  .fr-hero--photo .fr-form-card--hero { padding: 28px 28px 24px !important; }
  .fr-hero--photo .fr-form-card--hero .fr-form-title .elementor-heading-title { font-size: 25px; }
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme .gform_fields { grid-row-gap: 12px; grid-column-gap: 12px; }
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme input[type="text"],
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme input[type="tel"],
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme input[type="email"],
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme select { min-height: 46px; padding-top: 10px; padding-bottom: 10px; }
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme textarea { min-height: 90px; height: 90px; }
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme .gform_footer input[type="submit"] { min-height: 52px; }
  .fr-hero--photo .fr-form-card--hero .gform_wrapper.gravity-theme .gform_footer { margin-top: 14px; }
}
/* Tablet: quieter photo behind the upper-right area */
@media (max-width: 1024px) {
  .fr-hero-photo { width: 62% !important; bottom: auto; height: 620px; opacity: .38;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.5) 30%, #000 60%), linear-gradient(180deg, #000 55%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.5) 30%, #000 60%), linear-gradient(180deg, #000 55%, transparent 100%); }
}
/* Phones: no background photo — content, buttons, form stack cleanly */
@media (max-width: 767px) { .fr-hero-photo { display: none !important; } }

/* Why Fraser: sticky image card on desktop (overrides the later position:relative) */
@media (min-width: 1025px) {
  .fr-why-media.fr-sticky-aside { position: sticky; top: calc(var(--fr-header-h) + 32px); align-self: start; }
}
@media (max-width: 1024px) {
  .fr-hero-photo { width: 50% !important; height: 600px; opacity: .3;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 35%, #000 75%), linear-gradient(180deg, #000 50%, transparent 100%);
            mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.35) 35%, #000 75%), linear-gradient(180deg, #000 50%, transparent 100%); }
  .fr-hero-photo img { object-position: 45% 40%; }
}

/* ---------- v1.3 — Gravity Forms 3.1 datepicker skin + stacking ---------- */
.fr-hero--photo { overflow: visible; }
.fr-hero-grid { z-index: 4; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar {
  top: calc(100% + 6px) !important; left: 0 !important; right: auto !important; bottom: auto !important;
  width: 316px; max-width: calc(100vw - 32px); padding: 12px; z-index: 1000;
  background: #fff; border: 1px solid var(--fr-line); border-radius: 16px; box-shadow: var(--fr-sh-lg);
}
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar table.calendar { width: 100%; margin: 0; border: 0 !important; border-collapse: separate; border-spacing: 2px; table-layout: fixed; background: none; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td,
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar th {
  border: 0 !important; padding: 0 !important; height: 36px; text-align: center; vertical-align: middle; background: none;
  font-family: var(--fr-body); font-size: 14px; font-weight: 500; color: var(--fr-ink); border-radius: 10px; box-shadow: none !important;
}
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar th, .fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar thead td { font-size: 12px; font-weight: 700; color: var(--fr-muted); text-transform: uppercase; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day { cursor: pointer; transition: background-color var(--fr-ease), color var(--fr-ease); }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day:hover, .fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day:focus { background: var(--fr-sky); color: var(--fr-navy); outline: none; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day[class*="cur"],
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day[class*="select"],
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day[aria-selected="true"] { background: var(--fr-navy) !important; color: #fff !important; font-weight: 700; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day[class*="today"] { box-shadow: inset 0 0 0 1.5px var(--fr-red) !important; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.day span, .fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.nav span { background: none !important; border: 0 !important; box-shadow: none !important; width: auto; height: auto; color: inherit; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.nav { color: var(--fr-navy); cursor: pointer; font-size: 18px; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar td.nav:hover { background: var(--fr-sky); }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar select {
  min-height: 36px !important; height: 36px; width: 100%; padding: 4px 30px 4px 10px !important; margin: 0 !important;
  font-size: 14px; font-weight: 700; color: var(--fr-navy); border-radius: 10px; border: 1px solid var(--fr-line); background-color: #fff; background-position: right 8px center; background-size: 16px;
}
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar .monthMessage { font-size: 12px; color: var(--fr-muted); text-align: center; margin: 6px 0 0; }
.fr-form-card .gform_wrapper.gravity-theme .gform-datepicker-calendar .monthMessage p { margin: 0; }
.fr-hero--photo > .e-con-inner { z-index: auto; }

/* ---------- v1.4 — "What's going on" section: equal-height columns (desktop only) ---------- */
@media (min-width: 1025px) {
  .fr-problems-grid { align-items: stretch !important; }
  .fr-problems-grid > .fr-problems-intro { position: static; align-self: stretch; }
  .fr-problem-list { align-self: stretch; height: 100%; grid-template-rows: repeat(4, minmax(0, 1fr)) !important; grid-auto-rows: minmax(0, 1fr); align-content: stretch; row-gap: 16px !important; }
  .fr-problem-list > .fr-problem { height: 100%; min-height: 96px; padding-top: 20px; padding-bottom: 20px; }
}

/* ==========================================================================
   v1.5 — Service pages (hub, standard service, higher-urgency service)
   Reuses the homepage tokens/components; new pieces are prefixed fr- as before.
   ========================================================================== */
/* Hero */
.fr-hero--svc .fr-h1--svc .elementor-heading-title { max-width: 16ch; font-size: clamp(36px, 4.4vw, 54px); }
.fr-hero--svc .fr-hero-lede, .fr-hero--svc .fr-hero-lede p { font-size: 18px; max-width: 600px; }
.fr-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 14px; line-height: 1.4; color: var(--fr-muted); }
.fr-crumbs li { display: inline-flex; align-items: center; }
.fr-crumbs li + li::before { content: ""; width: 14px; height: 14px; margin: 0 8px; background: #9aabbe; flex: none;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat; }
.fr-crumbs a { color: var(--fr-navy); font-weight: 600; text-decoration: none; }
.fr-crumbs a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fr-crumbs [aria-current] { color: var(--fr-ink); font-weight: 600; }
.fr-crumbs p, .fr-crumbs nav { margin: 0; }
/* Phones: the service photo shows as a banner above the copy instead of a faded background */
@media (max-width: 767px) {
  .fr-hero--svc .fr-hero-photo { display: block !important; position: relative !important; inset: auto; width: 100% !important; height: 200px; opacity: 1; margin: 0 0 22px; border-radius: var(--fr-r); overflow: hidden; box-shadow: var(--fr-sh-md); -webkit-mask-image: none; mask-image: none; }
  .fr-hero--svc .fr-hero-photo img { object-position: 50% 50%; }
  .fr-hero--svc .fr-h1--svc .elementor-heading-title { font-size: 34px; }
}
@media (min-width: 768px) and (max-width: 1024px) { .fr-hero--svc .fr-hero-photo { height: 520px; } }

/* Quick-answer cards */
.fr-answer { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-sm); height: 100%; }
.fr-answer-icon .elementor-icon { width: 48px; height: 48px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-navy); color: #fff; font-size: 22px; }
.fr-answer-icon .elementor-icon svg { width: 22px; height: 22px; }
.fr-answer-icon .elementor-icon-wrapper { text-align: start; line-height: 0; }
.fr-answer .fr-card-title .elementor-heading-title { font-size: 20px; }
.fr-answers { margin-top: 4px; }

/* Prose (long-form content) */
.fr-prose p { margin: 0 0 14px; }
.fr-prose p:last-child { margin-bottom: 0; }
.fr-prose a { color: var(--fr-navy); font-weight: 600; text-decoration: underline; text-decoration-color: var(--fr-blue-100); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.fr-prose a:hover { color: var(--fr-red); text-decoration-color: currentColor; }
.fr-sp-text, .fr-sp-text p { font-size: 17px; line-height: 1.7; color: var(--fr-text); }
.fr-sp-h3 .elementor-heading-title { font-family: var(--fr-head); font-size: 23px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: var(--fr-ink); }
.fr-article-main > .fr-sp-h3 { margin-top: 34px; padding-top: 30px; border-top: 1px solid var(--fr-line-2); }
.fr-article-main > .fr-sp-h3 + .fr-sp-text { margin-top: 12px; }
.fr-figure { border-radius: var(--fr-r-lg); overflow: hidden; background: #fff; border: 1px solid var(--fr-line); box-shadow: var(--fr-sh-md); }
.fr-figure .elementor-widget-image, .fr-figure img { width: 100% !important; display: block; }
.fr-figure img { aspect-ratio: 4 / 3; object-fit: cover; height: auto; }
.fr-figure-cap, .fr-figure-cap p { font-size: 14px; line-height: 1.5; color: var(--fr-muted); margin: 0; padding: 12px 16px 14px; }
.fr-callout { background: var(--fr-sky); border: 1px solid var(--fr-line-2); border-radius: var(--fr-r); }
.fr-callout--list { background: #fff; border-color: var(--fr-line); box-shadow: var(--fr-sh-sm); }
.fr-callout--red { background: #fff; border: 1px solid var(--fr-line); border-left: 4px solid var(--fr-red); }
.fr-callout .fr-card-title .elementor-heading-title { font-size: 18px; }

/* Signs grid (non-link icon cards) */
.fr-sign { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); padding: 20px 22px; height: 100%; }
.fr-sign .elementor-icon-box-wrapper { display: flex; align-items: flex-start; gap: 16px; text-align: start; }
.fr-sign .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; flex: none; }
.fr-sign .elementor-icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-red-50); color: var(--fr-red); font-size: 22px; }
.fr-sign .elementor-icon svg { width: 22px; height: 22px; }
.fr-sign .elementor-icon-box-title { margin: 2px 0 0; font-family: var(--fr-head); font-size: 17px; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; color: var(--fr-ink); }
.fr-sign .elementor-icon-box-description { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--fr-muted); }
.fr-sign .elementor-icon-box-description a { color: var(--fr-navy); font-weight: 700; }
.fr-sign--step .elementor-icon { background: var(--fr-sky); color: var(--fr-navy); }

/* Urgent band */
.fr-urgent { background: #fff; border: 1px solid #f3c9bd; border-left: 5px solid var(--fr-red); border-radius: var(--fr-r); box-shadow: var(--fr-sh-md); }
.fr-urgent-icon .elementor-icon { width: 58px; height: 58px; border-radius: 16px; display: grid; place-items: center; background: var(--fr-red); color: #fff; font-size: 28px; }
.fr-urgent-icon .elementor-icon svg { width: 28px; height: 28px; }
.fr-urgent-icon .elementor-icon-wrapper { line-height: 0; }
.fr-urgent-title .elementor-heading-title { font-family: var(--fr-head); font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: var(--fr-ink); }
.fr-urgent .fr-card-text, .fr-urgent .fr-card-text p { font-size: 16px; color: var(--fr-text); }
.fr-urgent .fr-card-text strong { color: var(--fr-ink); }
@media (max-width: 1024px) { .fr-urgent > .elementor-widget-button { grid-column: 1 / -1; } }

/* Why Fraser (concise) */
.fr-why-grid { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-sm); overflow: hidden; }
.fr-why-item { padding: 24px; border-bottom: 1px solid var(--fr-line-2); }
.fr-why-item:nth-child(odd) { border-right: 1px solid var(--fr-line-2); }
.fr-why-item:nth-last-child(-n+2) { border-bottom: 0; }
.fr-why-item .elementor-icon-box-wrapper { display: flex; align-items: flex-start; gap: 14px; text-align: start; }
.fr-why-item .elementor-icon-box-icon { margin: 0 !important; display: inline-flex; flex: none; }
.fr-why-item .elementor-icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--fr-red-50); color: var(--fr-red); font-size: 21px; }
.fr-why-item .elementor-icon svg { width: 21px; height: 21px; }
.fr-why-item .elementor-icon-box-title { margin: 0; font-family: var(--fr-head); font-size: 17px; font-weight: 800; line-height: 1.3; color: var(--fr-ink); }
.fr-why-item .elementor-icon-box-description { margin: 5px 0 0; font-size: 15px; line-height: 1.5; color: var(--fr-muted); }
@media (max-width: 767px) {
  .fr-why-item, .fr-why-item:nth-child(odd) { border-right: 0; border-bottom: 1px solid var(--fr-line-2); }
  .fr-why-item:nth-last-child(2) { border-bottom: 1px solid var(--fr-line-2); }
  .fr-why-item:last-child { border-bottom: 0; }
}

/* Related: resource card */
.fr-resource { background: var(--fr-navy); border-radius: var(--fr-r); color: #fff; height: 100%; }
.fr-resource .fr-card-title .elementor-heading-title { color: #fff; }
.fr-resource .fr-card-text, .fr-resource .fr-card-text p { color: #c9d6e8; }
.fr-resource .fr-answer-icon .elementor-icon { background: rgba(255,255,255,.12); }
.fr-resource-links .elementor-icon-list-items { display: grid; gap: 4px; }
.fr-resource-links .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.fr-resource-links .elementor-icon-list-item::after { display: none !important; }
.fr-resource-links .elementor-icon-list-item a { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 10px 0; border-top: 1px solid rgba(255,255,255,.14); font-family: var(--fr-head); font-weight: 800; font-size: 15px; color: #fff; text-decoration: none; }
.fr-resource-links .elementor-icon-list-item a:hover { color: #ffb3a1; }
.fr-resource-links .elementor-icon-list-icon { order: 2; color: #ff9c85; padding: 0; }
.fr-resource-links .elementor-icon-list-icon svg { width: 18px !important; height: 18px !important; }
.fr-resource-links .elementor-icon-list-text { color: inherit; padding: 0 !important; }

/* Service areas (compact) */
.fr-areas-mini { background: var(--fr-sky-2); border: 1px solid var(--fr-line); border-radius: var(--fr-r-lg); }
.fr-h2-sm .elementor-heading-title { font-size: clamp(28px, 3vw, 36px); }
.fr-area-chips .elementor-icon-list-items { display: flex !important; flex-wrap: wrap; gap: 10px; }
.fr-area-chips .elementor-icon-list-item { margin: 0 !important; padding: 0 !important; }
.fr-area-chips .elementor-icon-list-item::after { display: none !important; }
.fr-area-chips .elementor-icon-list-item a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px 8px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--fr-line); font-size: 15px; font-weight: 600; color: var(--fr-navy); text-decoration: none; transition: border-color var(--fr-ease), box-shadow var(--fr-ease); }
.fr-area-chips .elementor-icon-list-item a:hover { border-color: var(--fr-navy); box-shadow: var(--fr-sh-sm); }
.fr-area-chips .elementor-icon-list-icon { color: var(--fr-red); padding: 0; margin: 0 !important; }
.fr-area-chips .elementor-icon-list-icon svg { width: 16px !important; height: 16px !important; }
.fr-area-chips .elementor-icon-list-text { color: inherit; padding: 0 !important; }

/* Hub: service groups */
.fr-group-head { border-bottom: 1px solid var(--fr-line); padding-bottom: 12px; }
.fr-group-title .elementor-heading-title { font-family: var(--fr-head); font-size: 22px; font-weight: 800; letter-spacing: -.015em; color: var(--fr-ink); white-space: nowrap; }
.fr-group-head .fr-card-text { flex: 1 1 auto; }
@media (max-width: 767px) { .fr-group-title .elementor-heading-title { white-space: normal; font-size: 20px; } }

.fr-hidden-widget { display: none !important; }

/* Article aside: two columns on tablet so supporting photos stay a sensible size */
@media (min-width: 768px) and (max-width: 1024px) {
  .fr-article-aside { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .fr-article-aside > .fr-figure { grid-row: span 2; }
}
@media (max-width: 767px) { .fr-figure img { aspect-ratio: 16 / 10; } }

/* ==========================================================================
   v1.6 (2026-09-25 restore): Gravity Forms LEGACY markup skin.
   The fresh clone's real forms (#3 "Service Request" hero, #5 its page-bottom
   duplicate) use legacy markup (.gform_legacy_markup_wrapper, <ul>/<li>) with
   hidden labels and placeholders. Same look as the approved gravity-theme skin.
   ========================================================================== */
.fr-form-card .gform_legacy_markup_wrapper { margin: 0; max-width: none; }
.fr-form-card .gform_legacy_markup_wrapper form { margin: 0; }
.fr-form-card .gform_legacy_markup_wrapper .gform_body { width: 100% !important; }
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields {
  display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px; margin: 0 !important; padding: 0 !important; list-style: none;
}
.fr-form-card--full .gform_legacy_markup_wrapper ul.gform_fields { gap: 18px; }
.fr-hero--photo .fr-form-card--hero .gform_legacy_markup_wrapper ul.gform_fields { gap: 12px; }
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield {
  float: none !important; clear: none !important; width: auto !important; max-width: none !important;
  margin: 0 !important; padding: 0 !important; display: block; grid-column: span 2; list-style: none;
}
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield::before { content: none; }
.fr-form-card .gform_legacy_markup_wrapper li.gform_validation_container { display: none !important; }
/* Name | Phone, Email | Service; description and date full width */
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield[id$="_5"],
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield[id$="_3"],
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield[id$="_2"],
.fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield[id$="_6"] { grid-column: span 1; }
/* Hidden labels stay available to screen readers */
.fr-form-card .gform_legacy_markup_wrapper .hidden_label > .gfield_label {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.fr-form-card .gform_legacy_markup_wrapper .ginput_container { margin: 0 !important; padding: 0 !important; position: relative; }
.fr-form-card .gform_legacy_markup_wrapper input[type="text"],
.fr-form-card .gform_legacy_markup_wrapper input[type="tel"],
.fr-form-card .gform_legacy_markup_wrapper input[type="email"],
.fr-form-card .gform_legacy_markup_wrapper select,
.fr-form-card .gform_legacy_markup_wrapper textarea {
  width: 100% !important; max-width: none; min-height: 50px; padding: 12px 15px !important; border-radius: 12px; margin: 0;
  border: 1.5px solid #cfdbe7; background-color: #fbfcfe; font-family: var(--fr-body); font-size: 16px !important; line-height: 1.4;
  color: var(--fr-ink); transition: border-color var(--fr-ease), box-shadow var(--fr-ease), background-color var(--fr-ease);
  -webkit-appearance: none; appearance: none; box-shadow: none;
}
.fr-form-card .gform_legacy_markup_wrapper textarea { min-height: 96px; height: 96px !important; resize: vertical; }
.fr-form-card--full .gform_legacy_markup_wrapper textarea { min-height: 130px; height: 130px !important; }
.fr-form-card .gform_legacy_markup_wrapper ::placeholder { color: #8b99ab; opacity: 1; }
.fr-form-card .gform_legacy_markup_wrapper input:focus,
.fr-form-card .gform_legacy_markup_wrapper select:focus,
.fr-form-card .gform_legacy_markup_wrapper textarea:focus { outline: none; border-color: var(--fr-navy); background-color: #fff; box-shadow: 0 0 0 4px rgba(0,32,91,.1); }
@media (min-width: 1025px) {
  .fr-hero--photo .fr-form-card--hero .gform_legacy_markup_wrapper input[type="text"],
  .fr-hero--photo .fr-form-card--hero .gform_legacy_markup_wrapper input[type="tel"],
  .fr-hero--photo .fr-form-card--hero .gform_legacy_markup_wrapper input[type="email"] { min-height: 46px; padding-top: 10px !important; padding-bottom: 10px !important; }
  .fr-hero--photo .fr-form-card--hero .gform_legacy_markup_wrapper textarea { min-height: 90px; height: 90px !important; }
}
/* Date picker (GF 3.1 calendar) */
.fr-form-card .gform_legacy_markup_wrapper .ginput_container_date { width: 100%; display: block; }
.fr-form-card .gform_legacy_markup_wrapper .ginput_container_date input.datepicker { width: 100% !important; padding-right: 52px !important; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-toggle {
  position: absolute !important; right: 6px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; margin: 0 !important; padding: 0 !important;
  display: grid !important; place-items: center; background: transparent !important; border: 0 !important; box-shadow: none !important;
  color: var(--fr-navy) !important; border-radius: 8px; cursor: pointer;
}
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-toggle:hover { background: var(--fr-sky) !important; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-toggle .gform-calendar-icon { display: none !important; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-toggle::before { content: ""; width: 20px; height: 20px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2300205b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18M8 14h.01M12 14h.01M16 14h.01M8 18h.01M12 18h.01M16 18h.01'/%3E%3C/svg%3E") center / 20px no-repeat; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar {
  top: calc(100% + 6px) !important; left: 0 !important; right: auto !important; bottom: auto !important; width: 316px; max-width: calc(100vw - 32px);
  padding: 12px; z-index: 1000; background: #fff; border: 1px solid var(--fr-line); border-radius: 16px; box-shadow: var(--fr-sh-lg);
}
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar table.calendar { width: 100%; margin: 0; border: 0 !important; border-collapse: separate; border-spacing: 2px; table-layout: fixed; background: none; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar td,
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar th { border: 0 !important; padding: 0 !important; height: 36px; text-align: center; vertical-align: middle; background: none; font-family: var(--fr-body); font-size: 14px; font-weight: 500; color: var(--fr-ink); border-radius: 10px; box-shadow: none !important; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar th,
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar thead td { font-size: 12px; font-weight: 700; color: var(--fr-muted); text-transform: uppercase; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar td.day { cursor: pointer; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar td.day:hover { background: var(--fr-sky); color: var(--fr-navy); }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar td.day[aria-selected="true"] { background: var(--fr-navy) !important; color: #fff !important; font-weight: 700; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar td.day[class*="today"] { box-shadow: inset 0 0 0 1.5px var(--fr-red) !important; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar td.nav { color: var(--fr-navy); cursor: pointer; font-size: 18px; }
.fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-calendar select { min-height: 36px !important; height: 36px; width: 100% !important; padding: 4px 30px 4px 10px !important; font-size: 14px !important; font-weight: 700; color: var(--fr-navy); border-radius: 10px; border: 1px solid var(--fr-line); background-color: #fff; }
/* Submit */
.fr-form-card .gform_legacy_markup_wrapper .gform_footer { margin: 16px 0 0 !important; padding: 0 !important; width: 100%; }
.fr-hero--photo .fr-form-card--hero .gform_legacy_markup_wrapper .gform_footer { margin-top: 14px !important; }
.fr-form-card .gform_legacy_markup_wrapper .gform_footer .gform_button {
  width: 100% !important; min-height: 54px; margin: 0 !important; padding: 0 24px; border: 0; border-radius: 12px; cursor: pointer;
  background: var(--fr-red); color: #fff; font-family: var(--fr-head); font-size: 17px; font-weight: 800; line-height: 1.2; letter-spacing: -.005em;
  box-shadow: 0 10px 24px rgba(218,63,31,.24); transition: background-color var(--fr-ease), transform var(--fr-ease);
}
.fr-form-card .gform_legacy_markup_wrapper .gform_footer .gform_button:hover,
.fr-form-card .gform_legacy_markup_wrapper .gform_footer .gform_button:focus-visible { background: var(--fr-red-600); transform: translateY(-1px); }
.fr-form-card .gform_legacy_markup_wrapper .gform_ajax_spinner { margin-left: 10px; }
/* Validation */
.fr-form-card .gform_legacy_markup_wrapper li.gfield.gfield_error,
.fr-form-card .gform_legacy_markup_wrapper li.gfield_error.gfield_contains_required { background: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; max-width: none !important; }
.fr-form-card .gform_legacy_markup_wrapper li.gfield_error input,
.fr-form-card .gform_legacy_markup_wrapper li.gfield_error textarea { border-color: var(--fr-red) !important; background-color: #fff; }
.fr-form-card .gform_legacy_markup_wrapper .validation_message { background: none !important; border: 0 !important; padding: 6px 0 0 !important; margin: 0 !important; font-size: 13px; font-weight: 600; color: var(--fr-red-600); }
.fr-form-card .gform_legacy_markup_wrapper .gform_validation_errors,
.fr-form-card .gform_legacy_markup_wrapper div.validation_error {
  border: 1px solid #f3c6ba !important; background: var(--fr-red-50) !important; border-radius: 12px; box-shadow: none; padding: 12px 16px !important; margin: 0 0 16px !important; width: 100%;
}
.fr-form-card .gform_legacy_markup_wrapper .gform_validation_errors > h2,
.fr-form-card .gform_legacy_markup_wrapper div.validation_error { font-family: var(--fr-body); font-size: 14px !important; font-weight: 700; color: var(--fr-red-600) !important; margin: 0; text-align: left; }
.fr-form-card .gform_legacy_markup_wrapper .gform_validation_errors > h2 { margin: 0 !important; line-height: 1.4; }
.fr-form-card .gform_legacy_markup_wrapper .gform_validation_errors > h2 .gform-icon,
.fr-form-card .gform_legacy_markup_wrapper .gform_validation_errors ol { display: none; }
/* Phones: one column */
@media (max-width: 767px) {
  .fr-form-card .gform_legacy_markup_wrapper ul.gform_fields { grid-template-columns: minmax(0, 1fr); }
  .fr-form-card .gform_legacy_markup_wrapper ul.gform_fields li.gfield { grid-column: 1 / -1 !important; }
}

/* v1.6 clone compatibility: U-Design Core's elementor.min.css narrows every boxed container's
   inner box by 40px at <=479px (.e-con-boxed>.e-con-inner{width:calc(100% - 40px ...)}).
   The redesign's sections, header and footer use their own 16px gutters. */
@media (max-width: 479px) {
  .fr-sec.e-con-boxed > .e-con-inner,
  #masthead .e-con-boxed > .e-con-inner,
  #colophon .e-con-boxed > .e-con-inner,
  .elementor:has(> .fr-sec) .e-con-boxed > .e-con-inner { width: 100%; }
}

/* v1.6: the clone form's own confirmation text ("Thanks for contacting us! ...") in the approved success style */
.fr-form-card .gform_confirmation_message {
  text-align: center; padding: 96px 8px 12px; position: relative;
  font-family: var(--fr-head); font-size: 20px; font-weight: 800; line-height: 1.35; color: var(--fr-ink);
}
.fr-form-card .gform_confirmation_message::before {
  content: ""; position: absolute; top: 16px; left: 50%; width: 64px; height: 64px; margin-left: -32px; border-radius: 50%;
  background: var(--fr-navy) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 30px no-repeat;
}

/* v1.6: link lists inside service-page prose (e.g. General Plumbing's service list) get a 24px+ tap target */
.fr-prose li > a, .fr-sp-text li > a { display: inline-block; padding-block: 3px; }
.fr-prose ul li, .fr-sp-text ul li { margin-bottom: 4px; }


/* ==========================================================================
   v1.7 — Phase 3 non-service pages (About, Reviews, FAQ, Contact, Service
   Request, service-area hubs, location pages). Additive only.
   ========================================================================== */
/* Page hero variants */
.fr-hero--page .fr-h1--svc .elementor-heading-title { max-width: 18ch; }
.fr-hero--plain .fr-h1--svc .elementor-heading-title { max-width: 22ch; }
.fr-hero--plain .fr-hero-lede, .fr-hero--plain .fr-hero-lede p { max-width: 680px; }
.fr-hero-lede a { color: var(--fr-navy); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.fr-hero-lede a:hover { color: var(--fr-red); }
/* Hero info card (non-form right column) */
.fr-info-card .fr-form-title .elementor-heading-title { font-size: 22px; }
.fr-info-card .fr-contact-row .elementor-icon-box-title { font-size: 16px; }
.fr-hero--photo .fr-info-card { box-shadow: 0 2px 6px rgba(6,22,58,.06), 0 30px 70px rgba(6,22,58,.2); }
/* Map embeds */
.fr-map { position: relative; border-radius: var(--fr-r-lg); overflow: hidden; border: 1px solid var(--fr-line); box-shadow: var(--fr-sh-md); background: var(--fr-sky); aspect-ratio: 4 / 3; }
.fr-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
@media (max-width: 767px) { .fr-map { aspect-ratio: 1 / 1; border-radius: var(--fr-r); } }
/* Grouped FAQ page */
.fr-faq-group { scroll-margin-top: calc(var(--fr-header-h) + 24px); }
.fr-faq-group-head { padding-bottom: 4px; }
.fr-faq-group-title .elementor-heading-title { font-family: var(--fr-head); font-size: 24px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: var(--fr-ink); }
.fr-faq-answer ul, .fr-faq-answer ol { margin: 0 0 12px; padding-left: 20px; }
.fr-faq-answer li { margin-bottom: 6px; }
.fr-faq-answer a { color: var(--fr-navy); font-weight: 700; }
.fr-faq-nav { margin-top: 26px; }
.fr-faq-nav .elementor-icon-list-item a { min-height: 40px; padding: 6px 14px; font-size: 14px; }
@media (max-width: 767px) { .fr-faq-group-title .elementor-heading-title { font-size: 21px; } }
/* Area directories (service-area hub) */
.fr-dir { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); padding: 24px 28px 22px; }
.fr-dir-head { border-bottom: 1px solid var(--fr-line-2); padding-bottom: 12px; }
.fr-dir-count p { margin: 0; font-size: 14px; color: var(--fr-muted); line-height: 1.3; }
.fr-dir-list .elementor-icon-list-items { display: block !important; columns: 4 190px; column-gap: 28px; }
.fr-dir-list .elementor-icon-list-item { break-inside: avoid; }
@media (max-width: 1024px) { .fr-dir-list .elementor-icon-list-items { columns: 3 170px; } }
@media (max-width: 767px) { .fr-dir { padding: 20px 18px; } .fr-dir-list .elementor-icon-list-items { columns: 2 130px; column-gap: 16px; } }
/* A–Z index (areas served) */
.fr-az { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); padding: 22px 24px; scroll-margin-top: calc(var(--fr-header-h) + 24px); }
.fr-az-nav .elementor-icon-list-item a { min-width: 44px; justify-content: center; padding: 8px 12px; font-family: var(--fr-head); font-weight: 800; }
/* Contact cards */
.fr-contact-card .elementor-icon-box-description a { color: var(--fr-navy); font-weight: 700; text-decoration: none; word-break: break-word; }
.fr-contact-card .elementor-icon-box-description a:hover { color: var(--fr-red); }
/* Capability + location service groups (navy resource cards) */
.fr-cap-card .fr-btn--outline .elementor-button { border-color: transparent; }
.fr-svc-group .fr-card-title .elementor-heading-title { font-size: 19px; }
/* Service request page: next steps */
.fr-next-steps > .elementor-widget-heading .elementor-heading-title { font-size: 18px; }
.fr-next-steps .fr-sign { padding: 16px 18px; }
/* Linked sign cards (location pages) */
.fr-sign .elementor-icon-box-title a { color: inherit; text-decoration: none; }
.fr-sign:has(a):hover { border-color: #c9d6e4; box-shadow: var(--fr-sh-sm); }


/* ---------- v1.7 Blog (Theme Builder templates: blog hub, archives, single post) ---------- */
.fr-blog-title .elementor-heading-title { max-width: 22ch; }
.fr-blog-grid .elementor-posts-container { grid-row-gap: 26px !important; grid-column-gap: 24px !important; }
.fr-blog-grid .elementor-post { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); overflow: hidden; box-shadow: var(--fr-sh-sm); transition: border-color var(--fr-ease), box-shadow var(--fr-ease), transform var(--fr-ease); }
.fr-blog-grid .elementor-post:hover { border-color: #c9d6e4; box-shadow: var(--fr-sh-md); transform: translateY(-2px); }
.fr-blog-grid .elementor-post__thumbnail__link { margin: 0 !important; width: 100%; }
.fr-blog-grid .elementor-post__thumbnail { border-radius: 0; background: var(--fr-sky); }
/* Card image (v2.1 fix): Elementor centres the ratio image with 'transform: scale(1.01) translate(-50%,-50%)'; the v1.7
   hover 'transform: scale(1.03)' replaced that whole transform, dropping the translate, so the image jumped down/right
   and exposed the background. The image now fills its box with object-fit instead, so hover is a plain centred zoom.
   Shared by the blog hub, archives/pagination and related posts (all .fr-blog-grid). */
.fr-blog-grid .elementor-post__thumbnail { overflow: hidden; }
.fr-blog-grid .elementor-posts-container.elementor-has-item-ratio .elementor-post__thumbnail img {
  position: absolute; inset: 0; top: 0; left: 0; width: 100%; height: 100%; max-width: none; max-height: none;
  object-fit: cover; object-position: center center; transform: none; transform-origin: center center; transition: transform .4s ease;
}
@media (hover: hover) and (pointer: fine) {
  .fr-blog-grid .elementor-posts-container.elementor-has-item-ratio .elementor-post:hover .elementor-post__thumbnail img { transform: scale(1.04); }
}
.fr-blog-grid .elementor-post__text { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px 22px 22px; }
.fr-blog-grid .elementor-post:not(.has-post-thumbnail) .elementor-post__text { padding-top: 26px; border-top: 4px solid var(--fr-red); }
.fr-blog-grid .elementor-post__meta-data { order: -1; margin: 0 0 10px; font-size: 13px; font-weight: 700; letter-spacing: .02em; color: var(--fr-muted); }
.fr-blog-grid .elementor-post__title { margin: 0 0 10px; font-family: var(--fr-head); font-size: 19px; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; }
.fr-blog-grid .elementor-post__title a { color: var(--fr-ink); text-decoration: none; }
.fr-blog-grid .elementor-post__title a:hover { color: var(--fr-navy); text-decoration: underline; text-underline-offset: 3px; }
.fr-blog-grid .elementor-post__excerpt p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--fr-muted); }
.fr-blog-grid .elementor-post__read-more { margin-top: auto; padding-top: 14px; font-family: var(--fr-head); font-size: 14px; font-weight: 800; color: var(--fr-red); text-decoration: none; }
.fr-blog-grid .elementor-post__read-more::after { content: " \2192"; }
.fr-blog-grid .elementor-post__read-more:hover { color: var(--fr-red-600); }
/* Featured first article on the blog hub (page 1 only) */
@media (min-width: 1025px) {
  body.blog:not(.paged) .fr-blog-grid--home .elementor-post:first-child { grid-column: 1 / -1; flex-direction: row; }
  body.blog:not(.paged) .fr-blog-grid--home .elementor-post:first-child .elementor-post__thumbnail__link { width: 55%; flex: none; }
  body.blog:not(.paged) .fr-blog-grid--home .elementor-post:first-child .elementor-post__thumbnail { padding-bottom: 0 !important; height: 100%; min-height: 340px; }
  body.blog:not(.paged) .fr-blog-grid--home .elementor-post:first-child .elementor-post__text { padding: 36px 40px; justify-content: center; }
  body.blog:not(.paged) .fr-blog-grid--home .elementor-post:first-child .elementor-post__title { font-size: 28px; }
}
/* Pagination */
.fr-blog-grid .elementor-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 40px; font-family: var(--fr-head); font-weight: 800; }
.fr-blog-grid .elementor-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 14px; margin: 0 !important; border-radius: 10px; border: 1px solid var(--fr-line); background: #fff; color: var(--fr-navy); text-decoration: none; }
.fr-blog-grid .elementor-pagination .page-numbers.current { background: var(--fr-navy); border-color: var(--fr-navy); color: #fff; }
.fr-blog-grid .elementor-pagination a.page-numbers:hover { border-color: var(--fr-navy); }
.fr-blog-grid .elementor-pagination .page-numbers.dots { border: 0; background: none; }
.fr-blog-cats .elementor-icon-list-item a { min-height: 40px; padding: 6px 16px; font-size: 14px; }
/* Single post */
.fr-post-head { max-width: 860px; }
.fr-post-title .elementor-heading-title { max-width: 26ch; font-size: clamp(32px, 4vw, 48px); }
.fr-post-meta .elementor-icon-list-items { gap: 6px 18px; }
.fr-post-meta .elementor-icon-list-item { font-size: 14px; font-weight: 600; color: var(--fr-muted); margin: 0 !important; padding: 0 !important; }
.fr-post-meta .elementor-icon-list-item::after { display: none !important; }
.fr-post-meta .elementor-icon-list-icon { color: var(--fr-red); }
.fr-post-meta .elementor-icon-list-icon svg { width: 16px; height: 16px; }
.fr-post-meta a { color: var(--fr-navy); text-decoration: none; }
.fr-post-meta a:hover { text-decoration: underline; }
.fr-post-featured img { width: 100%; height: auto; border-radius: var(--fr-r-lg); box-shadow: var(--fr-sh-md); }
.fr-post-main { min-width: 0; }
.fr-post-content { max-width: 760px; font-size: 18px; line-height: 1.75; color: var(--fr-text); overflow-wrap: anywhere; }
.fr-post-content p, .fr-post-content ul, .fr-post-content ol { margin: 0 0 1.15em; }
.fr-post-content h1, .fr-post-content h2 { margin: 1.6em 0 .55em; font-family: var(--fr-head); font-size: 28px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: var(--fr-ink); }
.fr-post-content h3 { margin: 1.4em 0 .5em; font-family: var(--fr-head); font-size: 22px; font-weight: 800; line-height: 1.3; color: var(--fr-ink); }
.fr-post-content h4, .fr-post-content h5, .fr-post-content h6 { margin: 1.3em 0 .45em; font-family: var(--fr-head); font-size: 19px; font-weight: 800; color: var(--fr-ink); }
.fr-post-content > *:first-child, .fr-post-content .elementor-widget-container > *:first-child { margin-top: 0; }
.fr-post-content ul, .fr-post-content ol { padding-left: 1.3em; }
.fr-post-content li { margin-bottom: .45em; }
.fr-post-content a { color: var(--fr-navy); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.fr-post-content a:hover { color: var(--fr-red); }
.fr-post-content img { max-width: 100%; height: auto; border-radius: var(--fr-r-sm); }
.fr-post-content figure { margin: 1.6em 0; max-width: 100%; }
.fr-post-content figcaption { font-size: 14px; color: var(--fr-muted); margin-top: 8px; }
.fr-post-content blockquote { margin: 1.6em 0; padding: 18px 22px; border-left: 4px solid var(--fr-red); background: var(--fr-sky-2); border-radius: 0 var(--fr-r-sm) var(--fr-r-sm) 0; color: var(--fr-ink); }
.fr-post-content table { width: 100%; border-collapse: collapse; margin: 1.6em 0; font-size: 16px; display: block; overflow-x: auto; }
.fr-post-content th, .fr-post-content td { border: 1px solid var(--fr-line); padding: 10px 12px; text-align: left; vertical-align: top; }
.fr-post-content th { background: var(--fr-sky); color: var(--fr-ink); }
.fr-post-content iframe, .fr-post-content video { max-width: 100%; }
.fr-post-content .wp-block-embed__wrapper iframe, .fr-post-content iframe[src*="youtube"] { width: 100%; aspect-ratio: 16 / 9; height: auto; border-radius: var(--fr-r-sm); }
/* Legacy Elementor-built posts rendered inside the article column */
.fr-post-content .elementor-section, .fr-post-content .e-con, .fr-post-content .elementor-container { max-width: 100% !important; width: 100% !important; }
.fr-post-content .elementor-section-boxed > .elementor-container, .fr-post-content .e-con-boxed > .e-con-inner { max-width: 100% !important; padding-left: 0; padding-right: 0; }
.fr-post-content .elementor-widget-text-editor { font-size: inherit; line-height: inherit; color: inherit; }
.fr-btn--full, .fr-btn--full .elementor-button { width: 100%; }
.fr-post-help { background: #fff; }
.fr-post-nav { margin-top: 12px; padding-top: 22px; border-top: 1px solid var(--fr-line); }
.fr-post-nav .post-navigation__prev--label, .fr-post-nav .post-navigation__next--label { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--fr-red); }
.fr-post-nav .post-navigation__prev--title, .fr-post-nav .post-navigation__next--title { font-family: var(--fr-head); font-weight: 800; color: var(--fr-ink); font-size: 16px; }
@media (max-width: 767px) {
  .fr-post-content { font-size: 17px; }
  .fr-post-content h1, .fr-post-content h2 { font-size: 24px; }
  .fr-post-content h3 { font-size: 20px; }
  .fr-post-title .elementor-heading-title { font-size: 30px; }
}

.fr-blog-title--dyn .elementor-heading-title::first-letter { text-transform: uppercase; }

/* ==========================================================================
   v1.9 — Sticky CTA bar (UAE footer 33518, container .fr-cta-float)
   One element, two presentations (never both at once):
   - 768px and up: floating centred bar. JS adds .is-on to reveal it, hides it while the page's own form is in view
     or being filled in, and .is-off after the visitor closes it (for the session).
   - 767px and below: the approved v1.0 full-width mobile bar (always visible, no close button).
   Colours come only from the design-system button skins: Call Now = .fr-btn--red (Elementor global "Fraser Red",
   hover "Red Hover"); Request Service = .fr-btn--navy (global "Fraser Navy", hover "Dark Navy").
   ========================================================================== */
.fr-cta-float { position: fixed !important; z-index: 990; margin: 0 !important; }
.fr-cta-float > .elementor-widget-button { margin: 0 !important; min-width: 0; }
@media (min-width: 768px) {
  .fr-cta-float {
    left: 50%; right: auto; top: auto; bottom: calc(20px + env(safe-area-inset-bottom));
    display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: stretch; gap: 10px !important;
    width: auto !important; max-width: calc(100vw - 32px); padding: 10px !important;
    background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r);
    box-shadow: var(--fr-sh-lg), 0 2px 8px rgba(6,22,58,.08);
    transform: translate(-50%, calc(100% + 40px)); opacity: 0; visibility: hidden; pointer-events: none;
    transition: transform .3s cubic-bezier(.2,.8,.2,1), opacity .2s ease, visibility 0s linear .3s;
  }
  .fr-cta-float.is-on { transform: translate(-50%, 0); opacity: 1; visibility: visible; pointer-events: auto; transition: transform .3s cubic-bezier(.2,.8,.2,1), opacity .2s ease, visibility 0s; }
  .fr-cta-float.is-off { display: none !important; }
  .fr-cta-float > .elementor-widget-button { flex: 1 1 0; width: auto !important; }
  .fr-cta-float .fr-btn .elementor-button { width: 100%; min-width: 222px; min-height: 56px; padding: 0 26px; font-size: 17px; }
  .fr-cta-float .fr-btn .elementor-button-icon svg { width: 20px; height: 20px; }
  /* Close: small circle on the top-right corner (44px tap area) */
  .fr-cta-float > .fr-cta-float__x { position: absolute !important; top: -12px; right: -12px; width: auto !important; margin: 0 !important; z-index: 1; }
  .fr-cta-float .fr-cta-float__close {
    position: relative; display: grid !important; place-items: center; width: 28px !important; height: 28px !important; min-width: 0 !important; min-height: 0 !important;
    padding: 0 !important; margin: 0 !important; border: 1px solid var(--fr-line) !important; border-radius: 50% !important;
    background: #fff !important; color: var(--fr-navy) !important; box-shadow: var(--fr-sh-md) !important; cursor: pointer; line-height: 1;
    transition: background-color var(--fr-ease);
  }
  .fr-cta-float .fr-cta-float__close::before { content: ""; position: absolute; inset: -8px; }
  .fr-cta-float .fr-cta-float__close svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; }
  .fr-cta-float .fr-cta-float__close:hover, .fr-cta-float .fr-cta-float__close:focus { background: var(--fr-sky) !important; color: var(--fr-navy) !important; }
  .fr-cta-float .fr-cta-float__close:focus-visible { outline: 3px solid var(--fr-red); outline-offset: 2px; }
  /* Keep the last footer links clear of the bar (padding on the navy footer, not the body) */
  html.fr-cta-pad .fr-footer { padding-bottom: 108px !important; }
}
@media (max-width: 767px) {
  .fr-cta-float {
    display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px; left: 0; right: 0; bottom: 0; top: auto; width: auto !important;
    padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important; background: rgba(255,255,255,.97);
    border-top: 1px solid var(--fr-line); box-shadow: 0 -10px 30px rgba(6,22,58,.1);
    transform: none !important; opacity: 1 !important; visibility: visible !important; pointer-events: auto !important;
  }
  .fr-cta-float > .elementor-widget { width: 100%; }
  .fr-cta-float .fr-btn .elementor-button { width: 100%; min-height: 50px; padding: 0 10px; font-size: 16px; }
  .fr-cta-float > .fr-cta-float__x, .fr-cta-float__req .elementor-button-icon { display: none !important; }
  .fr-footer { padding-bottom: 76px !important; }
}
@media (max-width: 400px) { .fr-cta-float .fr-btn .elementor-button { font-size: 15px; } }
/* While the hamburger menu (1024px and below) is open, the menu's own Call / Request buttons take over; hiding the bar keeps the end of an expanded menu from sitting under it. */
@media (max-width: 1024px) { body:has(.fr-nav .hfe-nav-menu__toggle.hfe-active-menu) .fr-cta-float { display: none !important; } }
@media (prefers-reduced-motion: reduce) { .fr-cta-float, .fr-cta-float.is-on { transition: none; } }
@media print { .fr-cta-float { display: none !important; } }

/* ==========================================================================
   v2.0 — Header dropdowns (Residential 33470, Commercial 33487, Repiping 33501). Desktop only (1025px and up);
   the hamburger menu at 1024px and below is unchanged.
   One shared panel style; width comes from each menu's content:
   - Residential: 2 columns, 592px (longest label 237px)
   - Commercial:  2 columns, 576px (longest label 229px)
   - Repiping:    1 column, sized to its longest label
   The UAE nav widget's own "dropdown width 220px" rule (same specificity, loaded later) was overriding the v1.0
   widths; the selectors below outrank it. Columns use CSS column balancing (equal heights by content).
   ========================================================================== */
@media (min-width: 1025px) {
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu {
    box-sizing: border-box; min-width: 0; max-width: calc(100vw - 32px); padding: 14px;
    background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-lg);
    top: calc(100% + 8px);
  }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li { break-inside: avoid; }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li > a.hfe-sub-menu-item {
    padding: 8px 12px; border-radius: 8px; font-family: var(--fr-body); font-size: 15px; font-weight: 400; line-height: 1.35;
    color: var(--fr-navy); background: transparent; white-space: normal;
  }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li > a.hfe-sub-menu-item:hover,
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li > a.hfe-sub-menu-item:focus-visible { background: var(--fr-sky); color: var(--fr-red); }
  /* "All … Services" links: stronger navy, bold */
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li.fr-menu-all > a.hfe-sub-menu-item { color: var(--fr-navy); font-family: var(--fr-head); font-weight: 800; }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li.fr-menu-all > a.hfe-sub-menu-item:hover { color: var(--fr-red); }
  /* Active state: the current page's link, and its parent tab */
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li > ul.sub-menu > li.current-menu-item > a.hfe-sub-menu-item { color: var(--fr-red); font-weight: 600; }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li.current-menu-ancestor > .hfe-has-submenu-container > a.hfe-menu-item,
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li.current-menu-item > .hfe-has-submenu-container > a.hfe-menu-item { color: var(--fr-navy); }
  /* Per-menu width / columns */
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li#menu-item-33470 > ul.sub-menu { width: 592px; column-count: 2; column-gap: 20px; column-fill: balance; }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li#menu-item-33487 > ul.sub-menu { width: 576px; column-count: 2; column-gap: 20px; column-fill: balance; }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li#menu-item-33501 > ul.sub-menu { width: max-content; column-count: 1; }
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li#menu-item-33501 > ul.sub-menu > li > a.hfe-sub-menu-item { white-space: nowrap; }
  /* Open on hover, and while the tab or one of its links has keyboard focus (so Tab reaches every link).
     !important because UAE's menu script leaves an inline 'visibility:hidden; opacity:0; height:0' on a submenu after
     focus leaves it, which otherwise stops hover from reopening that menu until the page reloads. */
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li:hover > ul.sub-menu,
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li:has(> .hfe-has-submenu-container a:focus-visible) > ul.sub-menu,
  .fr-mainbar .fr-nav nav .hfe-nav-menu > li:has(> ul.sub-menu a:focus-visible) > ul.sub-menu { visibility: visible !important; opacity: 1 !important; height: auto !important; }
}

/* ==========================================================================
   v1.9 — Header fit after adding "Blog" to the main nav (menu item 34464)
   Same header design; only spacing at the widths where the extra item would collide with the phone block.
   ========================================================================== */
@media (min-width: 1281px) {
  .fr-mainbar .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a.hfe-menu-item, .fr-mainbar .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding-left: 7px !important; padding-right: 7px !important; }
  .fr-mainbar .fr-nav .hfe-nav-menu .sub-arrow { padding-left: 3px !important; }
}
/* 1025–1149px: the header phone number becomes the same 40px red-tint phone circle used from 1281px (still the tel link;
   the number stays in the markup for screen readers), and nav padding tightens slightly. */
@media (min-width: 1025px) and (max-width: 1149px) {
  .fr-mainbar .fr-nav .hfe-nav-menu > li > .hfe-has-submenu-container > a.hfe-menu-item, .fr-mainbar .fr-nav .hfe-nav-menu > li > a.hfe-menu-item { padding-left: 5px !important; padding-right: 5px !important; }
  .fr-mainbar .fr-nav .hfe-nav-menu .sub-arrow { padding-left: 3px !important; }
  .fr-hdr-phone .elementor-icon-box-title a { position: relative; display: block; width: 40px; height: 40px; padding: 0; border-radius: 50%; background: var(--fr-red-50); overflow: hidden; color: transparent; font-size: 0; line-height: 0; }
  .fr-hdr-phone .elementor-icon-box-title a::before { content: ""; position: absolute; inset: 0; background: var(--fr-red); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E") center/18px no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.9v3a2 2 0 0 1-2.2 2 19.8 19.8 0 0 1-8.6-3.1 19.5 19.5 0 0 1-6-6A19.8 19.8 0 0 1 2.1 4.2 2 2 0 0 1 4.1 2h3a2 2 0 0 1 2 1.7c.1.9.4 1.8.7 2.7a2 2 0 0 1-.5 2.1L8 9.8a16 16 0 0 0 6 6l1.3-1.3a2 2 0 0 1 2.1-.4c.9.3 1.8.6 2.7.7a2 2 0 0 1 1.7 2z'/%3E%3C/svg%3E") center/18px no-repeat; }
  .fr-hdr-phone .elementor-icon-box-title a:hover, .fr-hdr-phone .elementor-icon-box-title a:focus-visible { background: var(--fr-red); }
  .fr-hdr-phone .elementor-icon-box-title a:hover::before, .fr-hdr-phone .elementor-icon-box-title a:focus-visible::before { background: #fff; }
}

/* ==========================================================================
   v2.2 — Legacy pages (2026-09-30): document column (legal / utility pages), HTML sitemap groups, coupon cards,
   title-only sign cards, tip-article image and video, tables, numbered cards. Fraser tokens only.
   ========================================================================== */
.fr-hero--doc .fr-doc-head { max-width: 780px; }
.fr-doc { width: 100%; max-width: 780px; }
.fr-doc-text { font-size: 17px; line-height: 1.75; color: var(--fr-text); overflow-wrap: anywhere; }
.fr-doc-text p, .fr-doc-text ul, .fr-doc-text ol { margin: 0 0 1.1em; }
.fr-doc-text ul, .fr-doc-text ol { padding-left: 1.3em; }
.fr-doc-text li { margin-bottom: .4em; }
.fr-doc-text h2 { margin: 1.6em 0 .5em; font-family: var(--fr-head); font-size: 24px; font-weight: 800; line-height: 1.25; letter-spacing: -.01em; color: var(--fr-ink); }
.fr-doc-text > *:first-child, .fr-doc-text .elementor-widget-container > *:first-child { margin-top: 0; }
.fr-doc-text a { color: var(--fr-navy); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.fr-doc-text a:hover { color: var(--fr-red); }
/* HTML sitemap */
.fr-sm-grid { width: 100%; max-width: none; }
.fr-sm-group { padding-top: 18px; border-top: 2px solid var(--fr-line); }
.fr-sm-title .elementor-heading-title { font-family: var(--fr-head); font-size: 18px; font-weight: 800; color: var(--fr-ink); }
.fr-sm-list .elementor-icon-list-item { padding: 4px 0 !important; }
.fr-sm-list .elementor-icon-list-text { font-size: 15px; color: var(--fr-navy); }
.fr-sm-list a:hover .elementor-icon-list-text { color: var(--fr-red); text-decoration: underline; text-underline-offset: 3px; }
.fr-sec--doc .fr-doc:has(.fr-sm-grid) { max-width: none; }
/* Coupons (the original printJS widgets inside a Fraser card) */
.fr-coupon-card { background: #fff; border: 1px solid var(--fr-line); border-radius: var(--fr-r); box-shadow: var(--fr-sh-sm); transition: box-shadow var(--fr-ease), border-color var(--fr-ease); }
.fr-coupon-card:hover { border-color: #c9d6e4; box-shadow: var(--fr-sh-md); }
.fr-coupon-print a { display: block; border-radius: var(--fr-r-sm); overflow: hidden; cursor: pointer; }
.fr-coupon-print img { display: block; width: 100%; height: auto; margin: 0 !important; border-radius: var(--fr-r-sm); }
.fr-coupon-hint .elementor-widget-container p { margin: 0; font-size: 14px; color: var(--fr-muted); }
/* Title-only sign cards */
.fr-sign--title .elementor-icon-box-wrapper { align-items: center; }
.fr-sign--title .elementor-icon-box-description:empty { display: none; }
/* Tip articles */
.fr-tip-figure img { width: 100%; height: auto; border-radius: var(--fr-r-lg); box-shadow: var(--fr-sh-md); }
.fr-video { width: 100%; max-width: 900px; margin: 0 auto; }
.fr-video-embed { position: relative; aspect-ratio: 16 / 9; border-radius: var(--fr-r); overflow: hidden; background: var(--fr-sky); box-shadow: var(--fr-sh-md); }
.fr-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* Tables */
.fr-table-wrap { width: 100%; overflow-x: auto; margin: 1.2em 0 1.6em; border: 1px solid var(--fr-line); border-radius: var(--fr-r-sm); }
.fr-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: 15px; line-height: 1.5; }
.fr-table th, .fr-table td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--fr-line); }
.fr-table th { background: var(--fr-sky); color: var(--fr-ink); font-family: var(--fr-head); font-weight: 800; }
.fr-table tr:last-child td { border-bottom: 0; }
/* Numbered cards */
.fr-card-num .elementor-heading-title { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--fr-red-50); color: var(--fr-red); font-family: var(--fr-head); font-weight: 800; font-size: 15px; line-height: 1; }
@media (max-width: 767px) {
  .fr-doc-text { font-size: 16px; }
  .fr-doc-text h2 { font-size: 21px; }
}


/* v2.3 footer Google Business Profile map (2026-09-30) */
.fr-footer-map { margin-top: 36px; }
.fr-footer-map .fr-map { aspect-ratio: auto; height: 260px; border: 1px solid rgba(255,255,255,.14); box-shadow: none; background: #0f2440; }
@media (max-width: 767px) { .fr-footer-map { margin-top: 28px; } .fr-footer-map .fr-map { height: 220px; aspect-ratio: auto; border-radius: var(--fr-r); } }
/* the Contact page already shows this map in its body */
.page-id-15827 .fr-footer-map { display: none; }

/* ==========================================================================
   v2.4 layout polish (2026-10-01): content determines section height
   ========================================================================== */
/* A. The page ends with the large emergency CTA panel (body class set by the mu-plugin fraser-layout-classes.php):
      hide the footer's smaller emergency strip and leave clean space before the footer. Replaces the v2.3.1 Contact-only rule. */
body.fr-ends-with-cta .fr-footer .fr-footer-cta { display: none !important; }
body.fr-ends-with-cta [data-elementor-type="wp-page"],
body.fr-ends-with-cta [data-elementor-type="archive"] { padding-bottom: 64px; }
@media (max-width: 1024px) { body.fr-ends-with-cta [data-elementor-type="wp-page"], body.fr-ends-with-cta [data-elementor-type="archive"] { padding-bottom: 48px; } }
@media (max-width: 767px) { body.fr-ends-with-cta [data-elementor-type="wp-page"], body.fr-ends-with-cta [data-elementor-type="archive"] { padding-bottom: 40px; } }

/* B1. Signs / problems sections (text + sign cards): 45/55 split, centred, natural heights.
       Was 4fr 8fr + align start, which left the card grid at the top of a taller row. */
@media (min-width: 1025px) {
  .fr-sec--problems .e-con.e-grid:has(> .fr-sticky-aside):has(> .fr-signs) {
    grid-template-columns: minmax(0, 45fr) minmax(0, 55fr);
    column-gap: clamp(48px, 4.4vw, 64px);
    align-items: center;
  }
}

/* B2. Request-service sections (intro text + form card): centre the intro against the form. */
@media (min-width: 1025px) {
  .e-con.e-grid:has(> .fr-form-card--full) { align-items: center; }
}

/* B3. List-group cards (service groups, area directories, A-Z): each card keeps its natural height instead of
       stretching to the longest list in the row. */
.e-con.e-grid:has(> .fr-svc-group), .e-con.e-grid:has(> .fr-dir), .e-con.e-grid:has(> .fr-az) { align-items: start; }
.e-con.e-grid > .fr-svc-group.fr-resource { height: auto; }

/* B4. Text + image and text + prose splits: centre the shorter column. */
@media (min-width: 1025px) {
  .e-con.e-grid:has(> .fr-figure), .e-con.e-grid:has(> .fr-prose.fr-sp-text), .e-con.e-grid:has(> .fr-callout) { align-items: center; }
}
/* B5. Article sidebar on tablets (image + callouts in two columns): the image spans two rows; keep the callouts
       stacked directly under each other instead of spreading them across the image height. */
@media (min-width: 768px) and (max-width: 1024px) {
  .fr-article-aside:has(> .fr-figure) { grid-template-rows: auto 1fr; }
}


/* ==========================================================================
   v2.5 — Mobile audit fixes (2026-10-01). Shared component rules only; no page IDs.
   ========================================================================== */

/* 1. Inline icon lists: Elementor gives .elementor-inline-items a -8px side margin that is normally cancelled by item
      margins; these components zero the item margins and use gap instead, so the list sat 8px outside its box
      (chips clipped at the card edge, post meta touching the screen edge). */
:is(.fr-inline-links, .fr-area-chips, .fr-chips, .fr-post-meta) .elementor-icon-list-items.elementor-inline-items { margin-left: 0 !important; margin-right: 0 !important; }

/* 2. Problem quick-links: the chevron (::after) is a flex item and wrapped onto its own line on narrow cards. */
.fr-problem { flex-wrap: nowrap !important; }
.fr-problem::after { flex: none; }

/* 3. Mobile header menu (hamburger, 1024px and below) */
@media (max-width: 1024px) {
  /* one divider per row: the UAE widget adds its own grey li border under every item on top of ours */
  .fr-mainbar .fr-nav nav.hfe-dropdown li.menu-item { border-bottom: 0 !important; }
  .fr-mainbar .fr-nav nav.hfe-dropdown li a.hfe-menu-item { border-radius: 0; }
  /* closed submenus take no space (their open spacing stays) */
  .fr-nav nav.hfe-dropdown li:not(.sub-menu-active) > .sub-menu { margin: 0 !important; }
  /* submenu toggle: 44px tap area, row height unchanged */
  .fr-mainbar .fr-nav nav.hfe-dropdown .hfe-has-submenu-container > a.hfe-menu-item { padding-top: 10px !important; padding-bottom: 10px !important; }
  .fr-mainbar .fr-nav nav.hfe-dropdown .sub-arrow { width: 44px; height: 44px; justify-content: center; padding: 0 !important; margin-right: -10px; flex: none; }
  /* the UAE widget paints every dropdown link white, which hid the red Call button (white text on white) */
  .fr-mainbar .fr-nav nav.hfe-dropdown li.fr-menu-call > a.hfe-menu-item.hfe-menu-item { background-color: var(--fr-red) !important; color: #fff !important; border-bottom: 0; }
  .fr-mainbar .fr-nav nav.hfe-dropdown li.fr-menu-cta > a.hfe-menu-item.hfe-menu-item { background-color: #fff !important; color: var(--fr-navy) !important; }
  .fr-mainbar .fr-nav nav.hfe-dropdown li:is(.fr-menu-call, .fr-menu-cta) > a.hfe-menu-item.hfe-menu-item { border-radius: 12px; }
  /* submenu: the intended light-sky panel (the widget's white dropdown colour overrode it); roomy two-line items */
  .fr-mainbar .fr-nav nav.hfe-dropdown ul.sub-menu, .fr-mainbar .fr-nav nav.hfe-dropdown ul.sub-menu .menu-item a.hfe-sub-menu-item { background-color: var(--fr-sky-2) !important; }
  .fr-mainbar .fr-nav nav.hfe-dropdown ul.sub-menu { overflow: hidden; }
  .fr-mainbar .fr-nav nav.hfe-dropdown ul.sub-menu .menu-item a.hfe-sub-menu-item { line-height: 1.35; border-radius: 0; }
}

/* 4. Sticky CTA bar (phones): step aside while a form field is being typed in or the date picker is open, so it never
      sits on top of the focused field, the calendar or Submit while the on-screen keyboard is up. Comes back on blur. */
@media (max-width: 767px) {
  body:has(:is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]):not([type="hidden"]), textarea, select):focus) .fr-cta-float,
  body:has(.gform-datepicker-calendar) .fr-cta-float {
    transform: translateY(calc(100% + 12px)) !important; visibility: hidden !important; pointer-events: none !important;
    transition: transform .2s ease, visibility 0s linear .2s;
  }
  .fr-cta-float { transition: transform .2s ease; padding-left: max(12px, env(safe-area-inset-left)) !important; padding-right: max(12px, env(safe-area-inset-right)) !important; }
}
@media (max-width: 767px) and (prefers-reduced-motion: reduce) { .fr-cta-float { transition: none !important; } }

/* 4b. Date picker: the open calendar was clipped by its section (overflow: hidden) and could sit under the next section;
       on 320px phones its fixed 316px width also ran past the screen edge. While a calendar is open its section lets it
       overflow and stacks above the following sections. */
.e-con.e-parent:has(.gform-datepicker-calendar) { position: relative; z-index: 30; overflow: visible !important; }
@media (max-width: 767px) {
  .fr-form-card .gform_wrapper .gform-datepicker-calendar { left: 0 !important; right: 0 !important; width: auto !important; max-width: none !important; }
}

/* 5. Phone landscape (short viewport): compact sticky header + bar so content keeps most of the screen */
@media (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) {
  :root { --fr-header-h: 56px; --fr-topbar-h: 0px; }
  .fr-topbar { display: none !important; }
  .fr-mainbar > .e-con-inner { min-height: 56px !important; padding-top: 6px !important; padding-bottom: 6px !important; }
  .fr-logo img { height: 30px; }
  .fr-cta-float { padding-top: 6px !important; padding-bottom: calc(6px + env(safe-area-inset-bottom)) !important; }
  .fr-cta-float .fr-btn .elementor-button { min-height: 44px !important; }
  .fr-nav nav.hfe-dropdown { max-height: calc(100vh - 56px) !important; }
}

/* 6. Homepage "Why Fraser" photo: the quote card is absolutely placed inside a 16:9 photo box and was taller than the
      photo on narrow phones (top of the card cut off). Below 768px the card sits in the flow over the photo's lower part. */
@media (max-width: 767px) {
  .fr-why-media { aspect-ratio: auto !important; display: flex; flex-direction: column; justify-content: flex-end; min-height: 0; }
  .fr-why-media > .fr-why-quote { position: relative !important; left: auto; right: auto; bottom: auto; top: auto !important; margin: 150px 14px 14px; }
}

/* 7. Segment cards (Residential / Commercial): the CTA row had no space above it once the card stacked */
@media (max-width: 767px) { .fr-segment-ctas { margin-top: 24px !important; } }

/* 8. Hero followed by a regular section (no trust strip to overlap it): the hero's extra bottom padding is meant for
      the trust strip's -56px overlap, so pull the next section up by the same rhythm on phones. */
@media (max-width: 767px) { .fr-hero:is(.fr-hero--page, .fr-hero--svc) + .e-con.fr-sec:not(:has(.fr-trust-card)) { margin-top: -32px; } }

/* 9. Tap targets (phones): 44px rows / hit areas without changing type sizes */
@media (max-width: 767px) {
  /* the mobile bar grows by the iPhone home-indicator inset, so the space kept under the last footer link must too */
  .fr-footer { padding-bottom: calc(76px + env(safe-area-inset-bottom)) !important; }
  .fr-footer-links .elementor-icon-list-items { gap: 0; }
  .fr-footer-links .elementor-icon-list-item a { display: flex; align-items: center; min-height: 44px; padding: 6px 0; }
  .fr-footer-contact .elementor-icon-list-item { padding: 0 !important; }
  .fr-footer-contact .elementor-icon-list-item > a, .fr-footer-contact .elementor-icon-list-item > .elementor-icon-list-text:only-child { min-height: 44px; padding-top: 10px; padding-bottom: 10px; }
  .fr-footer-contact .elementor-icon-list-item:not(:has(> a)) { padding: 10px 0 !important; }
  .fr-legal .elementor-icon-list-items { row-gap: 0; }
  .fr-legal .elementor-icon-list-item a { display: inline-flex; align-items: center; min-height: 44px; padding: 0; }
  .fr-region-list .elementor-icon-list-items { gap: 0; }
  .fr-region-list .elementor-icon-list-item a, .fr-dir-list .elementor-icon-list-item a { min-height: 44px; display: flex !important; align-items: center; padding-top: 6px; padding-bottom: 6px; }
  .fr-dir-list .elementor-icon-list-items { columns: 2 112px !important; column-gap: 16px; }
  .fr-region-list .elementor-icon-list-items { grid-template-columns: 1fr 1fr; column-gap: 16px; }
  .fr-form-card .ginput_container_date .gform-datepicker-toggle, .fr-form-card .gform_legacy_markup_wrapper .gform-datepicker-toggle { width: 44px !important; height: 44px !important; right: 4px; }
  /* small inline targets keep their look; an invisible hit area extends them to ~44px */
  :is(.fr-crumbs, .fr-post-meta, .fr-contact-row, .fr-ec-phone, .fr-inline-links, .fr-footer-contact) a { position: relative; }
  .fr-crumbs a::after, .fr-post-meta a::after { content: ""; position: absolute; inset: -12px -4px; }
  .fr-inline-links a::after { content: ""; position: absolute; inset: -8px -4px; }
  .fr-contact-row a::after, .fr-ec-phone a::after { content: ""; position: absolute; inset: -8px -4px; }
  .fr-post-content p > a:only-child { position: relative; }
  .fr-post-content p > a:only-child::after { content: ""; position: absolute; inset: -12px -4px; }
  .fr-logo a, .fr-footer-logo a { display: inline-block; padding: 5px 0; }
  /* sign cards that link to a service: the whole card is the tap target (links inside the text stay on top) */
  .fr-sign:has(.elementor-icon-box-title a) { position: relative; }
  .fr-sign .elementor-icon-box-title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
  .fr-sign .elementor-icon-box-description a { position: relative; z-index: 1; }
}

/* 10. Typography on phones: balanced heading lines (no one-word last line), smaller H1 on the narrowest phones,
       long contact emails fit, long blog-card titles stay compact */
@media (max-width: 767px) {
  :is(h1, h2, h3, h4).elementor-heading-title, .elementor-icon-box-title, .elementor-post__title, .fr-post-content :is(h2, h3), .e-n-accordion-item-title-text { text-wrap: balance; }
  .fr-prose p, .fr-post-content p, .elementor-icon-box-description, .fr-card-text p { text-wrap: pretty; }
  .fr-contact-row a[href^="mailto:"], .fr-footer-contact a[href^="mailto:"] { overflow-wrap: anywhere; }
  /* the desktop measure limits (15-26ch) made phone H1s wrap into extra lines inside an already narrow column */
  :is(.fr-h1, .fr-h1--svc, .fr-blog-title, .fr-post-title) .elementor-heading-title { max-width: none !important; }
}
@media (max-width: 400px) {
  .fr-contact-row a[href^="mailto:"] .elementor-icon-box-title, .fr-contact-row .elementor-icon-box-title a[href^="mailto:"] { font-size: 15px; }
  .fr-blog-grid .elementor-post__title { font-size: 17px; }
}
@media (max-width: 360px) {
  .fr-h1 .elementor-heading-title { font-size: 31px !important; }
  .fr-hero--svc .fr-h1--svc .elementor-heading-title { font-size: 30px !important; }
  .fr-post-title .elementor-heading-title { font-size: 27px !important; }
}
/* very long post titles (body.fr-long-title, >70 characters, set by fraser-layout-classes.php) ran to 5-8 lines on phones */
@media (max-width: 767px) { body.fr-long-title .fr-post-title .elementor-heading-title { font-size: clamp(22px, 6.4vw, 28px) !important; line-height: 1.2; } }

/* 11. Legacy post FAQs (<details> blocks inside post content, inline-styled): visible open/close indicator, 44px rows */
.fr-post-content details > summary { position: relative; display: block; min-height: 44px; padding-right: 48px !important; line-height: 1.4; list-style: none; }
.fr-post-content details > summary::-webkit-details-marker { display: none; }
.fr-post-content details > summary::after { content: ""; position: absolute; right: 16px; top: 50%; width: 12px; height: 12px; margin-top: -8px; border-right: 2px solid var(--fr-navy); border-bottom: 2px solid var(--fr-navy); transform: rotate(45deg); transition: transform var(--fr-ease); }
.fr-post-content details[open] > summary::after { transform: rotate(-135deg); margin-top: -2px; }
.fr-post-content details > summary:focus-visible { outline: 3px solid var(--fr-blue-400); outline-offset: 2px; }

/* 12. Long-form content safety on phones: embedded media and wide inline-sized elements stay inside the column */
@media (max-width: 767px) {
  .fr-post-content :is(img, video, iframe, embed, object) { max-width: 100%; }
  .fr-post-content img { height: auto; }
  .fr-post-content iframe:not([height]) { aspect-ratio: 16 / 9; height: auto; }
  .fr-post-content pre { max-width: 100%; overflow-x: auto; white-space: pre; }
  .fr-post-content :is(p, li, td, th, a) { overflow-wrap: break-word; }
  .fr-post-content [style*="width"]:not(img):not(table):not(iframe) { max-width: 100% !important; }
}

/* 12b. Post tables on phones: they scroll inside their own box (no page overflow, no hidden data); readable column
        widths, and soft edge shadows that appear only where there is more table to swipe to. */
@media (max-width: 767px) {
  .fr-post-content table { overscroll-behavior-x: contain;
    background: linear-gradient(90deg, #fff 30%, rgba(255,255,255,0)) 0 0 / 28px 100% no-repeat local,
                linear-gradient(270deg, #fff 30%, rgba(255,255,255,0)) 100% 0 / 28px 100% no-repeat local,
                radial-gradient(farthest-side at 0 50%, rgba(6,22,58,.22), rgba(6,22,58,0)) 0 0 / 12px 100% no-repeat scroll,
                radial-gradient(farthest-side at 100% 50%, rgba(6,22,58,.22), rgba(6,22,58,0)) 100% 0 / 12px 100% no-repeat scroll; }
  .fr-post-content table :is(td, th) { min-width: 8.5em; }
}

/* 13. Landscape phones: smaller bar, smaller footer clearance (after rule 9 so it wins) */
@media (max-width: 767px) and (max-height: 500px) and (orientation: landscape) { .fr-footer { padding-bottom: calc(60px + env(safe-area-inset-bottom)) !important; } }

/* 14. Landscape phones / 600-767px: service cards sit two to a row (one card used to fill the whole screen), and the
       single photo panels take a wider ratio so a photo never fills the short landscape screen. */
@media (min-width: 600px) and (max-width: 767px) { .e-con.e-grid:has(> .fr-svc-card) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) {
  .fr-segment-media, .fr-areas-photo { aspect-ratio: 21 / 9; }
  .fr-tip-figure img, .fr-figure-img img { max-height: 62vh; width: 100%; object-fit: cover; }
  /* post images keep their full picture (many carry text): capped to 80% of the screen, centred, not cropped */
  :is(.fr-post-content, .fr-post-featured) img { max-height: 80vh; width: auto !important; max-width: 100%; margin-inline: auto; display: block; object-fit: contain; }
}

/* 15. Four legacy posts (31769, 31772, 31774, 31776) store literal <h1>…</h1> inside their post title. The browser splits
       the nested heading into an empty H1 plus an unstyled inner H1 (browser-default size, 6-7 lines on phones). Display
       fix only (titles unchanged): hide the empty heading, give the inner one the post-title style. */
.fr-post-title .elementor-widget-container > h1.elementor-heading-title:empty { display: none; }
.fr-post-title .elementor-widget-container > h1:not(.elementor-heading-title) { margin: 0; max-width: 26ch; font-family: Manrope, sans-serif; font-weight: 800; font-size: clamp(32px, 4vw, 48px); line-height: 1.04; letter-spacing: -.035em; color: var(--fr-ink); text-wrap: balance; }
@media (max-width: 767px) { .fr-post-title .elementor-widget-container > h1:not(.elementor-heading-title) { max-width: none; font-size: 30px; line-height: 1.1; } body.fr-long-title .fr-post-title .elementor-widget-container > h1:not(.elementor-heading-title) { font-size: clamp(22px, 6.4vw, 28px); line-height: 1.2; } }

/* 16. Landscape phones: Request Service lands on the page form with the portrait offset (110px), which left the first
       field under the bar on a 375px-tall screen. Here the compact header is 56px, so a smaller offset is enough (the
       footer script only applies its 110px default when no offset is set). */
@media (max-width: 1024px) and (max-height: 500px) and (orientation: landscape) { #request-service, .gform_wrapper { scroll-margin-top: 64px; } }


/* v2.6 — service-page rating line (2026-10-05). Printed by fraser-seo-rankmath.php under the hero trust list (.fr-proof)
   on Fraser service pages only; the same values feed the Product AggregateRating. */
.fr-svc-rating { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 16px 0 0; font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--fr-ink); }
.fr-svc-rating__stars { color: var(--fr-red); font-size: 16px; letter-spacing: 2px; line-height: 1; }
.fr-svc-rating strong { font-family: var(--fr-head); font-weight: 800; color: var(--fr-ink); }
@media (max-width: 767px) { .fr-svc-rating { font-size: 14px; margin-top: 14px; } }

/* Quick answer box (answer-first block on service pages, added 2026-10-12) */
.fr-quick-answer .fr-qa{border-left:4px solid var(--e-global-color-accent,#D9461F);background:var(--e-global-color-fr_surface,#F3F5F8);padding:20px 24px;border-radius:8px;margin:0 0 24px}
.fr-quick-answer .fr-qa p{margin:0 0 12px;font-size:1.05em}
.fr-quick-answer .fr-qa ul{margin:0;padding-left:20px}
.fr-quick-answer .fr-qa li{margin:0 0 6px}

/* Location page NAP block */
.fr-nap{font-style:normal;line-height:1.75;margin:0 0 6px}
.fr-nap strong{color:var(--fr-ink,#0D1A2E)}


/* v1.8 visual polish (2026-10-30, Before/After report follow-ups) */
/* Service hero: keep H1 descenders clear of the quick-answer box (H1 line-height is about 1.04) */
.fr-h1--svc + .fr-quick-answer{margin-top:clamp(14px,1.4vw,20px)}
/* Legacy post images: stop 300px floats squeezing the text column on phones */
@media (max-width:767px){
.fr-post-content img.alignright,.fr-post-content img.alignleft,.fr-post-content .wp-caption.alignright,.fr-post-content .wp-caption.alignleft{float:none;display:block;margin:0 auto 1.15em;max-width:100%;height:auto}
}