/* JPiro Page Builder - frontend runtime CSS. Served as a file so browsers cache it. */
/* Full-width Section: breaks out of a boxed template to the window edges (two classes so it beats
   the section's own left/right margin rule). --jpb-vw comes from the script above. */
.jpb-bleed.jpb-bleed { margin-left: calc(50% - var(--jpb-vw, 100vw) / 2); margin-right: calc(50% - var(--jpb-vw, 100vw) / 2); }
.jpb-noscroll { overflow: hidden; }
/* Announcement bar: fixed to the window top / sticky; a fixed bar pushes the page down by its height. */
.jpb-ab.jpb-ab-fixed { position: fixed; top: 0; left: 0; right: 0; width: 100%; }
.jpb-ab.jpb-ab-sticky { position: sticky; top: 0; }
/* In the page editor's canvas an announcement bar is shown in the page flow, never fixed/sticky: it
   would sit over the editor toolbar and the properties panel. (The runtime CSS is also loaded in the
   live editor when a module on the page brings it in, hence the id selector.) */
#jpb-canvas .jpb-ab { position: relative !important; top: auto !important; left: auto !important; right: auto !important; z-index: auto !important; width: 100% !important; }
.jpb-ab[hidden] { display: none !important; }
html.jpb-ab-on { padding-top: var(--jpb-ab-h, 0px); }
.jpb-panel { position: fixed; inset: 0; z-index: 1055; display: none; overflow-y: auto; }
.jpb-panel:not([hidden]) { display: flex; }
.jpb-panel-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.5); opacity: 0; transition: opacity .3s ease; }
.jpb-panel.jpb-show .jpb-panel-backdrop { opacity: 1; }
.jpb-panel-dialog { outline: none; background: #fff; }
.jpb-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem; border-bottom: 1px solid #dee2e6; border-radius: inherit; border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.jpb-panel-title { margin: 0; font-size: 1.25rem; }
.jpb-panel-footer { display: flex; justify-content: flex-end; padding: .75rem 1rem; border-top: 1px solid #dee2e6; }
.jpb-panel-x { border: 0; background: none; font-size: 1.6rem; line-height: 1; padding: 0 .25rem; cursor: pointer; color: inherit; opacity: .6; }
.jpb-panel-x:hover { opacity: 1; }
.jpb-panel-modal { justify-content: center; align-items: flex-start; padding: 1.75rem .5rem; }
.jpb-panel-modal.jpb-centered { align-items: center; }
.jpb-panel-modal .jpb-panel-dialog { position: relative; width: var(--jpb-w, 500px); max-width: 100%; margin: 0 auto; border-radius: .5rem; box-shadow: 0 .5rem 2rem rgba(0,0,0,.3); transform: translateY(-30px); opacity: 0; transition: transform .3s ease, opacity .3s ease; }
.jpb-panel-modal.jpb-show .jpb-panel-dialog { transform: none; opacity: 1; }
.jpb-panel-offcanvas .jpb-panel-dialog { position: fixed; display: flex; flex-direction: column; box-shadow: 0 0 2rem rgba(0,0,0,.3); transition: transform .3s ease; }
.jpb-panel-offcanvas .jpb-panel-body { flex: 1 1 auto; overflow-y: auto; }
.jpb-oc-start .jpb-panel-dialog { top: 0; bottom: 0; left: 0; width: var(--jpb-w, 360px); max-width: 100%; transform: translateX(-100%); }
.jpb-oc-end .jpb-panel-dialog { top: 0; bottom: 0; right: 0; width: var(--jpb-w, 360px); max-width: 100%; transform: translateX(100%); }
.jpb-oc-top .jpb-panel-dialog { top: 0; left: 0; right: 0; height: var(--jpb-h, 40%); transform: translateY(-100%); }
.jpb-oc-bottom .jpb-panel-dialog { bottom: 0; left: 0; right: 0; height: var(--jpb-h, 40%); transform: translateY(100%); }
.jpb-panel-offcanvas.jpb-show .jpb-panel-dialog { transform: none; }
.jpb-pop-wrap { position: relative; display: inline-block; }
.jpb-popover { position: absolute; z-index: 1070; max-width: 90vw; text-align: left; background: #fff; border: 1px solid #dee2e6; box-shadow: 0 .25rem .75rem rgba(0,0,0,.15); }
.jpb-popover::before { content: ""; position: absolute; width: 10px; height: 10px; transform: rotate(45deg); background: #fff; border: 0 solid #dee2e6; }
.jpb-pop-title { padding: .5rem .75rem; font-weight: 600; border-bottom: 1px solid #dee2e6; }
.jpb-pop-body { padding: .75rem; }
.jpb-pop-bottom { top: 100%; left: 50%; transform: translateX(-50%); margin-top: .6rem; }
.jpb-pop-bottom::before { top: -6px; left: 50%; margin-left: -5px; border-top-width: 1px; border-left-width: 1px; }
.jpb-pop-top { bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: .6rem; }
.jpb-pop-top::before { bottom: -6px; left: 50%; margin-left: -5px; border-bottom-width: 1px; border-right-width: 1px; }
.jpb-pop-right { left: 100%; top: 50%; transform: translateY(-50%); margin-left: .6rem; }
.jpb-pop-right::before { left: -6px; top: 50%; margin-top: -5px; border-bottom-width: 1px; border-left-width: 1px; }
.jpb-pop-left { right: 100%; top: 50%; transform: translateY(-50%); margin-right: .6rem; }
.jpb-pop-left::before { right: -6px; top: 50%; margin-top: -5px; border-top-width: 1px; border-right-width: 1px; }
@media (prefers-reduced-motion: reduce) { .jpb-panel, .jpb-panel * { transition: none !important; } }
.jpb-anim-js [data-jpb-anim]:not([data-jpb-anim="attention"]):not(.jpb-anim-run) { opacity: 0; }
@keyframes jpb-at-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
@keyframes jpb-at-shake { 0%, 100% { transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { transform: translate3d(10px, 0, 0); } }
@keyframes jpb-at-tada { 0%, 100% { transform: scale(1); } 10%, 20% { transform: scale(.9) rotate(-3deg); } 30%, 50%, 70%, 90% { transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { transform: scale(1.1) rotate(-3deg); } }
@keyframes jpb-at-jello { 0%, 11.1%, 100% { transform: none; } 22.2% { transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { transform: skewX(-.78125deg) skewY(-.78125deg); } 77.7% { transform: skewX(.390625deg) skewY(.390625deg); } 88.8% { transform: skewX(-.1953125deg) skewY(-.1953125deg); } }
@keyframes jpb-at-swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } }
@keyframes jpb-at-wobble { 0%, 100% { transform: none; } 15% { transform: translate3d(-25%, 0, 0) rotate(-5deg); } 30% { transform: translate3d(20%, 0, 0) rotate(3deg); } 45% { transform: translate3d(-15%, 0, 0) rotate(-3deg); } 60% { transform: translate3d(10%, 0, 0) rotate(2deg); } 75% { transform: translate3d(-5%, 0, 0) rotate(-1deg); } }
@keyframes jpb-at-flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } }
@keyframes jpb-at-rubberband { 0%, 100% { transform: scale3d(1, 1, 1); } 30% { transform: scale3d(1.25, .75, 1); } 40% { transform: scale3d(.75, 1.25, 1); } 50% { transform: scale3d(1.15, .85, 1); } 65% { transform: scale3d(.95, 1.05, 1); } 75% { transform: scale3d(1.05, .95, 1); } }
@keyframes jpb-at-heartbeat { 0%, 70%, 100% { transform: scale(1); } 14%, 42% { transform: scale(1.3); } 28% { transform: scale(1); } }
@keyframes jpb-at-bounce { 0%, 20%, 53%, 100% { transform: translate3d(0, 0, 0); } 40%, 43% { transform: translate3d(0, -30px, 0) scaleY(1.1); } 70% { transform: translate3d(0, -15px, 0) scaleY(1.05); } 80% { transform: translate3d(0, 0, 0) scaleY(.95); } 90% { transform: translate3d(0, -4px, 0) scaleY(1.02); } }
@keyframes jpb-at-headshake { 0% { transform: translateX(0); } 6.5% { transform: translateX(-6px) rotateY(-9deg); } 18.5% { transform: translateX(5px) rotateY(7deg); } 31.5% { transform: translateX(-3px) rotateY(-5deg); } 43.5% { transform: translateX(2px) rotateY(3deg); } 50% { transform: translateX(0); } }
@keyframes jpb-a-move { from { opacity: 0; transform: translate3d(var(--jpb-ax, 0px), var(--jpb-ay, 0px), 0); } to { opacity: 1; transform: none; } }
@keyframes jpb-a-zoom { from { opacity: 0; transform: scale(var(--jpb-as, .6)); } to { opacity: 1; transform: none; } }
@keyframes jpb-a-rotate { from { opacity: 0; transform: rotate(var(--jpb-ar, -180deg)) scale(.6); } to { opacity: 1; transform: none; } }
@keyframes jpb-a-flip { from { opacity: 0; transform: perspective(800px) rotate3d(var(--jpb-fx, 1), var(--jpb-fy, 0), 0, 90deg); } to { opacity: 1; transform: none; } }
@keyframes jpb-a-bounce {
    0%   { opacity: 0; transform: translate3d(calc(var(--jpb-ax, 0px) * 2.5), calc(var(--jpb-ay, 0px) * 2.5), 0) scale(var(--jpb-as, 1)); }
    60%  { opacity: 1; transform: translate3d(calc(var(--jpb-ax, 0px) * -.25), calc(var(--jpb-ay, 0px) * -.25), 0) scale(1.05); }
    80%  { transform: translate3d(calc(var(--jpb-ax, 0px) * .1), calc(var(--jpb-ay, 0px) * .1), 0) scale(.98); }
    100% { opacity: 1; transform: none; }
}
.jpb-frontend-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 2000; display: flex; align-items: center; justify-content: center; }
.jpb-frontend-modal-box { position: relative; background: #fff; width: min(900px, 92vw); height: min(650px, 88vh); border-radius: .35rem; overflow: hidden; box-shadow: 0 .5rem 2rem rgba(0,0,0,.3); }
.jpb-frontend-modal-iframe { width: 100%; height: 100%; border: 0; }
.jpb-frontend-modal-close { position: absolute; top: .4rem; right: .4rem; z-index: 1; width: 2rem; height: 2rem; border: none; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px #dee2e6; cursor: pointer; font-size: 1.1rem; line-height: 1; }
.jpb-car-caption { position: absolute; left: 0; right: 0; bottom: 0; color: #fff; padding: 1rem 1.25rem; max-height: 100%; overflow-y: auto; box-sizing: border-box; }
.jpb-car-caption .jpb-car-cap-title { margin: 0 0 .25rem; }
.jpb-car-caption .jpb-car-cap-text { margin: 0; }
.jpb-car-textslide { display: flex; align-items: center; justify-content: center; }
.jpb-car-textslide .jpb-car-caption { position: static; flex: 1 1 auto; color: inherit; }
.jpb-car-btn { display: inline-block; margin-top: 1rem; padding: 8px 22px 10px; border-radius: 6px; text-decoration: none; }
[data-jpb-staging] { outline: 2px dashed #fd7e14; outline-offset: -2px; }
.jpb-lb-overlay { position: fixed; inset: 0; z-index: 2000; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2.5rem 3.5rem; background: rgba(0,0,0,.9); }
.jpb-lb-img { max-width: 100%; max-height: calc(100vh - 8rem); object-fit: contain; box-shadow: 0 .5rem 2rem rgba(0,0,0,.5); }
.jpb-lb-video { width: min(100%, 64rem); background: #000; }
.jpb-lb-frame { width: min(100%, 64rem); aspect-ratio: 16 / 9; max-height: calc(100vh - 8rem); border: 0; background: #000; box-shadow: 0 .5rem 2rem rgba(0,0,0,.5); }
.jpb-lb-src { color: #fff; text-decoration: underline; }
.jpb-lb-cap { margin-top: .75rem; color: #fff; text-align: center; font-size: .95rem; }
.jpb-lb-btn { position: absolute; width: 2.5rem; height: 2.5rem; border: 0; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.jpb-lb-btn:hover { background: rgba(255,255,255,.3); }
.jpb-lb-btn:focus-visible, .jpb-frontend-modal-close:focus-visible, .jpb-auto-pause:focus-visible, .jpb-bg-pause:focus-visible { outline: 3px solid #fff; outline-offset: 2px; box-shadow: 0 0 0 5px #000; }
/* Accessibility: text for screen readers only, and the pause button of the motions that start by themselves. */
.jpb-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.jpb-auto-pause, .jpb-bg-pause { position: absolute; z-index: 5; right: .5rem; bottom: .5rem; width: 2rem; height: 2rem; padding: 0; border: 0; border-radius: 50%; background: rgba(0,0,0,.55); color: #fff; font-size: .7rem; line-height: 2rem; text-align: center; cursor: pointer; opacity: .75; }
.jpb-auto-pause:hover, .jpb-auto-pause:focus-visible, .jpb-bg-pause:hover, .jpb-bg-pause:focus-visible { opacity: 1; }
.jpb-car-pause, .jpb-sl-pause { top: .5rem; bottom: auto; }
[data-jpb-pausable="corner"] { position: relative; }
.jpb-motion-paused, .jpb-motion-paused * { animation-play-state: paused !important; }
.jpb-auto-pause.is-inline { position: static; flex: none; align-self: center; margin: 0 .5rem; }
.jpb-auto-pause.is-after { position: static; display: block; margin: .25rem 0 .5rem; }
.jpb-lb-close { top: 1rem; right: 1rem; }
.jpb-lb-prev { left: 1rem; top: 50%; transform: translateY(-50%); }
.jpb-lb-next { right: 1rem; top: 50%; transform: translateY(-50%); }
@keyframes jpb-lc-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .jpb-lc-ready .jpb-lc-track { animation: none !important; } }
/* A photo made lighter by ImageOptimizer sits in a <picture>: the wrapper takes no box, so the block's own picture rules lay it out as before. */
picture.jpb-pic { display: contents; }
/* A map that waits for the visitor's consent: the panel stands in its place (Options > Maps). */
.jpb-consent { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .6rem; padding: 1rem 1.25rem; text-align: center; background: #e9ecef; color: #212529; font-size: .9rem; line-height: 1.4; }
.jpb-consent-text { margin: 0; max-width: 34rem; }
.jpb-consent-note { color: #6c757d; font-size: .8rem; }

/* transcript under a video or audio player (WCAG 1.2.1 / 1.2.3) */
.jpb-transcript { margin-top: .75rem; text-align: start; }
.jpb-transcript summary { cursor: pointer; font-weight: 600; }
.jpb-transcript-body { margin-top: .5rem; }

/* dynamic list with the visitors' controls (ListControls.php): the wrappers do not change the layout of the repeated
   blocks; controls, count and pages take the whole width of a row or grid */
.jpb-dl, .jpb-dl-items { display: contents; }

/* a sticky container (ComponentRegistry::stickyCss) needs room to move: the content of its column takes the height
   of the column, which is as tall as the row */
[class*="jpb-col-layout-"]:has(> [data-jpb-sticky]) { height: 100%; }
.jpb-dl-tools, .jpb-dl-status, .jpb-dl-pager, .jpb-dl-empty { flex: 0 0 100%; max-width: 100%; grid-column: 1 / -1; box-sizing: border-box; }
.jpb-dl-tools { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: flex-end; margin: 0 0 1rem; }
.jpb-dl-field { display: flex; flex-direction: column; gap: .25rem; min-width: min(14rem, 100%); }
.jpb-dl-field label { font-size: .9rem; font-weight: 600; margin: 0; }
.jpb-dl-status { font-size: .9rem; margin: 0 0 .75rem; }
.jpb-dl-status:empty { display: none; }
.jpb-dl-empty { margin: 0; }
.jpb-dl-pager { display: flex; flex-wrap: wrap; gap: .35rem; justify-content: center; margin: 1.25rem 0 0; }
.jpb-dl-pager a { min-width: 2.5rem; padding: .4rem .65rem; border: 1px solid currentColor; border-radius: .3rem; text-align: center; text-decoration: none; }
.jpb-dl-pager a[aria-current="page"] { font-weight: 700; text-decoration: underline; text-underline-offset: .2em; }
.jpb-dl-pager a.jpb-dl-more { border: 0; }
.jpb-dl-gap { padding: .4rem .25rem; }
.jpb-dl[aria-busy="true"] .jpb-dl-items > * { opacity: .55; transition: opacity .2s; }
/* buttons by initial (ListControls::letters) */
.jpb-dl-letters { flex: 0 0 100%; max-width: 100%; grid-column: 1 / -1; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: .35rem; margin: 0 0 1rem; }
.jpb-dl-letters a, .jpb-dl-letter-off { min-width: 2.75rem; padding: .4rem .7rem; border: 1px solid currentColor; border-radius: .3rem; text-align: center; text-decoration: none; line-height: 1.2; }
.jpb-dl-letters a[aria-current] { background: var(--bs-primary, #0d6efd); border-color: var(--bs-primary, #0d6efd); color: #fff; }
.jpb-dl-letter-off { opacity: .4; cursor: not-allowed; }
/* the loader: over the first results (which fade), without moving them */
.jpb-dl-loader { display: none; }
.jpb-dl[aria-busy="true"] .jpb-dl-loader { display: block; flex: 0 0 100%; max-width: 100%; grid-column: 1 / -1; height: 0; position: relative; z-index: 3; }
.jpb-dl[aria-busy="true"] .jpb-dl-loader::after { content: ""; position: absolute; left: 50%; top: .75rem; width: 2.25rem; height: 2.25rem; margin-left: -1.125rem; border: 3px solid currentColor; border-right-color: transparent; border-radius: 50%; opacity: .75; animation: jpb-dl-spin .8s linear infinite; }
@keyframes jpb-dl-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .jpb-dl[aria-busy="true"] .jpb-dl-loader::after { animation-duration: 2.4s; } }
/* the heading of a group of a grouped list (DynamicContent::takeHeads): the whole width of a grid or a row */
.jpb-dyn-ghead { grid-column: 1 / -1; width: 100%; max-width: 100%; }

/* a popup with no button: its editor placeholder is never shown on the site */
.jpb-trg-none {
    display: none !important;
}

/* an article of a category blog drawn by a category template (cards): the site template's own frame of the
   article goes, the card is the template's */
.blog-item:has(> .jppagebuilder-page.jpb-card) {
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
}
/* Built-in control icons (BuiltinIcon): follow the font size and the text colour, like a glyph. */
.jpb-svg-ic { width: 1em; height: 1em; display: inline-block; vertical-align: -.125em; flex: none; }