/* Elementor Pro sticky header (sticky: top, all devices, offset 0) re-implemented with CSS. */
header.elementor-location-header{position:sticky;top:0;z-index:99}
.er-hp{display:none!important}
.er-turnstile{margin-bottom:0}
.er-turnstile:empty{display:none}

/* Design round 1 (deliberate deviation from 1:1): consistent side gutters on phones and
   tablets (<=900px). Design round 2 moved the cut-off from Elementor's 1024px tablet breakpoint
   to 900px: at 901-1024px the gutter made content up to 48px narrower than live, so from 901px
   up the layout is live's (pixel-identical at >=1025px, live's tablet layout at 901-1024px).
   Padding goes on the outermost section/container, so full-bleed backgrounds still bleed
   while the content inside them is inset. max() keeps any larger Elementor padding; nested
   e-parent containers (templates inside templates) are skipped to avoid double gutters.
   Some service-page containers have no per-element CSS on live (no --display), so they
   render display:inline and would ignore side padding; display falls back to block here. */
@media (max-width:900px){
  :root{--er-gutter:clamp(16px,4vw,24px)}
  .e-con.e-parent:not(.e-parent .e-parent){
    display:var(--display,block);
    padding-inline-start:max(var(--padding-inline-start,0px),var(--er-gutter));
    padding-inline-end:max(var(--padding-inline-end,0px),var(--er-gutter))
  }
  .elementor-section.elementor-top-section>.elementor-container{
    padding-inline:var(--er-gutter)
  }
  /* non-Elementor theme wrapper (Hello Elementor, e.g. /privacy-policy/) */
  body:not(#er-gutter) .site-main{
    padding-inline:max(10px,var(--er-gutter))
  }
}
/* Design round 3 (deliberate deviation from 1:1, requested by Jacob): a desktop side gutter above
   900px, because live runs full-width content to the screen edges at 1000-1440px. Same approach as
   the <=900px rule: padding on the outermost section/container only, so full-bleed backgrounds still
   reach the edges and only content is inset; max() keeps any larger Elementor padding; nested
   e-parent containers are skipped. Boxed content (max-width 1140px, or a narrower container width)
   whose width already fits inside viewport-minus-gutter is unchanged: the boxed inner is
   min(100%,content-width), and for legacy boxed sections the padding only makes up the part of the
   gutter that the centred 1140px box doesn't already leave. Containers with no per-element CSS (the
   service pages) have no --display and fall back to display:inline, where padding does nothing, so
   they get the same display:block fallback as on mobile. Two text clips at 1025-1366px that live
   already has, and that the gutter would worsen, are fixed here too: the home service tabs (titles
   are table cells that overflow the tab bar) and the footer email (a break point after the @, from an empty
   span added at build time in WpPage.astro and a zero-width space added here). Also on live, at 901-1024px the home "Our Professional Roofing
   Services" row keeps the image column at its tablet width of 100% with flex-shrink 0, so the text
   column is pushed off-screen and the section shows only a 2,300px-tall image; above 900px it now
   keeps its desktop width (27.059%), as on live at 1025px+. */
@media (min-width:901px){
  :root{--er-gutter-d:clamp(24px,2.5vw,32px)}
  .e-con.e-parent:not(.e-parent .e-parent){
    display:var(--display,block);
    padding-inline-start:max(var(--padding-inline-start,0px),var(--er-gutter-d));
    padding-inline-end:max(var(--padding-inline-end,0px),var(--er-gutter-d))
  }
  .elementor-section.elementor-top-section.elementor-section-boxed>.elementor-container{
    padding-inline:clamp(0px,calc(var(--er-gutter-d) - (100% - 1140px)/2),var(--er-gutter-d))
  }
  .elementor-section.elementor-top-section.elementor-section-full_width>.elementor-container{
    padding-inline:var(--er-gutter-d)
  }
}
@media (min-width:901px) and (max-width:1366px){
  body .elementor-widget-tabs.elementor-tabs-view-horizontal .elementor-tab-title.elementor-tab-desktop-title{
    padding-inline:15px;font-size:min(22px,calc(1.6vw + 1px))
  }
}
@media (min-width:901px) and (max-width:1024px){
  .elementor-1941 .elementor-element.elementor-element-7443dc7.e-con{--width:27.059%}
  body .elementor-widget-tabs.elementor-tabs-view-horizontal .elementor-tab-title.elementor-tab-desktop-title{padding-inline:10px}
}
@media (min-width:901px){.er-at::before{content:"\200B"}}