/* Independent layer layout. The legacy section merely transports source through KEditor,
 * it does not form the page layout: no .cc-builder-row or column selectors are used. */
.cc-vb-freeform-canvas{position:relative!important;width:100%!important;max-width:100%;min-height:300px;isolation:isolate;box-sizing:border-box;overflow:visible;clear:both}
.cc-vb-freeform-canvas .cc-vb-freeform-layer{position:absolute;box-sizing:border-box;max-width:100%;min-width:0;overflow-wrap:anywhere}
.cc-vb-freeform-layer .cc-vb-freeform-content{width:100%;height:100%;min-height:inherit;box-sizing:border-box;overflow-wrap:anywhere}
.cc-vb-freeform-layer .cc-vb-freeform-content > :is(p,h1,h2,h3,h4,h5,h6){margin:0;max-width:100%;font-size:inherit;color:inherit;line-height:inherit;letter-spacing:inherit}
.cc-vb-freeform-layer[data-vb-kind=image] .cc-vb-freeform-content{overflow:hidden;border-radius:inherit;height:100%;min-height:0}.cc-vb-freeform-layer .cc-vb-freeform-content > img{width:100%;height:100%;display:block;object-fit:contain;max-width:100%}.cc-vb-freeform-layer[data-vb-fit=cover] img{object-fit:cover}.cc-vb-freeform-layer[data-vb-fit=fill] img{object-fit:fill}.cc-vb-freeform-layer[data-vb-fit=none] img{object-fit:none}.cc-vb-freeform-layer[data-vb-fit=scale-down] img{object-fit:scale-down}
.cc-vb-freeform-layer[data-vb-kind=shape] .cc-vb-freeform-content{height:100%;min-height:inherit}
.cc-vb-freeform-layer[data-vb-kind=shape] .cc-vb-freeform-shape{display:block;width:100%;height:100%;min-height:inherit;background:inherit;border-radius:inherit}
.cc-vb-freeform-layer[data-vb-kind=button] .cc-vb-freeform-content>a{display:inline-block;background:var(--cc-button-bg,#174EA6);color:var(--cc-button-text,#fff);text-decoration:none;border-radius:var(--cc-button-radius,8px);padding:var(--cc-button-padding-y,12px) var(--cc-button-padding-x,20px);max-width:100%;font-weight:600}
.cc-vb-freeform-canvas>[data-vb-freeform-end]{display:none!important}
/* Page content must remain usable on small screens even when desktop positions are intricate.
 * Per-layer tablet/mobile styles generated by the existing Visual Builder runtime override this fallback. */
@media(max-width:767px){
 .cc-vb-freeform-canvas{display:flex!important;flex-direction:column!important;gap:14px!important;min-height:0!important}
 .cc-vb-freeform-canvas>.cc-vb-freeform-layer{position:relative!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;width:100%!important;max-width:100%!important;min-height:0!important;height:auto!important;transform:none!important}
 .cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=shape]{min-height:70px!important}
}

/* Round 9: full-bleed canvas without changing the theme's content grid or legacy saves. */
.cc-vb-freeform-canvas[data-vb-canvas-width="full"]{width:100vw!important;max-width:none!important;left:50%;margin-left:-50vw}
.cc-vb-freeform-layer .cc-vb-freeform-content > :is(p,h1,h2,h3,h4,h5,h6){font-family:inherit}

/* Rich text uses a block editable root so Enter and CKEditor lists can create paragraphs. */
.cc-vb-freeform-layer .cc-vb-text-body{font:inherit;color:inherit;line-height:1.4;overflow-wrap:anywhere}
.cc-vb-freeform-layer .cc-vb-text-body p{margin:0 0 .65em;color:inherit;font:inherit}
.cc-vb-freeform-layer .cc-vb-text-body :is(ul,ol){padding-left:1.5em;margin:.4em 0}

/* Theme-owned content width: never invent a replacement max width. The nearest
   layout wrapper is respected automatically; supported CSS variables narrow it.
   100% remains the fallback for fluid themes with no explicit container size. */
.cc-vb-freeform-canvas[data-vb-canvas-width="contained"]{
 width:100%!important;
 max-width:100%!important;
 margin-inline:auto;
}
/* The theme owns content width. Check its CSS custom properties first, then
   the live wrapper width in edit mode; in fluid themes this simply remains 100%. */
.cc-vb-freeform-canvas[data-vb-canvas-width="contained"]{
 max-width:min(100%,var(--container-width,var(--site-container-width,var(--container-max-width,var(--content-width,var(--wrapper-width,var(--cc-vb-theme-wrapper-width,100%)))))))!important;
}

/* Persisted, safe shape variants: choice is a data attribute, never freeform CSS. */
.cc-vb-freeform-layer[data-vb-kind=shape]{line-height:0}
.cc-vb-freeform-layer[data-vb-shape=circle] .cc-vb-freeform-shape{border-radius:50%}
.cc-vb-freeform-layer[data-vb-shape=ellipse] .cc-vb-freeform-shape{border-radius:50%}
.cc-vb-freeform-layer[data-vb-shape=square] .cc-vb-freeform-shape{aspect-ratio:1/1;width:min(100%,100cqh);height:auto}
.cc-vb-freeform-layer[data-vb-shape=triangle] .cc-vb-freeform-shape{clip-path:polygon(50% 0%,0 100%,100% 100%)}
.cc-vb-freeform-layer[data-vb-shape=star] .cc-vb-freeform-shape{clip-path:polygon(50% 0%,63% 34%,98% 35%,70% 57%,80% 92%,50% 72%,20% 92%,30% 57%,2% 35%,37% 34%)}
.cc-vb-freeform-layer[data-vb-shape=diamond] .cc-vb-freeform-shape{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.cc-vb-freeform-layer[data-vb-shape=hexagon] .cc-vb-freeform-shape{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}
.cc-vb-freeform-layer[data-vb-shape=arrow] .cc-vb-freeform-shape{clip-path:polygon(0 30%,65% 30%,65% 0,100% 50%,65% 100%,65% 70%,0 70%)}
.cc-vb-freeform-layer[data-vb-shape=line] .cc-vb-freeform-shape{height:100%;min-height:0}

/* Round 11: trim every visual layer to its actual rounded content bounds.
   Transform and radius handles stay attached to the unclipped outer layer. */
.cc-vb-freeform-canvas>.cc-vb-freeform-layer>.cc-vb-freeform-content{
 border-radius:inherit;overflow:hidden;overflow:clip;isolation:isolate;
}
.cc-vb-freeform-layer[data-vb-kind=heading] .cc-vb-freeform-content,
.cc-vb-freeform-layer[data-vb-kind=text] .cc-vb-freeform-content{
 overflow-wrap:anywhere;
}
.cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=image] .cc-vb-freeform-content>img{
 width:100%;height:100%;max-width:none;object-position:center;
}
/* Mobile is determined by the *canvas*, not just the window, so in-editor
   device preview matches the site's real responsive layout. */
@media(max-width:767px){
 .cc-vb-freeform-canvas>.cc-vb-freeform-layer{box-sizing:border-box!important;}
 .cc-vb-freeform-canvas{padding:0 8px;min-width:0;}
}

/* Round 12: new text retains genuine inner padding even after rich-text editing.
   Natural-height text avoids unintended clipping of longer CKEditor content. */
.cc-vb-freeform-layer[data-vb-kind=text]>.cc-vb-freeform-content,
.cc-vb-freeform-layer[data-vb-kind=heading]>.cc-vb-freeform-content{height:auto;min-height:inherit}

/* Shape fill must be clipped to its silhouette, not painted as a rectangle behind it. */
.cc-vb-freeform-layer[data-vb-kind=shape]{background-color:transparent!important;background-image:none!important;}
.cc-vb-freeform-layer[data-vb-kind=shape] .cc-vb-freeform-content{background-color:transparent!important;}
.cc-vb-freeform-layer[data-vb-kind=shape] .cc-vb-freeform-shape{background:var(--cc-vb-shape-fill,#dceffc)!important;}
/* Visual Builder buttons are independent visual layers, not native page-builder buttons. */
.cc-vb-freeform-layer[data-vb-kind=button]{background-color:var(--cc-button-bg,#174EA6);color:var(--cc-button-text,#fff);}
.cc-vb-freeform-layer[data-vb-kind=button] .cc-vb-freeform-content>a{display:flex;align-items:center;justify-content:center;background:transparent;color:inherit;width:100%;box-sizing:border-box;border-radius:inherit;padding:0;}

/* Round 20: shape dimensions are not constrained by generic content min-height. */
.cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=shape],
.cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=shape]>.cc-vb-freeform-content,
.cc-vb-freeform-layer[data-vb-kind=shape] .cc-vb-freeform-shape{min-height:1px!important;}
.cc-vb-freeform-layer[data-vb-shape=custom] .cc-vb-freeform-shape{clip-path:none!important;background:transparent!important;}
.cc-vb-freeform-layer[data-vb-shape=custom] .cc-vb-custom-svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none;}
.cc-vb-freeform-layer[data-vb-shape=custom] .cc-vb-custom-svg path{fill:var(--cc-vb-shape-fill,#dceffc);}
/* The link inherits the layer's selected text colour, even with theme link defaults. */
.cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=button]>.cc-vb-freeform-content>a,
.cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=button]>.cc-vb-freeform-content>a *{
 color:inherit!important;
}
@media(max-width:767px){
 .cc-vb-freeform-canvas>.cc-vb-freeform-layer[data-vb-kind=shape]{min-height:1px!important;height:var(--cc-vb-mobile-shape-height,auto)!important;}
}

/* Round 21 - faithfully inherit editor-assigned font weight and use cover as the image default. */
.cc-vb-freeform-layer[data-vb-kind=heading] .cc-vb-freeform-content > :is(h1,h2,h3,h4,h5,h6),
.cc-vb-freeform-layer[data-vb-kind=text] .cc-vb-text-body,
.cc-vb-freeform-layer[data-vb-kind=text] .cc-vb-text-body > :is(p,div,ul,ol){font-weight:inherit!important;}
.cc-vb-freeform-layer[data-vb-kind=image]:not([data-vb-fit]) .cc-vb-freeform-content > img{object-fit:cover;}
.cc-vb-freeform-layer[data-vb-shape=pen] .cc-vb-freeform-shape{clip-path:none!important;background:transparent!important;}
.cc-vb-freeform-layer[data-vb-shape=pen] .cc-vb-custom-svg{display:block;width:100%;height:100%;overflow:visible;pointer-events:none;}

/* Round 22: preserve visual layer typography when theme headings set a font size. */
.cc-vb-freeform-canvas > .cc-vb-freeform-layer[data-vb-kind=heading] > .cc-vb-freeform-content > :is(h1,h2,h3,h4,h5,h6),
.cc-vb-freeform-canvas > .cc-vb-freeform-layer[data-vb-kind=text] > .cc-vb-freeform-content > .cc-vb-text-body{font-size:inherit!important;}

/* Non-flattened SVG composite and clipped image layers. */
.cc-vb-freeform-layer[data-vb-shape="composite"] .cc-vb-freeform-shape{
 background:transparent!important;clip-path:none!important;
}
.cc-vb-freeform-layer[data-vb-shape="composite"] .cc-vb-custom-svg{
 display:block;width:100%;height:100%;overflow:visible;pointer-events:none;
}
.cc-vb-freeform-layer[data-vb-shape="composite"] .cc-vb-custom-svg > path,
.cc-vb-freeform-layer[data-vb-shape="composite"] .cc-vb-custom-svg > g > path{fill:var(--cc-vb-shape-fill,#dceffc)}
.cc-vb-freeform-layer[data-vb-mask] .cc-vb-freeform-content > img{object-fit:cover;}
.cc-vb-freeform-layer[data-vb-mask] .cc-vb-image-mask-def{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}