/* WMM section library (wpb/sections.py): the approved landing-page layout as Elementor containers.
   Every section is a top-level container with a stable class (wmm-header, wmm-hero, wmm-cards, ...); this file holds all
   of the layout, so one change here restyles every site. Colours are ONLY the Elementor Global Colors of the nine design
   roles (for example var(--e-global-color-wmm_accent)): base (page), surface (bands, cards), contrast (body text), heading, muted, line,
   accent, accent_hi, on_accent. Fonts are the Global Fonts wmm_heading / wmm_body (family and weight; sizes are set here,
   so the global fonts must not carry a size). Dark bands (hero overlay, CTA, footer base bar) use the heading colour with
   base-coloured text. Phone and tablet layout below 1025px: Elementor's tablet breakpoint, where the Nav Menu widget
   switches to its burger. */

/* ---------- shared ---------- */
.e-con.wmm-header, .e-con.wmm-footer, .e-con.wmm-callbar, .e-con.wmm-band, .e-con.wmm-hero {
  --wmm-gutter: max(20px, calc((100% - 1240px) / 2));
  --padding-left: var(--wmm-gutter); --padding-right: var(--wmm-gutter);
}
.e-con.wmm-band { --padding-top: 88px; --padding-bottom: 88px; --row-gap: 0px; --column-gap: 0px; --wmm-band-gap: 88px; }
[class*="wmm-"] .elementor-heading-title { letter-spacing: .005em; }
.wmm-band .elementor-heading-title, .wmm-hero .elementor-heading-title, .wmm-footer .elementor-heading-title { line-height: 1.15; }
.e-con.wmm-head { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --row-gap: 14px;
  max-width: 860px; margin: 0 auto 44px; text-align: center; }
.wmm-head h2.elementor-heading-title { font-size: clamp(28px, 3.2vw, 44px); }
.wmm-head .elementor-widget-text-editor { font-size: 18px; line-height: 1.6; }
.wmm-band p:last-child, .wmm-hero p:last-child, .wmm-footer p:last-child { margin-bottom: 0; }
.wmm-band p, .wmm-hero p, .wmm-footer p { margin-top: 0; }

/* width caps on widgets start ".elementor.elementor .e-con > ...": Elementor 4.3 caps every widget with
   ".elementor.elementor .e-con > .elementor-widget { max-width: 100% }" (four classes), which a shorter selector loses to. */

/* buttons: the button widget carries its colours (globals); the shape lives here */
.wmm-btn .elementor-button { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 26px;
  border-radius: 999px; font-size: 17px; font-weight: 700; line-height: 1.2; white-space: nowrap; transition: background-color .2s, color .2s, box-shadow .2s; }
.wmm-btn--line .elementor-button { box-shadow: inset 0 0 0 1.5px var(--e-global-color-wmm_heading); }
.wmm-btn--ghost .elementor-button { box-shadow: inset 0 0 0 1.5px var(--e-global-color-wmm_base); }
.wmm-btn-call .elementor-button-content-wrapper::before { content: ""; width: 1em; height: 1em; margin-right: 8px; flex: 0 0 auto;
  background: currentColor; -webkit-mask: var(--wmm-phone-icon) center / contain no-repeat; mask: var(--wmm-phone-icon) center / contain no-repeat; }
