/* ============================================================
   Northern Doors — "Refined" refresh (Nine10, Sept 2026)
   3 of 3: inner pages.

   The same treatment applied to the home page, carried across
   Services, Residential, Commercial Overhead, Steel Man Doors
   and About. Disable this snippet to revert.
   ============================================================ */

/* ============================================================
   1. CLIPPED PRODUCT LISTS
   These panels are height-capped (height:350px, overflow:scroll)
   with far more content than fits, so most of each list was
   invisible to visitors — the same fault found on the home page:

     Services      38 items, ~1010px hidden
     Services      33 items,  ~837px hidden
     Residential   33 items,  ~837px hidden
     Commercial    38 items, ~1010px hidden
     Commercial    33 items,  ~837px hidden
     Man Doors     23 items,  ~466px hidden
     Man Doors     11 items,   ~50px hidden
     Man Doors     33 items,  ~837px hidden

   Uncapped and given the home page's hairline two-column table.
   ============================================================ */
.elementor-element-7e9868e,
.elementor-element-ab6abcd,
.elementor-element-606e28e,
.elementor-element-c5d4cd0,
.elementor-element-4e27367,
.elementor-element-97bbc63,
.elementor-element-4a93624,
.elementor-element-3147da8{
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  overflow:visible !important;
  background-color:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  padding:0 !important;
  color:#16181D !important;
}
.elementor-element-7e9868e ul,
.elementor-element-ab6abcd ul,
.elementor-element-606e28e ul,
.elementor-element-c5d4cd0 ul,
.elementor-element-4e27367 ul,
.elementor-element-97bbc63 ul,
.elementor-element-4a93624 ul,
.elementor-element-3147da8 ul{
  list-style:none !important;
  padding-left:0 !important;
  margin:0 !important;
  border-top:1px solid #E3E6EB;
}
.elementor-element-7e9868e li,
.elementor-element-ab6abcd li,
.elementor-element-606e28e li,
.elementor-element-c5d4cd0 li,
.elementor-element-4e27367 li,
.elementor-element-97bbc63 li,
.elementor-element-4a93624 li,
.elementor-element-3147da8 li{
  list-style:none !important;
  padding:13px 4px;
  border-bottom:1px solid #E3E6EB;
  font-size:.92rem;
  font-weight:600;
  line-height:1.4;
  color:#16181D;
}
.elementor-element-7e9868e li::marker,
.elementor-element-ab6abcd li::marker,
.elementor-element-606e28e li::marker,
.elementor-element-c5d4cd0 li::marker,
.elementor-element-4e27367 li::marker,
.elementor-element-97bbc63 li::marker,
.elementor-element-4a93624 li::marker,
.elementor-element-3147da8 li::marker{content:""}

@media (min-width:768px){
  .elementor-element-7e9868e ul,
  .elementor-element-ab6abcd ul,
  .elementor-element-606e28e ul,
  .elementor-element-c5d4cd0 ul,
  .elementor-element-4e27367 ul,
  .elementor-element-97bbc63 ul,
  .elementor-element-3147da8 ul{
    columns:2;
    column-gap:30px;
  }
  .elementor-element-7e9868e li,
  .elementor-element-ab6abcd li,
  .elementor-element-606e28e li,
  .elementor-element-c5d4cd0 li,
  .elementor-element-4e27367 li,
  .elementor-element-97bbc63 li,
  .elementor-element-3147da8 li{
    break-inside:avoid;
    -webkit-column-break-inside:avoid;
    page-break-inside:avoid;
  }
}
/* Release the columns that were capping those panels */
.e-con:has(> .elementor-element-7e9868e),
.e-con:has(> .elementor-element-ab6abcd),
.e-con:has(> .elementor-element-606e28e),
.e-con:has(> .elementor-element-c5d4cd0),
.e-con:has(> .elementor-element-4e27367),
.e-con:has(> .elementor-element-97bbc63),
.e-con:has(> .elementor-element-4a93624),
.e-con:has(> .elementor-element-3147da8){
  --container-widget-height:auto;
  align-self:flex-start;
}

/* About page: community list was clipped too, but it is prose,
   not a product table — just uncap it. */
