/* Shared styles for page-builder-rendered content (public site + builder canvas) */ /* Reserve scrollbar width so toggling overflow does not shift centered content horizontally. Class is set on in layout.php (same condition as body.has-page-builder-background) so we avoid relying on :has(), which can miss in some browsers. */ html.has-page-builder-root { scrollbar-gutter: stable; } body.has-page-builder-background { min-height: 100vh; } /* Memorial .layout-main is capped at 42rem in style.css; builder pages override to full width. Section width % must use that same full-width column in the builder canvas (no artificial max-width on .builder-canvas-inner). */ body.has-page-builder-background .layout-main { position: relative; z-index: 1; max-width: none; width: 100%; min-height: 100vh; display: flex; flex-direction: column; box-sizing: border-box; } .pb-bg-video-wrap { position: fixed; inset: 0; z-index: 0; overflow: hidden; } .pb-bg-video { width: 100%; height: 100%; object-fit: cover; } .pb-bg-slideshow-wrap { position: fixed; inset: 0; z-index: 0; overflow: hidden; } .pb-bg-slideshow-slide { position: absolute; inset: 0; background-size: cover; background-position: center; } .pb-page { flex: 1; display: flex; flex-direction: column; min-height: 0; width: 100%; box-sizing: border-box; } .pb-section { --pb-section-width: 100; --pb-section-padding-v: 32; --pb-section-padding-h: 24; --pb-section-margin: 6; --pb-section-radius: 0; --pb-section-size: 16; --pb-section-content-spacing: 16; width: 100%; max-width: none; margin: 0; padding: calc(var(--pb-section-padding-v, 32) * 1px) calc(var(--pb-section-padding-h, 24) * 1px); font-size: calc(var(--pb-section-size, 16) * 1px); } .pb-section.layout-two-column { display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--pb-section-content-spacing, 16) * 1px); align-items: center; } /* Section root uses a 2-col grid historically; block elements must span both tracks. Side-by-side belongs in a columns container. */ .pb-section.layout-two-column > * { grid-column: 1 / -1; width: 100%; box-sizing: border-box; } .pb-section.layout-stack { display: flex; flex-direction: column; gap: calc(var(--pb-section-content-spacing, 16) * 1px); } .pb-section.layout-row { display: flex; flex-direction: row; flex-wrap: wrap; gap: calc(var(--pb-section-content-spacing, 16) * 1px); align-items: center; } .pb-section.section-style-box { width: min(100%, min(56rem, calc(var(--pb-section-width, 100) * 1%))); margin-left: auto; margin-right: auto; margin-top: calc(var(--pb-section-margin, 6) * 1px); margin-bottom: calc(var(--pb-section-margin, 6) * 1px); background: rgba(255, 255, 255, 0.8); border: 1px solid rgba(15, 23, 42, 0.08); border-radius: calc(var(--pb-section-radius, 0) * 1px); } .pb-section.section-style-wide-box { width: min(100%, min(90rem, calc(var(--pb-section-width, 100) * 1%))); margin-left: auto; margin-right: auto; margin-top: calc(var(--pb-section-margin, 6) * 1px); margin-bottom: calc(var(--pb-section-margin, 6) * 1px); background: rgba(255, 255, 255, 0.72); border: 1px solid rgba(15, 23, 42, 0.06); border-radius: 0; } .pb-section.section-style-tall-box { width: min(100%, min(56rem, calc(var(--pb-section-width, 100) * 1%))); margin-left: auto; margin-right: auto; min-height: 85vh; display: flex; flex-direction: column; /* flex-start: avoid re-centering when tab/content height changes inside the min-height box */ justify-content: flex-start; background: rgba(255, 255, 255, 0.8); border: 1px solid rgba(15, 23, 42, 0.08); border-radius: 0; } /* Fixed pixel width (builder + live): --pb-section-width-px set on section; still capped by viewport and 56rem/90rem. */ .pb-section.section-style-box.pb-section-width-px, .pb-section.section-style-tall-box.pb-section-width-px { width: min(100%, min(56rem, calc(var(--pb-section-width-px, 800) * 1px))); } .pb-section.section-style-wide-box.pb-section-width-px { width: min(100%, min(90rem, calc(var(--pb-section-width-px, 800) * 1px))); } .pb-section.section-position-left, .pb-section.section-position-top-left, .pb-section.section-position-bottom-left { margin-left: 0; margin-right: auto; } .pb-section.section-position-right, .pb-section.section-position-top-right, .pb-section.section-position-bottom-right { margin-left: auto; margin-right: 0; } .pb-section.section-position-top, .pb-section.section-position-top-left, .pb-section.section-position-top-right { margin-top: 0; margin-bottom: auto; } .pb-section.section-position-bottom, .pb-section.section-position-bottom-left, .pb-section.section-position-bottom-right { margin-top: auto; margin-bottom: 0; } /* Center in the page column (flex parent: .pb-page or .builder-canvas-inner). Vertical margin:auto distributes free space above/below the section. Content height changes will shift the block (expected for true vertical centering). */ .pb-section.section-position-center { margin-top: auto; margin-bottom: auto; margin-left: auto; margin-right: auto; } .pb-section.content-align-left { text-align: left; } .pb-section.content-align-center { text-align: center; } .pb-section.content-align-right { text-align: right; } .pb-section.layout-stack.content-align-left { align-items: flex-start; } .pb-section.layout-stack.content-align-center { align-items: center; } .pb-section.layout-stack.content-align-right { align-items: flex-end; } .pb-section.layout-row.content-align-left { justify-content: flex-start; } .pb-section.layout-row.content-align-center { justify-content: center; } .pb-section.layout-row.content-align-right { justify-content: flex-end; } .pb-text { margin: 0; word-break: break-word; display: block; width: 100%; box-sizing: border-box; } .pb-text .pb-inline-svg { display: inline-block; vertical-align: -0.15em; line-height: 1; } .pb-text .pb-inline-svg svg { display: block; width: 1em; height: 1em; } .pb-text.pb-level-h1 { font-size: 1.75em; font-weight: 600; } .pb-text.pb-level-h2 { font-size: 1.375em; font-weight: 600; } .pb-text.pb-level-h3 { font-size: 1.125em; font-weight: 600; } .pb-text.pb-level-p { font-size: 1em; line-height: 1.6; } .pb-text.pb-overline { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.75em; opacity: 0.85; margin-bottom: 0.35rem; } .pb-text a:not(.pb-tabs-tab) { color: inherit; text-decoration: underline; text-underline-offset: 0.15em; } .pb-list { --pb-list-item-spacing: 0.35rem; --pb-list-indent: 1.25rem; --pb-list-icon-size: 1em; list-style-position: inside; margin: 0; padding-left: var(--pb-list-indent); width: 100%; box-sizing: border-box; } .pb-list .pb-list-item + .pb-list-item { margin-top: var(--pb-list-item-spacing); } .pb-list .pb-list-item::marker { color: var(--pb-list-icon-color, currentColor); font-size: var(--pb-list-icon-size); } .pb-list.pb-list-bullet-circle { list-style-type: circle; } .pb-list.pb-list-bullet-square { list-style-type: square; } .pb-list.pb-list-bullet-disc { list-style-type: disc; } .pb-list.pb-list-bullet-none { list-style-type: none; padding-left: 0; } /* Numbered lists: explicit types so markers match sidebar even if
    is ignored */ .pb-list.pb-list-numbered.pb-list-num-decimal { list-style-type: decimal; } .pb-list.pb-list-numbered.pb-list-num-lower-alpha { list-style-type: lower-alpha; } .pb-list.pb-list-numbered.pb-list-num-upper-alpha { list-style-type: upper-alpha; } .pb-list.pb-list-numbered.pb-list-num-lower-roman { list-style-type: lower-roman; } .pb-list.pb-list-numbered.pb-list-num-upper-roman { list-style-type: upper-roman; } .pb-list.pb-list-bullet-dash { list-style: none; padding-left: 0; } .pb-list.pb-list-bullet-dash .pb-list-item { position: relative; padding-left: 1rem; } .pb-list.pb-list-bullet-dash .pb-list-item::before { content: "—"; position: absolute; left: 0; color: var(--pb-list-icon-color, currentColor); } .pb-list.pb-list-links-plain a { text-decoration: none; } .pb-list .pb-list-item-text a { color: inherit; text-decoration: underline; text-underline-offset: 0.15em; } /* Scroll-triggered text animations (public page; script toggles .pb-anim-visible) */ .pb-anim { transition: opacity 1s ease, transform 1s ease; will-change: opacity, transform; } .pb-anim-pending.pb-anim-fade-in { opacity: 0; } .pb-anim-visible.pb-anim-fade-in { opacity: 1; } .pb-anim-pending.pb-anim-fade-up { opacity: 0; transform: translateY(14px); } .pb-anim-visible.pb-anim-fade-up { opacity: 1; transform: translateY(0); } .pb-anim-pending.pb-anim-fade-down { opacity: 0; transform: translateY(-14px); } .pb-anim-visible.pb-anim-fade-down { opacity: 1; transform: translateY(0); } .pb-anim-pending.pb-anim-fade-left { opacity: 0; transform: translateX(18px); } .pb-anim-visible.pb-anim-fade-left { opacity: 1; transform: translateX(0); } .pb-anim-pending.pb-anim-fade-right { opacity: 0; transform: translateX(-18px); } .pb-anim-visible.pb-anim-fade-right { opacity: 1; transform: translateX(0); } .pb-image-wrap { line-height: 0; min-width: 0; } .pb-image-wrap img { max-width: 100%; height: auto; display: block; vertical-align: middle; } /* Image width: span section content (cancel horizontal padding) */ .pb-image-wrap.pb-image-edge-to-edge { width: calc(100% + 2 * var(--pb-section-padding-h, 24) * 1px); max-width: none; margin-left: calc(-1 * var(--pb-section-padding-h, 24) * 1px); margin-right: calc(-1 * var(--pb-section-padding-h, 24) * 1px); box-sizing: border-box; } /* Image width: viewport (break out of page column) */ .pb-image-wrap.pb-image-full-bleed { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); position: relative; box-sizing: border-box; } /* Builder mobile preview: 100vw is the browser window, not the phone frame — clip to canvas inner */ .builder-canvas-wrap.viewport-mobile .pb-image-wrap.pb-image-full-bleed { width: 100%; max-width: 100%; margin-left: 0; margin-right: 0; } .builder-canvas-wrap.viewport-mobile .pb-image-wrap.pb-image-edge-to-edge { width: 100%; max-width: none; margin-left: 0; margin-right: 0; } /* Tall box: ~85% of chosen device height in mobile preview (var set on .builder-canvas-inner) */ .builder-canvas-wrap.viewport-mobile .pb-section.section-style-tall-box { min-height: min(580px, calc(var(--builder-mobile-vp-h, 681) * 0.85)); } .pb-video-wrap { position: relative; box-sizing: border-box; } .pb-video-aspect { width: 100%; box-sizing: border-box; /* Clip