.wmm-btn-call .elementor-button-content-wrapper { display: inline-flex; align-items: center; }
/* no number saved: the tag prints nothing and the link is empty, so the call button is hidden (no empty pill, no dead "Call Now") */
.wmm-btn-call:has(.elementor-button-text:empty), .wmm-btn-call:has(a.elementor-button:not([href])), .wmm-btn-call:has(a.elementor-button[href=""]) { display: none; }
:root { --wmm-phone-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11.4 11.4 0 0 0 3.6.57 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.25.2 2.45.57 3.57a1 1 0 0 1-.25 1z' fill='black'/%3E%3C/svg%3E"); }
.e-con.wmm-ctas { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --flex-direction: row;
  --flex-wrap: wrap; --row-gap: 12px; --column-gap: 12px; --container-widget-width: auto; margin-top: 30px; }
.e-con.wmm-ctas > .elementor-widget { width: auto; }

/* ---------- header (sticky; logo, menu, call + consultation) ---------- */
.e-con.wmm-header { --flex-direction: row; --flex-wrap: nowrap; --align-items: center; --column-gap: 32px; --row-gap: 0px;
  --padding-top: 0px; --padding-bottom: 0px; --padding-left: 40px; --padding-right: 40px; --container-widget-width: auto;
  position: sticky; top: 0; z-index: 90; min-height: 96px; box-shadow: 0 1px 0 var(--e-global-color-wmm_line); }
.admin-bar .e-con.wmm-header { top: var(--wp-admin--admin-bar--height, 32px); }
.wmm-header > .elementor-widget { width: auto; max-width: none; }
.wmm-header .wmm-logo { flex: 0 0 auto; }
.wmm-header .wmm-logo img { display: block; width: auto; max-width: 170px; max-height: 64px; height: auto; }
.wmm-header .wmm-nav { flex: 1 1 auto; min-width: 0; }
.e-con.wmm-header-cta { --flex-direction: row; --flex-wrap: nowrap; --column-gap: 12px; --padding-top: 0px; --padding-bottom: 0px;
  --padding-left: 0px; --padding-right: 0px; --container-widget-width: auto; width: auto; flex: 0 0 auto; }
.wmm-header-cta .wmm-btn .elementor-button { min-height: 46px; padding: 0 22px; font-size: 16px; }
.wmm-callicon { display: none; }
.wmm-callicon .wmm-phone-link { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%;
  background: var(--e-global-color-wmm_accent); color: var(--e-global-color-wmm_on_accent); font-size: 0; line-height: 0; overflow: hidden; }
.wmm-callicon .wmm-phone-link::before { content: ""; width: 20px; height: 20px; background: currentColor;
  -webkit-mask: var(--wmm-phone-icon) center / contain no-repeat; mask: var(--wmm-phone-icon) center / contain no-repeat; }

/* ---------- call bar: phones only ---------- */
.e-con.wmm-callbar { display: none; }

/* ---------- hero: page photo, dark overlay, H1 + lede + buttons, form card ---------- */
.e-con.wmm-hero { --flex-direction: row; --align-items: center; --column-gap: 72px; --row-gap: 30px; --padding-top: 64px; --padding-bottom: 72px;
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 540px); align-items: center; overflow: hidden; }
.e-con.wmm-hero::before { content: ""; position: absolute; inset: 0; z-index: 0; display: block; width: auto; height: auto; opacity: 1;
  background: linear-gradient(90deg, color-mix(in srgb, var(--e-global-color-wmm_heading) 94%, transparent) 0%,
    color-mix(in srgb, var(--e-global-color-wmm_heading) 86%, transparent) 46%, color-mix(in srgb, var(--e-global-color-wmm_heading) 55%, transparent) 100%); }
.e-con.wmm-hero > .e-con { position: relative; z-index: 1; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; }
.e-con.wmm-hero--solo { grid-template-columns: minmax(0, 860px); --padding-top: 88px; --padding-bottom: 96px; }
.wmm-hero h1.elementor-heading-title { font-size: clamp(34px, 4vw, 58px); line-height: 1.06; }
.e-con.wmm-hero-text { --row-gap: 0px; }
.elementor.elementor .e-con > .wmm-lede { margin-top: 22px; max-width: 620px; font-size: 20px; line-height: 1.55; opacity: .9; }
.wmm-hero .wmm-ctas .wmm-btn .elementor-button { min-height: 54px; padding: 0 28px; }
/* the breadcrumb above the H1 and the approved trust lines under the buttons (site.json sections.trust), small and in the
   light accent on the dark hero, as the approved location template has them */
.e-con.wmm-hero { --wmm-hero-accent: var(--e-global-color-wmm_accent_hi); }
.wmm-crumbs:not(:has(.wmm-breadcrumbs)) { display: none; }
.wmm-breadcrumbs { margin: 0 0 22px; font-size: 15px; line-height: 1.4; color: var(--wmm-hero-accent);
  font-family: var(--e-global-typography-wmm_body-font-family), sans-serif; }
.wmm-breadcrumbs a { color: inherit; text-decoration: none; }
.wmm-breadcrumbs a:hover, .wmm-breadcrumbs a:focus-visible { text-decoration: underline; }
.elementor.elementor .e-con > .wmm-trust { margin-top: 30px; }
.wmm-trust-list { display: flex; flex-wrap: wrap; gap: 10px 28px; margin: 0; padding: 0; list-style: none; font-size: 15px; line-height: 1.4;
  color: var(--wmm-hero-accent); }
.wmm-trust-list li { display: flex; align-items: center; gap: 8px; margin: 0; }
.wmm-trust-list li::before { content: ""; width: 16px; height: 16px; flex: 0 0 auto; background: currentColor;
  -webkit-mask: var(--wmm-check-icon) center / contain no-repeat; mask: var(--wmm-check-icon) center / contain no-repeat; }
:root { --wmm-check-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cmask id='m'%3E%3Crect width='16' height='16' fill='white'/%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='black' stroke-width='2'/%3E%3C/mask%3E%3Ccircle cx='8' cy='8' r='8' fill='black' mask='url(%23m)'/%3E%3C/svg%3E"); }

.e-con.e-con.wmm-formcard { --row-gap: 6px; --padding-top: 26px; --padding-bottom: 10px; --padding-left: 26px; --padding-right: 26px;
  border-radius: 10px; box-shadow: 0 18px 40px color-mix(in srgb, var(--e-global-color-wmm_heading) 28%, transparent); }
.wmm-formcard h2.elementor-heading-title { font-size: 24px; line-height: 1.2; }
.wmm-formcard .elementor-widget-text-editor { font-size: 15px; line-height: 1.5; }
/* the Contact page's hero card, printed whole by [wmm_form only="contact" title="..." note="..."] */
.wmm-formcard h2.wmm-formcard-title { margin: 0; font-size: 24px; line-height: 1.2; color: var(--e-global-color-wmm_heading);
  font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif; font-weight: var(--e-global-typography-wmm_heading-font-weight); }
.wmm-formcard p.wmm-formcard-note { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--e-global-color-wmm_muted); }
/* the core layout's hero: its form card shows on the Contact page alone (the call to action's page; the plugin gives it
   the body class wmm-contact-page and [wmm_form only="contact"] prints the form there only); elsewhere the hero is solo */