.elementor-element-e9c236a{
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
.e-con:has(> .elementor-element-e9c236a){
  --container-widget-height:auto;
}

/* ============================================================
   2. LEFTOVER MARQUEE ARROWS
   Every logo carousel has an icon widget beside it that acted as
   a marquee arrow and renders as a pale panel. The rows are
   static now, so none of them have anything to do.
   ============================================================ */
.e-con:has(> .elementor-widget-image-carousel) > .elementor-widget-icon{
  display:none !important;
}

/* ============================================================
   3. LOGO ROWS — same treatment as the home page
   ============================================================ */
@media (min-width:768px){
  .elementor-element-cf7fdc8 > .e-con-inner,
  .elementor-element-23df31f > .e-con-inner,
  .elementor-element-485581a > .e-con-inner,
  .elementor-element-57c38df > .e-con-inner,
  .elementor-element-f9a40fe > .e-con-inner{
    flex-direction:column !important;
    align-items:center !important;
    gap:24px !important;
  }
  .elementor-element-cf7fdc8 .elementor-widget-heading .elementor-heading-title,
  .elementor-element-23df31f .elementor-widget-heading .elementor-heading-title,
  .elementor-element-485581a .elementor-widget-heading .elementor-heading-title,
  .elementor-element-57c38df .elementor-widget-heading .elementor-heading-title,
  .elementor-element-f9a40fe .elementor-widget-heading .elementor-heading-title{
    text-align:center !important;
    font-size:.76rem !important;
    font-weight:700 !important;
    letter-spacing:.14em !important;
    text-transform:uppercase !important;
    color:#6B7280 !important;
  }
  .elementor-element-cf7fdc8 .elementor-widget-image-carousel,
  .elementor-element-23df31f .elementor-widget-image-carousel,
  .elementor-element-485581a .elementor-widget-image-carousel,
  .elementor-element-57c38df .elementor-widget-image-carousel,
  .elementor-element-f9a40fe .elementor-widget-image-carousel{
    width:100% !important;
  }
  .elementor-element-cf7fdc8 .swiper-wrapper,
  .elementor-element-23df31f .swiper-wrapper,
  .elementor-element-485581a .swiper-wrapper,
  .elementor-element-57c38df .swiper-wrapper,
  .elementor-element-f9a40fe .swiper-wrapper{
    display:flex !important;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:22px 40px;
    transform:none !important;
  }
  .elementor-element-cf7fdc8 .swiper-slide,
  .elementor-element-23df31f .swiper-slide,
  .elementor-element-485581a .swiper-slide,
  .elementor-element-57c38df .swiper-slide,
  .elementor-element-f9a40fe .swiper-slide{
    width:auto !important;
    margin:0 !important;
    flex:0 0 auto;
  }
  .elementor-element-cf7fdc8 .swiper-slide-duplicate,
  .elementor-element-23df31f .swiper-slide-duplicate,
  .elementor-element-485581a .swiper-slide-duplicate,
  .elementor-element-57c38df .swiper-slide-duplicate,
  .elementor-element-f9a40fe .swiper-slide-duplicate{
    display:none !important;
  }
  .elementor-element-cf7fdc8 .elementor-swiper-button,
  .elementor-element-23df31f .elementor-swiper-button,
  .elementor-element-485581a .elementor-swiper-button,
  .elementor-element-57c38df .elementor-swiper-button,
  .elementor-element-f9a40fe .elementor-swiper-button{
    display:none !important;
  }
}
/* Supplier marks: one height, white JPG backgrounds blended away */
.elementor-element-cf7fdc8 .swiper-slide img,
.elementor-element-23df31f .swiper-slide img,
.elementor-element-485581a .swiper-slide img,
.elementor-element-57c38df .swiper-slide img,
.elementor-element-f9a40fe .swiper-slide img{
  max-height:42px !important;
  height:42px !important;
  width:auto !important;
  max-width:150px !important;
  object-fit:contain !important;
  mix-blend-mode:multiply;
}
/* Accreditations keep colour and sit slightly larger */
.elementor-element-f9a40fe .swiper-slide img{
  max-height:46px !important;
  height:46px !important;
  max-width:140px !important;
  filter:none !important;
  opacity:1 !important;
}

/* ============================================================
   4. SAFETY COMMITMENT CARDS (Services, About)
   Same card as the home page: padding, radius, shadow, and both
   accreditation marks at one height.
   ============================================================ */
.e-con:has(> .elementor-element-4a61554),
.e-con:has(> .elementor-element-2080aab){
  background-color:#fff !important;
  border-radius:6px !important;
  box-shadow:0 10px 30px rgba(16,24,40,.10);
  --padding-top:44px;
  --padding-bottom:44px;
  --padding-left:46px;
  --padding-right:46px;
}
.elementor-element-4a61554 .elementor-heading-title,
.elementor-element-2080aab .elementor-heading-title{
  font-size:clamp(1.65rem, 1.1rem + 1.7vw, 2.4rem) !important;
  line-height:1.16 !important;
  letter-spacing:-.02em !important;
  font-weight:700 !important;
}
.elementor-element-e783a2a img,
.elementor-element-bc74ae4 img{
  height:78px !important;
  width:auto !important;
  max-width:none !important;
  object-fit:contain;
}

/* ============================================================
   5. GET IN TOUCH BANDS
   Same scale as the home page heading, and the band gets real
   vertical room instead of 20px.
   ============================================================ */
.elementor-element-dcf2500 > .e-con-inner,
.elementor-element-b140684 > .e-con-inner,
.elementor-element-5bc50bb > .e-con-inner,
.elementor-element-b13c066 > .e-con-inner,
.elementor-element-c5c00c7 > .e-con-inner{
  padding-top:56px !important;
  padding-bottom:56px !important;
}
.elementor-element-dcf2500 .elementor-widget-heading .elementor-heading-title,
.elementor-element-b140684 .elementor-widget-heading .elementor-heading-title,
.elementor-element-5bc50bb .elementor-widget-heading .elementor-heading-title,
.elementor-element-b13c066 .elementor-widget-heading .elementor-heading-title,
.elementor-element-c5c00c7 .elementor-widget-heading .elementor-heading-title{
  font-size:clamp(1.65rem, 1.1rem + 1.7vw, 2.4rem) !important;
  line-height:1.16 !important;
  letter-spacing:-.02em !important;
}

/* ============================================================
   6. SECTION RHYTHM — logo bands were tighter than the rest
   ============================================================ */
@media (min-width:768px){
  .elementor-element-cf7fdc8 > .e-con-inner,
  .elementor-element-23df31f > .e-con-inner,
  .elementor-element-485581a > .e-con-inner,
  .elementor-element-57c38df > .e-con-inner,
  .elementor-element-f9a40fe > .e-con-inner{
    padding-top:56px !important;
    padding-bottom:56px !important;
  }
}

/* ---- Safety card corrections -------------------------------
   Elementor's per-element rule outranks the :has() selector, so
   the padding needs the ids and !important. The About card also
   had its two marks at different heights (57px and 32px). */
.elementor-element-56fe020,
.elementor-element-76dc229{
  --padding-top:44px !important;
  --padding-bottom:44px !important;
  --padding-left:46px !important;
  --padding-right:46px !important;
  background-color:#fff !important;
  border-radius:6px !important;
  box-shadow:0 10px 30px rgba(16,24,40,.10);
}
.elementor-element-1461d07 img,
.elementor-element-f14979d img{
  height:78px !important;
  width:auto !important;
  max-width:none !important;
  object-fit:contain;
}

/* ---- Get in touch panel: cyan gradient -> navy --------------
   The panel is painted with
     linear-gradient(90deg, var(--e-global-color-6555a63), var(--e-global-color-d05ec0f))
   so redefining those two variables inside these sections turns
   the panel navy without touching any background-image — the map
   beside it is untouched. */
.elementor-element-dcf2500,
.elementor-element-b140684,
.elementor-element-5bc50bb,
.elementor-element-b13c066,
.elementor-element-c5c00c7{
  --e-global-color-6555a63:#000343;
  --e-global-color-d05ec0f:#000343;
}