/* =========================================================================
   MS Production — Elementor layer

   style.css is a straight copy of the static build's stylesheet and is
   deliberately never edited here, so the two stay in sync. Everything that
   exists only because the sections are Elementor widgets lives in this file,
   which loads after it and only when Elementor is active.

   Four things:
     1. Elementor's own wrappers, taken out of the way
     2. stacked service rows, spaced like the single static section
     3. .factor-from — the "starting from" line, a widget-only control
     4. .svc-icon-frame--photo — the photo variant of the service-row frame
   ========================================================================= */

/* ---------------------------------------------------------------- 1. resets
   Every one of these widgets renders a complete <section class="sec"> with its
   own vertical rhythm and a .wrap for the measure. Elementor adds a 10px
   column padding and a boxed 1140px container on top, which double-pads the
   sections and breaks the full-bleed backgrounds. The imported pages already
   set full-width layout and zero padding per section; these rules do the same
   for a widget dropped into a column by hand. */
[class*="elementor-widget-msp-"] > .elementor-widget-container{margin:0;padding:0}
.elementor-section-full_width > .elementor-container{max-width:none}
.elementor-widget-wrap:has(> [class*="elementor-widget-msp-"]){padding:0}
.elementor-element-populated:has(> .elementor-widget-wrap > [class*="elementor-widget-msp-"]){padding:0}

/* ------------------------------------------------------ 2. stacked svc rows
   In the static pages every row lives inside ONE <section class="sec
   sec-svcrows">, so the space between rows is the .svc-rows gap. As widgets
   each row is its own section, which would stack two lots of section padding
   between them — 230px instead of 96px at desktop width. These two rules put
   the original rhythm back: a row that follows another loses its top padding,
   and a row followed by another is spaced by the .svc-rows gap. Without :has
   support the rows simply sit further apart, which is a spacing difference
   rather than a broken page. */
.elementor-widget-msp-service-row + .elementor-widget-msp-service-row .sec-svcrows{padding-top:0}
.elementor-widget-msp-service-row:has(+ .elementor-widget-msp-service-row) .sec-svcrows{padding-bottom:clamp(56px,8vw,96px)}

/* ------------------------------------------------------------ 3. price line
   The static pages carry the starting figure inside the section sub-heading.
   As a widget it is a control of its own, so it needs a rule of its own. */
.factor-from{
  max-width:1000px;margin:22px auto 0;text-align:center;
  color:var(--muted);font-size:.95rem;line-height:1.6;
}
.factor-from b, .factor-from strong{color:var(--yellow);font-weight:700}

/* ----------------------------------------------------------- 4. photo frame
   The icon frame centres a small SVG in a padded box; a photograph has to
   fill the same box instead, so the grid track goes and the image is cropped
   to the frame's radius. The inner glow is switched off — over a photo it
   reads as a smear. */
.svc-icon-frame--photo{display:block;overflow:hidden;padding:0}
.svc-icon-frame--photo::before{display:none}
.svc-icon-frame--photo img{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit;
}
/* The number chip sits over the photo, so it has to stay above it and stay
   legible against whatever is underneath. */
.svc-icon-frame--photo .svc-icon-tag{z-index:2;box-shadow:0 6px 18px rgba(0,0,0,.45)}