body:not(.wmm-contact-page) .e-con.wmm-formcard--contact { display: none; }
@media (min-width: 1025px) {
  body.wmm-contact-page .e-con.e-con.wmm-hero--contact-only { grid-template-columns: minmax(0, 1fr) minmax(0, 540px); --padding-top: 64px; --padding-bottom: 72px; }
}
/* the Contact page's Form and map band: the form is in the hero, so the band shows the map and details alone */
body.wmm-contact-page .wmm-contact .e-con.wmm-formcard { display: none; }
body.wmm-contact-page .e-con.e-con.wmm-contact-in { grid-template-columns: minmax(0, 860px); justify-content: center; }
.wmm-form iframe { display: block; width: 100%; min-height: 640px; border: 0; margin-top: 8px; }

/* ---------- reviews ---------- */
/* the band sections stretch their heading and grid to the content width (Elementor's column default would shrink-wrap the grids) */
.e-con.wmm-reviews, .e-con.wmm-cards, .e-con.wmm-steps, .e-con.wmm-towns { --align-items: stretch; }
.elementor.elementor .e-con > .wmm-reviews-widget { max-width: 1240px; margin: 0 auto; width: 100%; }
.wmm-reviews-widget iframe { display: block; width: 100%; border: 0; }

/* ---------- split: sticky photo beside text ---------- */
.e-con.wmm-split { display: grid; grid-template-columns: 1fr 1fr; column-gap: 72px; align-items: start; }
.e-con.wmm-split > .e-con { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; }
.e-con.wmm-split-media { position: sticky; top: 130px; }
.wmm-split--flip > .wmm-split-media { order: 2; }
.wmm-split-img img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 10px; }
.e-con.wmm-split-body { --row-gap: 18px; --align-items: flex-start; }
.wmm-split h2.elementor-heading-title { font-size: clamp(26px, 2.7vw, 38px); }
.wmm-split-body .elementor-widget-text-editor, .wmm-prose { font-size: 18px; line-height: 1.7; }
.wmm-split-body .wmm-btn { margin-top: 10px; }

/* ---------- long content (the page's own text) and its links ---------- */
.e-con.wmm-post-content { --align-items: stretch; }
.wmm-article, .wmm-prose { width: 100%; }
.elementor.elementor .e-con > .wmm-article { max-width: 780px; margin: 0 auto; font-size: 18px; line-height: 1.75; color: var(--e-global-color-wmm_contrast);
  font-family: var(--e-global-typography-wmm_body-font-family), sans-serif; }
.wmm-article h2, .wmm-prose h2, .wmm-article h3, .wmm-prose h3 { color: var(--e-global-color-wmm_heading); clear: both;
  font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif; font-weight: var(--e-global-typography-wmm_heading-font-weight); letter-spacing: .005em; }
.wmm-article h2, .wmm-prose h2 { font-size: clamp(25px, 2.4vw, 34px); line-height: 1.18; margin: 64px 0 0; }
.wmm-article h3, .wmm-prose h3 { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.25; margin: 30px 0 0; }
.wmm-article > :first-child h2:first-child, .wmm-article h2:first-child { margin-top: 0; }
.wmm-article p, .wmm-article ul, .wmm-article ol, .wmm-prose p, .wmm-prose ul, .wmm-prose ol { margin: 16px 0 0; }
.wmm-article ul, .wmm-article ol, .wmm-prose ul, .wmm-prose ol { padding-left: 1.25em; }
.wmm-article li + li, .wmm-prose li + li { margin-top: 6px; }
.wmm-article a, .wmm-prose a { color: var(--e-global-color-wmm_heading); text-decoration: underline; text-underline-offset: .15em; }
.wmm-article img { max-width: 100%; height: auto; border-radius: 10px; }
/* a stand-alone ::button in the page's own text: the site's filled button (accent, on_accent text), never WordPress's grey
   default with the article's link colour on it (staging rehearsal D4); a card's link stays a plain link (its own rule) */
.wmm-article .wp-block-button__link, .wmm-prose .wp-block-button__link { display: inline-flex; align-items: center; justify-content: center;
  min-height: 50px; padding: 0 26px; border-radius: 999px; background: var(--e-global-color-wmm_accent); color: var(--e-global-color-wmm_on_accent);
  font-size: 17px; font-weight: 700; line-height: 1.2; text-decoration: none; transition: filter .2s; }
