/* One outer grid. Keep full-bleed backgrounds and intentional panel insets. */
:root {
 --vlas-grid-max:1280px;
 --vlas-grid-gutter:max(40px,env(safe-area-inset-left),env(safe-area-inset-right));
 --vlas-grid-width:min(var(--vlas-grid-max),calc(100% - 2 * var(--vlas-grid-gutter)));
}
@media(max-width:1100px) { :root { --vlas-grid-gutter:max(24px,env(safe-area-inset-left),env(safe-area-inset-right)); } }
@media(max-width:767px) { :root { --vlas-grid-gutter:max(20px,env(safe-area-inset-left),env(safe-area-inset-right)); } }

/* Native components and legacy sections share the same outer edges. */
body .vlas-hc-frame,body .vlas-service-wrap {
 width:var(--vlas-grid-width);
 max-width:var(--vlas-grid-max);
 margin-inline:auto;
}
body .elementor-section.elementor-top-section.elementor-section-boxed {
 padding-inline:0 !important;
}
body .elementor-section.elementor-top-section.elementor-section-boxed > .elementor-container {
 width:var(--vlas-grid-width);
 max-width:var(--vlas-grid-max);
 margin-inline:auto;
}
/* Remove only the OUTSIDE column gaps, not nested rows or internal column gaps.
   Four verified coloured form panels keep their own readable inner padding. */
body .elementor-top-section.elementor-section-boxed > .elementor-container > .elementor-column:first-child:not(:is(.elementor-element-083dbf7,.elementor-element-95e8604,.elementor-element-e3327b5,.elementor-element-f022d5c)) > .elementor-widget-wrap {
 padding-left:0 !important;
}
body .elementor-top-section.elementor-section-boxed > .elementor-container > .elementor-column:last-child:not(:is(.elementor-element-083dbf7,.elementor-element-95e8604,.elementor-element-e3327b5,.elementor-element-f022d5c)) > .elementor-widget-wrap {
 padding-right:0 !important;
}
@media(max-width:767px) {
 body .elementor-top-section.elementor-section-boxed > .elementor-container > .elementor-column:not(:is(.elementor-element-083dbf7,.elementor-element-95e8604,.elementor-element-e3327b5,.elementor-element-f022d5c)) > .elementor-widget-wrap {
  padding-inline:0 !important;
 }
}

/* Kadence default pages already have a content frame: don't nest another one. */
body .site-container {
 box-sizing:border-box;
 width:100%;
 max-width:calc(var(--vlas-grid-max) + 2 * var(--vlas-grid-gutter));
 padding-inline:var(--vlas-grid-gutter);
 margin-inline:auto;
}
body .content-container .elementor-top-section.elementor-section-boxed > .elementor-container {
 width:100%;
 max-width:none;
}
/* Elementor stretches these sections at runtime, outside the Kadence frame. */
body .content-container .elementor-top-section.elementor-section-stretched.elementor-section-boxed > .elementor-container {
 width:var(--vlas-grid-width);
 max-width:var(--vlas-grid-max);
}
/* The default page entry is an outer shell, not an intentionally inset panel. */
body .content-container:has(.elementor) .entry-content-wrap { padding-inline:0; }
/* Kadence's boxed-entry bleed must not pull the card outside the shared frame. */
body .content-container .entry { width:100% !important; min-width:0; margin-inline:0 !important; }
body .content-container:has(.vlas-policy) .entry-content-wrap { padding-inline:0; }
body .content-container .vlas-policy { width:100%; }

/* Existing decorative-finishes copy is four newspaper columns even on phones.
   At320px it overflows on production too. Change only this known list layout. */
@media(max-width:767px) {
 body .elementor-77662 .elementor-element.elementor-element-168e346 { columns:2; column-gap:20px; }
}
@media(max-width:359px) {
 body .elementor-77662 .elementor-element.elementor-element-168e346 { columns:1; }
}

/* Shared article frame, banner label, navigation and related posts. */
body :is(.vlas-article-layout,.vlas-article-banner > div,.vlas-article-bottom) {
 box-sizing:border-box;
 width:var(--vlas-grid-width);
 max-width:var(--vlas-grid-max);
 padding-inline:0;
 margin-inline:auto;
}
body .vlas-article-cta {
 padding-inline:max(var(--vlas-grid-gutter),calc((100% - var(--vlas-grid-max)) / 2));
}
body .vlas-policy { width:var(--vlas-grid-width); }
/* A common outer frame is not a reason to stretch long legal prose. */
body .vlas-policy > section { max-width:75ch; }

/* The mobile dock is full bleed; its two equal actions follow the grid. */
body .vlas-hc-dock {
 padding-inline:max(var(--vlas-grid-gutter),calc((100% - var(--vlas-grid-max)) / 2));
}
body .vlas-hc-drawer :is(.vlas-hc-dialog-top,.vlas-hc-drawer-body,.vlas-hc-drawer-foot) {
 padding-inline:var(--vlas-grid-gutter);
}