.wmm-article .wp-block-button__link:hover, .wmm-article .wp-block-button__link:focus-visible,
.wmm-prose .wp-block-button__link:hover, .wmm-prose .wp-block-button__link:focus-visible { filter: brightness(1.15); }
.wmm-article .wp-block-buttons, .wmm-prose .wp-block-buttons { margin-top: 24px; }
/* a page carried from an approved preview (its content wrapped in .dup-page by carry): the page's own markup at full
   width, no reading column and no band padding, as in the preview (staging rehearsal D3); the sections added after it
   (additions.md) keep the reading column */
.e-con.wmm-post-content:has(.dup-page) { --padding-top: 0px; --padding-left: 0px; --padding-right: 0px; }
.elementor.elementor .e-con > .wmm-article:has(.dup-page) { max-width: none; margin: 0; }
.wmm-article:has(> .dup-page) > :not(.dup-page, .wmm-content-band, style, link, script) { box-sizing: border-box; max-width: 820px;
  margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }
.elementor.elementor .e-con > .wmm-links { max-width: 780px; margin: 0 auto; width: 100%; }
.wmm-location-links { margin-top: 56px; padding-top: 32px; border-top: 1px solid var(--e-global-color-wmm_line); text-align: center; }
.wmm-location-links h2 { margin: 0; font-size: 20px; color: var(--e-global-color-wmm_heading);
  font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif; font-weight: var(--e-global-typography-wmm_heading-font-weight); }
.wmm-location-links ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.wmm-location-links a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 18px; border-radius: 999px; font-size: 15px; font-weight: 700;
  background: var(--e-global-color-wmm_surface); color: var(--e-global-color-wmm_heading); text-decoration: none; }
.wmm-location-links a:hover { background: var(--e-global-color-wmm_heading); color: var(--e-global-color-wmm_base); }

/* ---------- cards ---------- */
.e-con.wmm-cards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; max-width: 1240px; margin: 0 auto; width: 100%;
  --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; }
.e-con.wmm-card { --row-gap: 0px; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; border-radius: 10px; overflow: hidden; }
.wmm-card-img img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.e-con.wmm-card-body { --row-gap: 10px; --align-items: flex-start; --padding-top: 22px; --padding-bottom: 26px; --padding-left: 24px; --padding-right: 24px; flex: 1; }
.wmm-card h3.elementor-heading-title { font-size: 22px; line-height: 1.2; }
.wmm-card .elementor-widget-text-editor { font-size: 16px; line-height: 1.6; flex: 1; }
.wmm-card-link { margin-top: 6px; }
.wmm-card-link .elementor-button { min-height: 42px; padding: 0 18px; font-size: 15px; }

/* ---------- steps (numbered by the CSS) ---------- */
.e-con.wmm-steps-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; max-width: 1100px; margin: 0 auto; width: 100%;
  counter-reset: wmm-step; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; }
.e-con.wmm-step { counter-increment: wmm-step; --row-gap: 8px; --padding-top: 24px; --padding-bottom: 26px; --padding-left: 22px; --padding-right: 22px; border-radius: 10px; }
.e-con.wmm-step::before { content: counter(wmm-step); position: static; display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 8px;
  border-radius: 50%; background: var(--e-global-color-wmm_heading); color: var(--e-global-color-wmm_base); font-weight: 800; font-size: 18px; border: 0; opacity: 1; }
.wmm-step h3.elementor-heading-title { font-size: 18px; line-height: 1.3; }
.wmm-step .elementor-widget-text-editor { font-size: 16px; line-height: 1.6; }

/* ---------- call-to-action band ---------- */
.e-con.wmm-cta { --padding-top: 72px; --padding-bottom: 72px; --align-items: center; text-align: center; }
.wmm-cta h2.elementor-heading-title { font-size: clamp(27px, 2.8vw, 40px); }
.elementor.elementor .e-con.wmm-cta > .elementor-widget-text-editor { max-width: 640px; margin: 14px auto 0; font-size: 18px; line-height: 1.6; opacity: .9; }
.e-con.wmm-cta .wmm-ctas { --justify-content: center; }

/* ---------- contact: form beside a map and the details ---------- */
.e-con.wmm-contact { scroll-margin-top: 120px; }
.e-con.wmm-contact-in { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; max-width: 1240px; margin: 0 auto; width: 100%; align-items: stretch;
  --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; }
.wmm-contact--solo .wmm-contact-in { grid-template-columns: minmax(0, 860px); justify-content: center; }
.e-con.wmm-mapcard { --row-gap: 0px; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; border-radius: 10px; overflow: hidden; }
.wmm-map { flex: 1; }
.wmm-map iframe { display: block; width: 100%; min-height: 420px; border: 0; }
.e-con.wmm-contact-details { --row-gap: 8px; --padding-top: 22px; --padding-bottom: 22px; --padding-left: 26px; --padding-right: 26px; font-size: 16px; line-height: 1.5; }
.wmm-contact-name { font-weight: 800; }
.wmm-contact-tel .elementor-heading-title, .wmm-footer-tel .elementor-heading-title { font-size: 18px; font-weight: 800; }
.wmm-contact-tel a, .wmm-footer-tel a { text-decoration: underline; text-underline-offset: .15em; }

/* ---------- towns grid ([wmm_towns style="grid"]) ---------- */
.elementor.elementor .e-con > .wmm-towns-list { max-width: 1240px; margin: 0 auto; width: 100%; }
.wmm-towns-nav--grid ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.wmm-towns-nav--grid a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; border-radius: 8px;
  background: var(--e-global-color-wmm_base); color: var(--e-global-color-wmm_heading); font-weight: 800; font-size: 16px; text-decoration: none;
  font-family: var(--e-global-typography-wmm_body-font-family), sans-serif; }
.wmm-towns-nav--grid a::after { content: ""; width: 7px; height: 7px; border-top: 1.5px solid; border-right: 1.5px solid; transform: rotate(45deg); }
.wmm-towns-nav--grid a:hover { background: var(--e-global-color-wmm_accent); color: var(--e-global-color-wmm_on_accent); }

/* ---------- footer: four columns, the towns, the dark base bar ---------- */
.e-con.wmm-footer { --row-gap: 0px; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px;
  border-top: 1px solid var(--e-global-color-wmm_line); font-size: 16px; line-height: 1.6; }
.e-con.wmm-footer-grid { display: grid; grid-template-columns: 1.35fr 1fr .8fr 1.1fr; gap: 56px;
  --padding-top: 64px; --padding-bottom: 52px; --padding-left: var(--wmm-gutter); --padding-right: var(--wmm-gutter); }
.wmm-footer-grid > .e-con { --row-gap: 10px; --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --align-items: flex-start; }
.wmm-footer h2.elementor-heading-title { font-size: 18px; line-height: 1.2; margin-bottom: 4px; }
.wmm-footer .wmm-logo img { display: block; width: auto; max-width: 150px; height: auto; }
.wmm-footer-name { font-weight: 800; }
.wmm-footer-brand .elementor-widget-text-editor { max-width: 340px; }
.wmm-social { display: flex; flex-wrap: wrap; gap: 12px; margin: 4px 0 0; padding: 0; list-style: none; }
.wmm-social li { margin: 0; }
.wmm-social a { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 6px; color: var(--e-global-color-wmm_heading);
  border: 1px solid var(--e-global-color-wmm_line); transition: background-color .15s, color .15s, border-color .15s; }
.wmm-social a:hover, .wmm-social a:focus-visible { background: var(--e-global-color-wmm_accent); border-color: var(--e-global-color-wmm_accent);
  color: var(--e-global-color-wmm_on_accent); }
.wmm-footer-social:empty, .wmm-footer-social:has(.elementor-shortcode:empty) { display: none; }   /* no profile links, no gap in the column */
.wmm-footer-note p { margin: 0; max-width: 340px; }
.wmm-footer-menu .elementor-nav-menu--main .elementor-item { padding: 3px 0; }
.wmm-footer-menu .sub-menu, .wmm-footer-menu .sub-arrow, .wmm-footer-menu .elementor-menu-toggle { display: none !important; }
.wmm-footer-cta .wmm-btn .elementor-button { min-height: 44px; padding: 0 22px; font-size: 16px; }
.wmm-footer-towns { padding: 0 var(--wmm-gutter) 40px; width: 100%; }
.wmm-towns-title { margin: 0 0 10px; font-size: 18px; color: var(--e-global-color-wmm_heading);
  font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif; font-weight: var(--e-global-typography-wmm_heading-font-weight); }
.wmm-towns-nav--list ul { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; padding: 0; list-style: none; }
.wmm-towns-nav--list a { font-size: 15px; color: var(--e-global-color-wmm_muted); text-decoration: none; }
.wmm-towns-nav--list a:hover { text-decoration: underline; }
.e-con.wmm-footer-base { --flex-direction: row; --flex-wrap: wrap; --justify-content: space-between; --align-items: center; --column-gap: 24px; --row-gap: 4px;
  --padding-top: 16px; --padding-bottom: 16px; --padding-left: var(--wmm-gutter); --padding-right: var(--wmm-gutter); --container-widget-width: auto; font-size: 14px; }
.wmm-footer-base > .elementor-widget { width: auto; }
.wmm-footer-base a { color: inherit; text-decoration: underline; text-underline-offset: .15em; }
.wmm-legal-links { margin: 0; }
.wmm-legal-links .wmm-sep { margin: 0 8px; opacity: .6; }
.wmm-footer-disclaimer:empty, .wmm-footer-disclaimer .elementor-shortcode:empty { display: none; }
.wmm-footer-disclaimer-text { margin: 0; color: var(--e-global-color-wmm_base); }

/* ---------- page title (carried, legal and blog layouts: the H1 above the page's own content) ---------- */
.e-con.wmm-page-title { --padding-bottom: 0px; }
.elementor.elementor .e-con.wmm-page-title > .elementor-widget { max-width: 780px; margin: 0 auto; width: 100%; }
.wmm-page-title h1.elementor-heading-title { font-size: clamp(32px, 4vw, 52px); line-height: 1.1; }
.e-con.wmm-page-title + .e-con.wmm-post-content { --padding-top: 40px; }
/* no title band when the page carries its own H1 (the wmm-page-title tag printed nothing) */
.e-con.wmm-page-title:not(:has(.elementor-heading-title)) { display: none; }

/* ---------- page cards ([wmm_page_cards]: a town's services, a service's towns, the services) ---------- */
.e-con.wmm-page-cards:not(:has(.wmm-pcards)) { display: none; }
/* the towns grid (Service Areas page only) and the blog's posts list hide when their shortcode printed nothing */
.e-con.wmm-towns:not(:has(.wmm-towns-nav)), .e-con.wmm-posts:not(:has(.wmm-pcards)) { display: none; }
.wmm-pcard-date { display: block; margin-top: 6px; font-size: 14px; color: var(--e-global-color-wmm_muted); }
.wmm-posts-pages { display: flex; justify-content: space-between; gap: 16px; margin-top: 32px; }
.wmm-posts-pages a { color: var(--e-global-color-wmm_accent); font-weight: 600; }
.wmm-posts-pages a[rel="next"] { margin-left: auto; }
.elementor.elementor .e-con > .wmm-page-cards-list { max-width: 1240px; margin: 0 auto; width: 100%; }
.wmm-pcards-title { max-width: 860px; margin: 0 auto 44px; text-align: center; font-size: clamp(28px, 3.2vw, 44px); line-height: 1.15;
  color: var(--e-global-color-wmm_heading); font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif;
  font-weight: var(--e-global-typography-wmm_heading-font-weight); }
.wmm-pcards-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0; padding: 0; list-style: none; }
.wmm-pcard a { display: flex; flex-direction: column; gap: 10px; height: 100%; box-sizing: border-box; padding: 24px 24px 26px; border-radius: 10px;
  background: var(--e-global-color-wmm_surface); color: var(--e-global-color-wmm_contrast); text-decoration: none;
  box-shadow: inset 0 0 0 1px var(--e-global-color-wmm_line); transition: box-shadow .2s; }
.wmm-pcard a:hover, .wmm-pcard a:focus-visible { box-shadow: inset 0 0 0 2px var(--e-global-color-wmm_accent); }
.wmm-pcard-title { font-size: 21px; line-height: 1.25; color: var(--e-global-color-wmm_heading);
  font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif; font-weight: var(--e-global-typography-wmm_heading-font-weight); }
.wmm-pcard-text { flex: 1; font-size: 16px; line-height: 1.6; color: var(--e-global-color-wmm_muted); }
.wmm-pcard-more { font-size: 15px; font-weight: 700; color: var(--e-global-color-wmm_heading); text-decoration: underline; text-underline-offset: .15em; }

/* ---------- a saved band placed with the Template widget: no frame of its own ---------- */
.e-con.wmm-embed { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --row-gap: 0px; }
.e-con.wmm-embed > .wmm-embed-tpl { width: 100%; }

/* ---------- the page's own bands: ::split, ::cards, ::faq and ::cta in the page file (wpb/blocks.py) ----------
   They are in the Post Content widget, inside the reading column, and break out to the page's full width: the single
   template is the query container, so 100cqw is the page's width (without the scrollbar, unlike 100vw) and
   calc(50% - 50cqw) moves a band from the centred column to the page's left edge. A band at the very top or bottom of the
   content meets the bands around the content with no gap; two bands in a row touch. */
.elementor-location-single:has(.wmm-content-band) { container-type: inline-size; }
.wmm-content-band { box-sizing: border-box; width: 100cqw; max-width: none; clear: both;
  margin: var(--wmm-band-gap, 88px) 0 var(--wmm-band-gap, 88px) calc(50% - 50cqw);
  padding: var(--wmm-band-gap, 88px) max(20px, calc((100cqw - 1240px) / 2)); }
/* first and last skip the style tags Elementor prints into the content (the saved CTA band's own CSS lands there) */
.wmm-article > .wmm-content-band:nth-child(1 of :not(style, link, script)) { margin-top: calc(-1 * var(--padding-top, 88px)); }
.wmm-article > .wmm-content-band:nth-last-child(1 of :not(style, link, script)) { margin-bottom: calc(-1 * var(--padding-bottom, 88px)); }
.wmm-content-band + .wmm-content-band { margin-top: 0; }
.wmm-content-band:has(+ .wmm-content-band) { margin-bottom: 0; }
.wmm-article .wmm-content-band h2 { margin-top: 0; }
.wmm-article .wmm-content-band .wmm-band-title { max-width: 860px; margin: 0 auto 44px; text-align: center; font-size: clamp(28px, 3.2vw, 44px); line-height: 1.12; }
.wmm-band-split, .wmm-band-faq { background: var(--e-global-color-wmm_surface); }
.wmm-band-cards { background: var(--e-global-color-wmm_base); }

/* split: the page's photo (sticky) beside its own words */
.wmm-band-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 72px; align-items: start; }
.wmm-split-media { position: sticky; top: 130px; margin: 0; }
.wmm-split-media > * { margin: 0; }
.wmm-split-media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 10px; }
.wmm-split-text { margin: 0; font-size: 18px; line-height: 1.7; }
.wmm-article .wmm-split-text h2 { font-size: clamp(26px, 2.7vw, 38px); line-height: 1.15; }
.wmm-article .wmm-split-text p, .wmm-article .wmm-split-text ul, .wmm-article .wmm-split-text ol { margin-top: 18px; }
.wmm-split-text .wp-block-buttons { margin-top: 28px; }

/* cards: the page's own cards (a photo on top, the title, a line or two, a link) */
.wmm-band-cards .wmm-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; margin: 0; }
.wmm-band-cards .wmm-card { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 22px 0 26px; border-radius: 10px; overflow: hidden;
  background: var(--e-global-color-wmm_surface); }
.wmm-band-cards .wmm-card > * { margin: 0; padding-left: 24px; padding-right: 24px; max-width: none; }
.wmm-band-cards .wmm-card:has(> .wp-block-image:first-child) { padding-top: 0; }
.wmm-band-cards .wmm-card > .wp-block-image { padding: 0; margin-bottom: 12px; }
.wmm-band-cards .wmm-card img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 0; }
.wmm-article .wmm-band-cards .wmm-card h3 { margin: 0; font-size: 22px; line-height: 1.2; }
.wmm-article .wmm-band-cards .wmm-card p, .wmm-article .wmm-band-cards .wmm-card ul { margin: 0; font-size: 16px; line-height: 1.6;
  color: var(--e-global-color-wmm_muted); }
.wmm-band-cards .wmm-card .wp-block-buttons { margin-top: auto; padding-top: 6px; }
.wmm-band-cards .wmm-card .wp-block-button__link { padding: 0; min-height: 0; display: inline; border-radius: 0; background: none; color: var(--e-global-color-wmm_heading);
  font-size: 16px; font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }

/* FAQ: its own band, the heading centred, the questions 900px wide */
.wmm-band-faq .wmm-faq-list { max-width: 900px; margin: 0 auto; border-top: 1px solid var(--e-global-color-wmm_line); }
.wmm-band-faq details { margin: 0; border-bottom: 1px solid var(--e-global-color-wmm_line); }
.wmm-band-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 4px; cursor: pointer;
  list-style: none; font-family: var(--e-global-typography-wmm_heading-font-family), sans-serif;
  font-weight: var(--e-global-typography-wmm_heading-font-weight); font-size: 20px; line-height: 1.3; color: var(--e-global-color-wmm_heading); }
.wmm-band-faq summary::-webkit-details-marker { display: none; }
.wmm-band-faq summary::after { content: ""; flex: 0 0 auto; width: 14px; height: 14px; border-right: 2px solid; border-bottom: 2px solid;
  transform: rotate(45deg) translate(-3px, -3px); transition: transform .25s; }
.wmm-band-faq details[open] summary::after { transform: rotate(225deg) translate(-3px, -3px); }
.wmm-article .wmm-band-faq details p, .wmm-article .wmm-band-faq details ul { margin: 0; padding: 0 44px 24px 4px; font-size: 18px; line-height: 1.7;
  color: var(--e-global-color-wmm_muted); }
.wmm-article .wmm-band-faq details ul { padding-left: 1.5em; }

/* CTA: the saved CTA band itself (it pads and colours itself); the article's prose styles stay out of it */
.wmm-content-band.wmm-band-cta { padding: 0; }
.wmm-article .wmm-band-cta :is(h2, h3, p) { margin: 0; }
.wmm-article .wmm-band-cta a { text-decoration: none; }
/* the page placed the CTA band itself (::cta): the layout's own CTA band steps aside, so a page never shows two */
.elementor-location-single:has(.wmm-band-cta) .e-con.wmm-embed:has(.wmm-cta) { display: none; }

/* ---------- phone and tablet (below 1025px, where the menu becomes the burger) ---------- */
@media (max-width: 1024px) {
  .e-con.wmm-band { --padding-top: 52px; --padding-bottom: 52px; --wmm-band-gap: 52px; }
  .e-con.wmm-head { margin-bottom: 28px; }
  .wmm-head .elementor-widget-text-editor { font-size: 16px; }

  .e-con.wmm-header { --column-gap: 6px; --padding-left: 20px; --padding-right: 8px; min-height: 64px; }
  .wmm-header .wmm-logo { margin-right: auto; order: 0; }
  .wmm-header .wmm-logo img { max-width: 110px; max-height: 44px; }
  .wmm-header .wmm-callicon { display: block; order: 1; }
  .wmm-header .wmm-nav { flex: 0 0 auto; order: 2; }
  .e-con.wmm-header-cta { display: none; }

  body:has(.wmm-callbar) { padding-bottom: 56px; }
  .e-con.wmm-callbar { display: grid; grid-template-columns: 1fr 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 95; gap: 0;
    --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px;
    box-shadow: 0 -4px 16px color-mix(in srgb, var(--e-global-color-wmm_heading) 15%, transparent); }
  .wmm-callbar > .elementor-widget { width: 100%; }
  .wmm-callbar .elementor-button { width: 100%; min-height: 56px; border-radius: 0; font-size: 16px; font-weight: 800; box-shadow: none; }

  .e-con.wmm-hero, .e-con.wmm-hero--solo { display: flex; --flex-direction: column; --align-items: stretch; --padding-top: 40px; --padding-bottom: 36px; }
  .e-con.wmm-hero::before { background: color-mix(in srgb, var(--e-global-color-wmm_heading) 90%, transparent); }
  .wmm-hero h1.elementor-heading-title { font-size: 32px; line-height: 1.1; }
  .wmm-hero .wmm-lede { margin-top: 14px; font-size: 16px; }
  .e-con.wmm-ctas { margin-top: 22px; --row-gap: 10px; }
  .e-con.wmm-ctas > .elementor-widget, .wmm-ctas .elementor-button { width: 100%; }
  .e-con.e-con.wmm-formcard { --padding-top: 20px; --padding-left: 16px; --padding-right: 16px; --padding-bottom: 6px; border-radius: 8px; }
  .wmm-formcard h2.elementor-heading-title { font-size: 21px; }
  .wmm-breadcrumbs { margin-bottom: 14px; font-size: 13px; }
  .elementor.elementor .e-con > .wmm-trust { margin-top: 22px; }
  .wmm-trust-list { flex-direction: column; gap: 8px; font-size: 14px; }
  .wmm-trust-list li::before { width: 15px; height: 15px; }

  .wmm-article .wmm-content-band .wmm-band-title { margin-bottom: 28px; }
  .wmm-band-split { grid-template-columns: minmax(0, 1fr); row-gap: 24px; }
  .wmm-split-media { position: static; }
  .wmm-split-media img { aspect-ratio: 4 / 3; border-radius: 8px; }
  .wmm-split-text { font-size: 16px; line-height: 1.65; }
  .wmm-article .wmm-split-text p, .wmm-article .wmm-split-text ul, .wmm-article .wmm-split-text ol { margin-top: 14px; }
  .wmm-band-cards .wmm-cards { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .wmm-article .wmm-band-cards .wmm-card h3 { font-size: 20px; }
  .wmm-article .wmm-band-cards .wmm-card p { font-size: 15px; }
  .wmm-band-faq summary { padding: 18px 2px; font-size: 17px; }
  .wmm-band-faq summary::after { width: 11px; height: 11px; }
  .wmm-article .wmm-band-faq details p, .wmm-article .wmm-band-faq details ul { padding: 0 20px 20px 2px; font-size: 16px; }

  .e-con.wmm-split { grid-template-columns: 1fr; row-gap: 24px; }
  .wmm-split--flip > .wmm-split-media { order: 0; }
  .e-con.wmm-split-media { position: static; }
  .wmm-split-img img { aspect-ratio: 4 / 3; border-radius: 8px; }
  .wmm-split-body .elementor-widget-text-editor, .wmm-prose { font-size: 16px; line-height: 1.65; }
  .wmm-split-body .wmm-btn, .wmm-split-body .wmm-btn .elementor-button { width: 100%; }

  .wmm-article { font-size: 16px; line-height: 1.7; }
  .wmm-article h2, .wmm-prose h2 { margin-top: 44px; }

  .e-con.wmm-cards-grid { grid-template-columns: 1fr; gap: 18px; }
  .e-con.wmm-card-body { --padding-top: 18px; --padding-bottom: 20px; --padding-left: 18px; --padding-right: 18px; }
  .wmm-card h3.elementor-heading-title { font-size: 20px; }
  .e-con.wmm-steps-list { grid-template-columns: 1fr; gap: 14px; }
  .wmm-pcards-grid { grid-template-columns: 1fr; gap: 18px; }
  .wmm-pcards-title { margin-bottom: 28px; }

  .e-con.wmm-cta { --padding-top: 52px; --padding-bottom: 52px; }
  .wmm-cta .elementor-widget-text-editor { font-size: 16px; }

  .e-con.wmm-contact { scroll-margin-top: 76px; }
  .e-con.wmm-contact-in { grid-template-columns: 1fr; gap: 24px; }
  .wmm-map iframe { min-height: 300px; }

  .wmm-towns-nav--grid ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .e-con.wmm-footer-grid { grid-template-columns: 1fr; gap: 30px; --padding-top: 40px; --padding-bottom: 32px; }
  .wmm-footer-towns { padding-bottom: 32px; }
  .e-con.wmm-footer-base { --flex-direction: column; --align-items: flex-start; --row-gap: 8px; font-size: 13px; }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .e-con.wmm-footer-grid { grid-template-columns: 1fr 1fr; gap: 40px 48px; }
  .e-con.wmm-cards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wmm-pcards-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wmm-band-cards .wmm-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .wmm-btn .elementor-button, .wmm-band-faq summary::after { transition: none; } }
