/* PM Builder — everything a page built in the editor relies on that the
   design system does not already provide. Ships inlined into every saved
   page. Own CSS throughout; class names are pmb-*. */

:root { --pmb-gap: 2rem; --pmb-brand: var(--pm-color-primary, #e6007e); --pmb-accent: var(--pm-accent, #0ea5e9); --pmb-alert: #dc2626; --pmb-success: #16a34a; --pmb-radius: var(--pm-radius-card, 8px); --pmb-border: var(--pm-color-border-subtle, rgba(0,0,0,.1)); --pmb-surface: var(--pm-color-surface-subtle, #f3f4f6); }

/* ---- text helpers ---- */
.pmb-text-left { text-align: left; } .pmb-text-center { text-align: center; } .pmb-text-right { text-align: right; }
.pmb-text-center .pmb-btn, .pmb-text-center .pmb-divider-line { margin-left: auto; margin-right: auto; }
.pmb-light { color: #fff; }
.pmb-light .pm-muted, .pmb-light h1, .pmb-light h2, .pmb-light h3, .pmb-light h4, .pmb-light h5, .pmb-light h6, .pmb-light p, .pmb-light .pm-h1, .pmb-light .pm-h2, .pmb-light .pm-h3, .pmb-light .pm-h4, .pmb-light .pm-h5, .pmb-light .pm-h6 { color: inherit; }
.pmb-dark { color: #fff; } .pmb-dark h1, .pmb-dark h2, .pmb-dark h3, .pmb-dark h4, .pmb-dark h5, .pmb-dark h6, .pmb-dark p, .pmb-dark .pm-muted { color: inherit; }
.pmb-dark-text { color: var(--pm-fg, #111827); }
.pmb-upper { text-transform: uppercase; letter-spacing: .05em; }
.pmb-size-xxsmall { font-size: .6em; } .pmb-size-xsmall { font-size: .75em; } .pmb-size-smaller { font-size: .85em; } .pmb-size-small { font-size: .9em; }
.pmb-size-medium { font-size: 1em; } .pmb-size-large { font-size: 1.15em; } .pmb-size-larger { font-size: 1.3em; } .pmb-size-xlarge { font-size: 1.5em; } .pmb-size-xxlarge { font-size: 1.85em; }
.pmb-text-depth-1 { text-shadow: 0 1px 2px rgba(0,0,0,.25); } .pmb-text-depth-2 { text-shadow: 0 2px 4px rgba(0,0,0,.3); } .pmb-text-depth-3 { text-shadow: 0 3px 8px rgba(0,0,0,.35); } .pmb-text-depth-4 { text-shadow: 0 5px 14px rgba(0,0,0,.4); } .pmb-text-depth-5 { text-shadow: 0 8px 24px rgba(0,0,0,.5); }

/* ---- depth ---- */
.pmb-depth-1 { box-shadow: 0 1px 3px rgba(0,0,0,.12); } .pmb-depth-2 { box-shadow: 0 4px 10px rgba(0,0,0,.14); } .pmb-depth-3 { box-shadow: 0 8px 22px rgba(0,0,0,.16); } .pmb-depth-4 { box-shadow: 0 14px 34px rgba(0,0,0,.2); } .pmb-depth-5 { box-shadow: 0 22px 50px rgba(0,0,0,.26); }
[class*="pmb-depth-hover-"] { transition: box-shadow .3s ease, transform .3s ease; }
.pmb-depth-hover-1:hover { box-shadow: 0 1px 3px rgba(0,0,0,.12); } .pmb-depth-hover-2:hover { box-shadow: 0 4px 10px rgba(0,0,0,.14); } .pmb-depth-hover-3:hover { box-shadow: 0 8px 22px rgba(0,0,0,.16); } .pmb-depth-hover-4:hover { box-shadow: 0 14px 34px rgba(0,0,0,.2); } .pmb-depth-hover-5:hover { box-shadow: 0 22px 50px rgba(0,0,0,.26); }
.pmb-row--depth-1 > .pmb-col, .pmb-grid--depth-1 > .pmb-grid__item { box-shadow: 0 1px 3px rgba(0,0,0,.12); } .pmb-row--depth-2 > .pmb-col, .pmb-grid--depth-2 > .pmb-grid__item { box-shadow: 0 4px 10px rgba(0,0,0,.14); } .pmb-row--depth-3 > .pmb-col, .pmb-grid--depth-3 > .pmb-grid__item { box-shadow: 0 8px 22px rgba(0,0,0,.16); } .pmb-row--depth-4 > .pmb-col, .pmb-grid--depth-4 > .pmb-grid__item { box-shadow: 0 14px 34px rgba(0,0,0,.2); } .pmb-row--depth-5 > .pmb-col, .pmb-grid--depth-5 > .pmb-grid__item { box-shadow: 0 22px 50px rgba(0,0,0,.26); }
.pmb-row--depth-hover-1 > .pmb-col:hover, .pmb-grid--depth-hover-1 > .pmb-grid__item:hover { box-shadow: 0 1px 3px rgba(0,0,0,.12); } .pmb-row--depth-hover-2 > .pmb-col:hover, .pmb-grid--depth-hover-2 > .pmb-grid__item:hover { box-shadow: 0 4px 10px rgba(0,0,0,.14); } .pmb-row--depth-hover-3 > .pmb-col:hover, .pmb-grid--depth-hover-3 > .pmb-grid__item:hover { box-shadow: 0 8px 22px rgba(0,0,0,.16); } .pmb-row--depth-hover-4 > .pmb-col:hover, .pmb-grid--depth-hover-4 > .pmb-grid__item:hover { box-shadow: 0 14px 34px rgba(0,0,0,.2); } .pmb-row--depth-hover-5 > .pmb-col:hover, .pmb-grid--depth-hover-5 > .pmb-grid__item:hover { box-shadow: 0 22px 50px rgba(0,0,0,.26); }

/* ---- borders (drawn as an inset frame so margins and hovers work) ---- */
.pmb-bordered { position: relative; }
.pmb-bordered::after { content: ""; position: absolute; inset: var(--pmb-bm, 0); border-width: var(--pmb-bw, 0); border-style: var(--pmb-bs, solid); border-color: var(--pmb-bc, currentColor); border-radius: var(--pmb-br, 0); pointer-events: none; z-index: 1; transition: opacity .3s ease, transform .3s ease, filter .3s ease; }
.pmb-bhover-fade-in::after { opacity: 0; } .pmb-bhover-fade-in:hover::after { opacity: 1; }
.pmb-bhover-fade-out:hover::after { opacity: 0; }
.pmb-bhover-slide::after { transform: translateX(-8px); opacity: 0; } .pmb-bhover-slide:hover::after { transform: none; opacity: 1; }
.pmb-bhover-zoom::after { transform: scale(1.05); opacity: 0; } .pmb-bhover-zoom:hover::after { transform: none; opacity: 1; }
.pmb-bhover-zoom-in::after { transform: scale(.95); opacity: 0; } .pmb-bhover-zoom-in:hover::after { transform: none; opacity: 1; }
.pmb-bhover-blur::after { filter: blur(4px); opacity: 0; } .pmb-bhover-blur:hover::after { filter: none; opacity: 1; }
.pmb-bhover-bounce:hover::after { animation: pmb-bounce .6s; }
.pmb-bhover-invert:hover::after { filter: invert(1); }

/* ---- backgrounds, overlays, video, effects ---- */
.pmb-bg { position: absolute; inset: 0; z-index: 0; background-position: center; background-size: cover; background-repeat: no-repeat; transition: transform .8s ease, filter .6s ease, opacity .6s ease; }
.pmb-overlay { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.pmb-video-bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.pmb-video-bg iframe, .pmb-video-bg video { position: absolute; top: 50%; left: 50%; width: 177.78vh; min-width: 100%; min-height: 100%; height: 56.25vw; transform: translate(-50%, -50%); object-fit: cover; border: 0; }
.pmb-fx { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.pmb-fx-snow { background-image: radial-gradient(3px 3px at 20% 30%, #fff 50%, transparent 52%), radial-gradient(2px 2px at 60% 70%, #fff 50%, transparent 52%), radial-gradient(3px 3px at 80% 10%, #fff 50%, transparent 52%), radial-gradient(2px 2px at 40% 90%, #fff 50%, transparent 52%), radial-gradient(2px 2px at 90% 50%, #fff 50%, transparent 52%); background-size: 200px 200px; animation: pmb-fall 8s linear infinite; opacity: .8; }
.pmb-fx-rain { background-image: repeating-linear-gradient(100deg, transparent 0 18px, rgba(255,255,255,.25) 18px 19px); background-size: 120px 100%; animation: pmb-fall 1.2s linear infinite; }
.pmb-fx-confetti { background-image: radial-gradient(4px 4px at 15% 25%, #f43f5e 50%, transparent 52%), radial-gradient(4px 4px at 55% 65%, #fbbf24 50%, transparent 52%), radial-gradient(4px 4px at 85% 15%, #34d399 50%, transparent 52%), radial-gradient(4px 4px at 35% 85%, #60a5fa 50%, transparent 52%), radial-gradient(4px 4px at 70% 40%, #a78bfa 50%, transparent 52%); background-size: 240px 240px; animation: pmb-fall 6s linear infinite; }
.pmb-fx-sparkle { background-image: radial-gradient(2px 2px at 25% 35%, #fff 50%, transparent 52%), radial-gradient(2px 2px at 65% 75%, #fff 50%, transparent 52%), radial-gradient(2px 2px at 85% 25%, #fff 50%, transparent 52%), radial-gradient(2px 2px at 45% 15%, #fff 50%, transparent 52%); background-size: 160px 160px; animation: pmb-twinkle 2s ease-in-out infinite; }
.pmb-fx-sliding-glass { background: linear-gradient(115deg, transparent 40%, rgba(255,255,255,.18) 50%, transparent 60%); background-size: 300% 100%; animation: pmb-glass 6s linear infinite; }
@keyframes pmb-fall { to { background-position: 30px 200px; } }
@keyframes pmb-twinkle { 50% { opacity: .2; } }
@keyframes pmb-glass { from { background-position: 100% 0; } to { background-position: -100% 0; } }

/* image hovers */
.pmb-ihover { overflow: hidden; }
.pmb-ihover img, .pmb-ihover.pmb-bg { transition: transform .8s ease, filter .6s ease, opacity .6s ease; }
.pmb-ihover-zoom:hover img, .pmb-ihover-zoom:hover.pmb-bg, .pmb-hover-zoom:hover .pmb-bg { transform: scale(1.08); }
.pmb-ihover-zoom-long:hover img, .pmb-ihover-zoom-long:hover.pmb-bg { transform: scale(1.15); transition-duration: 5s; }
.pmb-ihover-zoom-fade:hover img, .pmb-ihover-zoom-fade:hover.pmb-bg { transform: scale(1.08); opacity: .7; }
.pmb-ihover-blur:hover img, .pmb-ihover-blur:hover.pmb-bg { filter: blur(3px); }
.pmb-ihover-fade-in img, .pmb-ihover-fade-in.pmb-bg { opacity: .7; } .pmb-ihover-fade-in:hover img, .pmb-ihover-fade-in:hover.pmb-bg { opacity: 1; }
.pmb-ihover-fade-out:hover img, .pmb-ihover-fade-out:hover.pmb-bg { opacity: .7; }
.pmb-ihover-glow:hover img, .pmb-ihover-glow:hover.pmb-bg { filter: brightness(1.15); }
.pmb-ihover-color img, .pmb-ihover-color.pmb-bg { filter: grayscale(1); } .pmb-ihover-color:hover img, .pmb-ihover-color:hover.pmb-bg { filter: none; }
.pmb-ihover-grayscale:hover img, .pmb-ihover-grayscale:hover.pmb-bg { filter: grayscale(1); }
.pmb-ihover-overlay-add .pmb-overlay, .pmb-ihover-overlay-add-50 .pmb-overlay { opacity: 0; transition: opacity .4s; } .pmb-ihover-overlay-add:hover .pmb-overlay { opacity: 1; } .pmb-ihover-overlay-add-50:hover .pmb-overlay { opacity: .5; }
.pmb-ihover-overlay-remove:hover .pmb-overlay { opacity: 0; } .pmb-ihover-overlay-remove-50:hover .pmb-overlay { opacity: .5; } .pmb-ihover-overlay-remove .pmb-overlay, .pmb-ihover-overlay-remove-50 .pmb-overlay { transition: opacity .4s; }
/* on a parent: banners and sections apply the hover to their bg layer */
.pmb-section:hover > .pmb-ihover-zoom, .pmb-banner:hover .pmb-ihover-zoom { transform: scale(1.08); }
.pmb-section:hover > .pmb-ihover-zoom-long, .pmb-banner:hover .pmb-ihover-zoom-long { transform: scale(1.15); transition-duration: 5s; }
.pmb-section:hover > .pmb-ihover-blur, .pmb-banner:hover .pmb-ihover-blur { filter: blur(3px); }
.pmb-section:hover > .pmb-ihover-fade-out, .pmb-banner:hover .pmb-ihover-fade-out { opacity: .7; }
.pmb-section:hover > .pmb-ihover-color, .pmb-banner:hover .pmb-ihover-color { filter: none; }
.pmb-section:hover > .pmb-ihover-grayscale, .pmb-banner:hover .pmb-ihover-grayscale { filter: grayscale(1); }
.pmb-section:hover > .pmb-ihover-glow, .pmb-banner:hover .pmb-ihover-glow { filter: brightness(1.15); }
/* text hovers (text boxes, box captions) */
[class*="pmb-thover-"] { transition: opacity .4s ease, transform .4s ease, filter .4s ease; }
.pmb-thover-fade-in { opacity: 0; } *:hover > .pmb-thover-fade-in, .pmb-box:hover .pmb-thover-fade-in, .pmb-banner:hover .pmb-thover-fade-in { opacity: 1; }
.pmb-banner:hover .pmb-thover-fade-out, .pmb-box:hover .pmb-thover-fade-out { opacity: 0; }
.pmb-thover-slide { opacity: 0; transform: translateY(12px); } .pmb-banner:hover .pmb-thover-slide, .pmb-box:hover .pmb-thover-slide { opacity: 1; transform: none; }
.pmb-thover-zoom { opacity: 0; transform: scale(1.1); } .pmb-banner:hover .pmb-thover-zoom, .pmb-box:hover .pmb-thover-zoom { opacity: 1; transform: none; }
.pmb-thover-zoom-in { opacity: 0; transform: scale(.9); } .pmb-banner:hover .pmb-thover-zoom-in, .pmb-box:hover .pmb-thover-zoom-in { opacity: 1; transform: none; }
.pmb-thover-blur { opacity: 0; filter: blur(6px); } .pmb-banner:hover .pmb-thover-blur, .pmb-box:hover .pmb-thover-blur { opacity: 1; filter: none; }
.pmb-banner:hover .pmb-thover-bounce, .pmb-box:hover .pmb-thover-bounce { animation: pmb-bounce .6s; }
.pmb-banner:hover .pmb-thover-invert, .pmb-box:hover .pmb-thover-invert { filter: invert(1); }
/* column hovers */
.pmb-chover-fade { opacity: .7; transition: opacity .3s; } .pmb-chover-fade:hover { opacity: 1; }
.pmb-chover-focus { transition: transform .3s; } .pmb-chover-focus:hover { transform: scale(1.03); }
.pmb-chover-blur { transition: filter .3s; } .pmb-row:hover .pmb-chover-blur:not(:hover) { filter: blur(2px); }
/* text boxes in banners: hover names shared with columns */
.pmb-banner:hover .pmb-textbox.pmb-thover-fade-in { opacity: 1; }

/* ---- animations (added by the runtime when scrolled into view) ---- */
.pmb-anim { opacity: 0; }
.pmb-anim.is-in { opacity: 1; animation-duration: var(--pmb-adur, .9s); animation-delay: var(--pmb-adelay, 0s); animation-fill-mode: both; animation-timing-function: var(--pmb-aease, cubic-bezier(.2,.7,.2,1)); }
.pmb-anim.is-in[data-animate="zoomIn"] { animation-name: pmb-zoomIn; } .pmb-anim.is-in[data-animate="zoomOut"] { animation-name: pmb-zoomOut; } .pmb-anim.is-in[data-animate="slideInUp"] { animation-name: pmb-slideInUp; }
@keyframes pmb-zoomIn { from { opacity: 0; transform: scale(.8); filter: blur(var(--pmb-ablur, 0)); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes pmb-zoomOut { from { opacity: 0; transform: scale(1.2); filter: blur(var(--pmb-ablur, 0)); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes pmb-slideInUp { from { opacity: 0; transform: translateY(100%); } to { opacity: 1; transform: none; } }
.pmb-anim.is-in[data-animate="fadeInLeft"] { animation-name: pmb-fadeInLeft; } .pmb-anim.is-in[data-animate="fadeInRight"] { animation-name: pmb-fadeInRight; }
.pmb-anim.is-in[data-animate="fadeInUp"] { animation-name: pmb-fadeInUp; } .pmb-anim.is-in[data-animate="fadeInDown"] { animation-name: pmb-fadeInDown; }
.pmb-anim.is-in[data-animate^="bounceIn"] { animation-name: pmb-bounceIn; } .pmb-anim.is-in[data-animate="bounceInUp"] { animation-name: pmb-fadeInUp; animation-timing-function: cubic-bezier(.3,1.5,.5,1); }
.pmb-anim.is-in[data-animate="bounceInDown"] { animation-name: pmb-fadeInDown; animation-timing-function: cubic-bezier(.3,1.5,.5,1); } .pmb-anim.is-in[data-animate="bounceInLeft"] { animation-name: pmb-fadeInLeft; animation-timing-function: cubic-bezier(.3,1.5,.5,1); } .pmb-anim.is-in[data-animate="bounceInRight"] { animation-name: pmb-fadeInRight; animation-timing-function: cubic-bezier(.3,1.5,.5,1); }
.pmb-anim.is-in[data-animate="blurIn"] { animation-name: pmb-blurIn; } .pmb-anim.is-in[data-animate="flipInX"] { animation-name: pmb-flipInX; } .pmb-anim.is-in[data-animate="flipInY"] { animation-name: pmb-flipInY; }
@keyframes pmb-fadeInLeft { from { opacity: 0; transform: translateX(calc(-1 * var(--pmb-adist, 40px))); filter: blur(var(--pmb-ablur, 0)); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes pmb-fadeInRight { from { opacity: 0; transform: translateX(var(--pmb-adist, 40px)); filter: blur(var(--pmb-ablur, 0)); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes pmb-fadeInUp { from { opacity: 0; transform: translateY(var(--pmb-adist, 40px)); filter: blur(var(--pmb-ablur, 0)); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes pmb-fadeInDown { from { opacity: 0; transform: translateY(calc(-1 * var(--pmb-adist, 40px))); filter: blur(var(--pmb-ablur, 0)); } to { opacity: 1; transform: none; filter: blur(0); } }
@keyframes pmb-bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.95); } 100% { transform: scale(1); } }
@keyframes pmb-blurIn { from { opacity: 0; filter: blur(max(12px, var(--pmb-ablur, 0px))); } to { opacity: 1; filter: blur(0); } }
@keyframes pmb-flipInX { from { opacity: 0; transform: perspective(600px) rotateX(70deg); } to { opacity: 1; transform: none; } }
@keyframes pmb-flipInY { from { opacity: 0; transform: perspective(600px) rotateY(70deg); } to { opacity: 1; transform: none; } }
@keyframes pmb-bounce { 0%, 100% { transform: none; } 30% { transform: translateY(-8px); } 60% { transform: translateY(3px); } }

/* ---- section ---- */
.pmb-section { position: relative; padding: 30px 0; }
.pmb-section__content { position: relative; z-index: 2; padding-inline: var(--pm-gutter, 5%); }
.pmb-section--height { display: flex; flex-direction: column; justify-content: center; } /* a section given a height centres its content, as Flatsome does */
.pmb-section--height > .pmb-section__content { width: 100%; }
.pmb-section > .pmb-section__content > .pmb-row--full-width, .pmb-section > .pmb-section__content > .pmb-grid--full-width, .pmb-section > .pmb-section__content > .pmb-boxes--full-width { margin-inline: calc(var(--pm-gutter, 5%) * -1); max-width: none; }
.pmb-section.pmb-sticky, .pmb-col.pmb-sticky, .pmb-banner.pmb-sticky { position: sticky; top: 0; z-index: 5; }
.pmb-mask { clip-path: var(--pmb-mask); }
.pmb-mask-circle { --pmb-mask: ellipse(120% 100% at 50% 0%); }
.pmb-mask-arrow { --pmb-mask: polygon(0 0, 100% 0, 100% 100%, calc(50% + 30px) 100%, 50% calc(100% - 30px), calc(50% - 30px) 100%, 0 100%); }
.pmb-mask-arrow-large { --pmb-mask: polygon(0 0, 100% 0, 100% 100%, calc(50% + 90px) 100%, 50% calc(100% - 90px), calc(50% - 90px) 100%, 0 100%); }
.pmb-mask-angled { --pmb-mask: polygon(0 0, 100% 0, 100% calc(100% - 40px), 0 100%); }
.pmb-mask-angled-right { --pmb-mask: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 40px)); }
.pmb-mask-angled-large { --pmb-mask: polygon(0 0, 100% 0, 100% calc(100% - 110px), 0 100%); }
.pmb-mask-angled-right-large { --pmb-mask: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 110px)); }
.pmb-scroll-more { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 3; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.85); color: #111; text-decoration: none; animation: pmb-bounce 1.8s infinite; }
.pmb-loading { position: absolute; top: 50%; left: 50%; width: 40px; height: 40px; margin: -20px 0 0 -20px; border: 3px solid rgba(255,255,255,.3); border-top-color: currentColor; border-radius: 50%; animation: pmb-spin 1s linear infinite; z-index: 1; }
@keyframes pmb-spin { to { transform: rotate(360deg); } }
.pmb-divider { position: absolute; left: 0; width: 100%; z-index: 1; pointer-events: none; overflow: hidden; }
.pmb-divider--top { top: 0; } .pmb-divider--bottom { bottom: 0; transform: scaleY(-1); }
.pmb-divider.is-flip { transform: scaleX(-1); } .pmb-divider--bottom.is-flip { transform: scale(-1, -1); }
.pmb-divider.is-front { z-index: 3; }
.pmb-divider svg { display: block; width: 100%; height: 100%; fill: var(--pm-color-page, #fff); }
.pmb-divider--top svg { transform: scaleY(-1); }

/* ---- row / column ---- */
.pmb-row { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--pmb-gap); align-items: start; max-width: var(--pm-container, 1180px); margin-left: auto; margin-right: auto; }
.pmb-row + .pmb-row { margin-top: var(--pmb-gap); }
.pmb-row--small { --pmb-gap: 1rem; } .pmb-row--large { --pmb-gap: 3.5rem; } .pmb-row--collapse { --pmb-gap: 0; }
.pmb-row--full-width { max-width: none; } .pmb-row--custom { }
.pmb-row--v-equal { align-items: stretch; } .pmb-row--v-equal > .pmb-col { display: flex; } .pmb-row--v-equal > .pmb-col > .pmb-col__inner { flex: 1; }
.pmb-row--v-middle { align-items: center; } .pmb-row--v-bottom { align-items: end; }
.pmb-row--h-center { justify-content: center; } .pmb-row--h-right { justify-content: end; }
.pmb-row--h-center, .pmb-row--h-right { display: flex; flex-wrap: wrap; } .pmb-row--h-center > .pmb-col, .pmb-row--h-right > .pmb-col { flex: 0 0 calc((100% - var(--pmb-gap) * 11) / 12 * var(--span, 12) + var(--pmb-gap) * (var(--span, 12) - 1)); }
.pmb-row--divided > .pmb-col + .pmb-col { border-left: 1px solid var(--pmb-border); padding-left: var(--pmb-gap); margin-left: calc(var(--pmb-gap) * -0.5); }
.pmb-row--dashed > .pmb-col { border: 1px dashed var(--pmb-border); padding: 1.5rem; }
.pmb-row--solid > .pmb-col { border: 1px solid var(--pmb-border); padding: 1.5rem; border-radius: var(--pmb-radius); background: var(--pm-color-surface, #fff); }
.pmb-row > .pmb-col { padding: var(--pmb-col-pad, 0); background-color: var(--pmb-col-bg, transparent); border-radius: var(--pmb-col-radius, 0); }
.pmb-col { grid-column: span var(--span, 12); min-width: 0; position: relative; }
.pmb-col__inner > * + * { margin-top: 1rem; }
.pmb-col--divider::after { content: ""; position: absolute; top: 0; bottom: 0; right: calc(var(--pmb-gap) * -0.5); border-left: 1px solid var(--pmb-border); }
.pmb-col > .pmb-col__inner > .pmb-row { max-width: none; }
@media (max-width: 849px) { .pmb-first-medium { order: -1; } }
@media (max-width: 767px) {
  .pmb-row, .pmb-row--h-center, .pmb-row--h-right { display: grid; grid-template-columns: minmax(0, 1fr); }
  .pmb-col { grid-column: span 1 / span 1; flex: none !important; }
  .pmb-first-small { order: -1; }
  .pmb-row--divided > .pmb-col + .pmb-col { border-left: 0; padding-left: 0; margin-left: 0; border-top: 1px solid var(--pmb-border); padding-top: var(--pmb-gap); }
  .pmb-col--divider::after { display: none; }
}

/* ---- banner grid ---- */
.pmb-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: calc(var(--pmb-grid-h, 600px) / 12); gap: var(--pmb-grid-gap, .75rem); max-width: var(--pm-container, 1180px); margin: 0 auto; }
.pmb-grid--xsmall { --pmb-grid-gap: .25rem; } .pmb-grid--small { --pmb-grid-gap: .75rem; } .pmb-grid--normal { --pmb-grid-gap: 1.5rem; } .pmb-grid--large { --pmb-grid-gap: 2.5rem; } .pmb-grid--collapse { --pmb-grid-gap: 0; }
.pmb-grid--full-width { max-width: none; }
.pmb-grid__item { position: relative; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.pmb-grid__item > * { flex: 1; min-height: 0 !important; }
.pmb-grid__item > .pmb-banner > .pmb-banner__inner { min-height: 100% !important; height: 100%; }
.pmb-grid__item > .pmb-image, .pmb-grid__item > .pmb-image .pmb-media { height: 100%; } .pmb-grid__item .pmb-image img { height: 100%; object-fit: cover; }
@media (max-width: 767px) { .pmb-grid { grid-auto-rows: auto; } .pmb-grid__item { grid-column: span 12 !important; grid-row: auto !important; min-height: 220px; } }

/* ---- banner + text box ---- */
.pmb-banner { position: relative; display: block; color: inherit; text-decoration: none; overflow: hidden; }
.pmb-banner__inner { position: relative; min-height: 400px; }
.pmb-banner__layers { position: absolute; inset: 0; z-index: 2; }
.pmb-banner + .pmb-banner { margin-top: 1rem; }
.pmb-slide-fade-in, .pmb-slide-zoom-in, .pmb-slide-zoom-out, .pmb-slide-fade-in-fast, .pmb-slide-zoom-in-fast, .pmb-slide-zoom-out-fast { animation: none; }
.pmb-slider__track > .is-active.pmb-slide-fade-in .pmb-bg, .pmb-slider__track > .is-active.pmb-slide-fade-in-fast .pmb-bg { animation: pmb-fade 2s ease both; }
.pmb-slider__track > .is-active.pmb-slide-zoom-in .pmb-bg { animation: pmb-zoom-in 8s ease both; } .pmb-slider__track > .is-active.pmb-slide-zoom-in-fast .pmb-bg { animation: pmb-zoom-in 2s ease both; }
.pmb-slider__track > .is-active.pmb-slide-zoom-out .pmb-bg { animation: pmb-zoom-out 8s ease both; } .pmb-slider__track > .is-active.pmb-slide-zoom-out-fast .pmb-bg { animation: pmb-zoom-out 2s ease both; }
@keyframes pmb-fade { from { opacity: 0; } } @keyframes pmb-zoom-in { from { transform: scale(1); } to { transform: scale(1.12); } } @keyframes pmb-zoom-out { from { transform: scale(1.12); } to { transform: scale(1); } }
.pmb-textbox { position: absolute; z-index: 1; max-width: 100%; }
.pmb-textbox__inner { position: relative; }
.pmb-textbox__inner > * + * { margin-top: .75rem; }
.pmb-textbox--square .pmb-textbox__inner, .pmb-textbox--circle .pmb-textbox__inner { aspect-ratio: 1; display: flex; flex-direction: column; justify-content: center; }
.pmb-textbox--circle .pmb-textbox__inner { border-radius: 50%; }
.pmb-pos { --x: 50; --y: 50; }
.pmb-banner__layers > .pmb-image.pmb-pos, .pmb-banner__layers > .pmb-hotspot { position: absolute; left: calc(var(--x) * 1%); top: calc(var(--y) * 1%); transform: translate(calc(var(--x) * -1%), calc(var(--y) * -1%)); margin: 0; }
.pmb-banner__layers > .pmb-image.pmb-pos { width: 40%; }
@media (max-width: 767px) {
  .pmb-banner__layers { position: relative; padding: 2rem 1rem; }
  .pmb-textbox { position: relative; left: auto !important; top: auto !important; transform: none !important; width: 100% !important; }
  .pmb-textbox + .pmb-textbox { margin-top: 1rem; }
  .pmb-banner__inner { min-height: 0 !important; padding-top: 0 !important; }
  .pmb-banner__layers > .pmb-image.pmb-pos { position: relative; left: auto; top: auto; transform: none; width: 100%; }
}

/* ---- hotspot ---- */
.pmb-hotspot { position: absolute; z-index: 3; text-decoration: none; color: inherit; }
.pmb-hotspot__dot { display: grid; place-items: center; width: 2.2em; height: 2.2em; border-radius: 50%; background: var(--pmb-hot-bg, var(--pmb-brand)); color: #fff; box-shadow: 0 0 0 6px rgba(255,255,255,.35); transition: transform .3s; }
.pmb-hotspot:hover .pmb-hotspot__dot { transform: scale(1.1); }
.pmb-hotspot__tip { position: absolute; left: 50%; bottom: calc(100% + 10px); transform: translateX(-50%); background: #fff; color: #111; padding: .5em .8em; border-radius: 6px; white-space: nowrap; font-size: .85em; box-shadow: 0 4px 16px rgba(0,0,0,.2); opacity: 0; pointer-events: none; transition: opacity .2s; display: flex; align-items: center; gap: .5em; }
.pmb-hotspot__tip img { width: 40px; height: 40px; object-fit: cover; border-radius: 4px; }
.pmb-hotspot:hover .pmb-hotspot__tip { opacity: 1; }

/* ---- slider ---- */
.pmb-slider { position: relative; --pmb-slide-gap: 0px; }
.pmb-slider__track { display: flex; gap: var(--pmb-slide-gap); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.pmb-slider__track::-webkit-scrollbar { display: none; }
.pmb-slider__track > * { flex: 0 0 100%; scroll-snap-align: center; margin-top: 0 !important; }
.pmb-slider--fixed .pmb-slider__track > * { flex-basis: var(--pmb-slide-w, 300px); }
.pmb-slider--align-left .pmb-slider__track > * { scroll-snap-align: start; } .pmb-slider--align-right .pmb-slider__track > * { scroll-snap-align: end; }
.pmb-slider--fade .pmb-slider__track { display: grid; overflow: hidden; }
.pmb-slider--fade .pmb-slider__track > * { grid-area: 1 / 1; opacity: 0; transition: opacity .6s ease; pointer-events: none; }
.pmb-slider--fade .pmb-slider__track > .is-active { opacity: 1; pointer-events: auto; }
.pmb-slider--container { padding: 0 3rem; max-width: var(--pm-container, 1180px); margin: 0 auto; }
.pmb-slider--focus .pmb-slider__track > * { opacity: .5; transition: opacity .4s; } .pmb-slider--focus .pmb-slider__track > .is-active { opacity: 1; }
.pmb-slider--shadow .pmb-slider__track > * { box-shadow: 0 14px 34px rgba(0,0,0,.2); }
.pmb-slider__arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 44px; height: 44px; border: 0; border-radius: 50%; cursor: pointer; font-size: 18px; display: grid; place-items: center; background: rgba(255,255,255,.9); color: #111; box-shadow: 0 2px 8px rgba(0,0,0,.2); }
.pmb-slider--navsize-normal .pmb-slider__arrow { width: 34px; height: 34px; font-size: 14px; }
.pmb-slider__arrow--prev { left: 12px; } .pmb-slider__arrow--next { right: 12px; }
.pmb-slider--nav-outside { padding: 0 3rem; } .pmb-slider--nav-outside .pmb-slider__arrow--prev { left: 0; } .pmb-slider--nav-outside .pmb-slider__arrow--next { right: 0; }
.pmb-slider--nav-dark .pmb-slider__arrow { background: rgba(0,0,0,.6); color: #fff; }
.pmb-slider--nav-simple .pmb-slider__arrow { background: none; box-shadow: none; font-size: 32px; }
.pmb-slider--nav-reveal .pmb-slider__arrow { opacity: 0; transition: opacity .3s; } .pmb-slider--nav-reveal:hover .pmb-slider__arrow, .pmb-slider--nav-always .pmb-slider__arrow { opacity: 1; }
.pmb-slider__bullets { position: absolute; left: 0; right: 0; bottom: 12px; display: flex; justify-content: center; gap: 8px; z-index: 2; }
.pmb-slider__bullets button { width: 10px; height: 10px; border-radius: 50%; border: 0; background: rgba(255,255,255,.55); cursor: pointer; padding: 0; }
.pmb-slider__bullets button.is-active { background: #fff; }
.pmb-slider--bul-dashes .pmb-slider__bullets button { width: 24px; height: 4px; border-radius: 2px; }
.pmb-slider--bul-dashes-spaced .pmb-slider__bullets { gap: 14px; } .pmb-slider--bul-dashes-spaced .pmb-slider__bullets button { width: 24px; height: 4px; border-radius: 2px; }
.pmb-slider--bul-square .pmb-slider__bullets button { border-radius: 0; }
.pmb-slider--bul-simple .pmb-slider__bullets button { background: none; border: 2px solid rgba(255,255,255,.7); } .pmb-slider--bul-simple .pmb-slider__bullets button.is-active { background: #fff; }
.pmb-slider--boxes .pmb-slider__track > * { flex-basis: calc((100% - var(--pmb-cols-gap, 1.5rem) * (var(--pmb-cols, 4) - 1)) / var(--pmb-cols, 4)); scroll-snap-align: start; }
.pmb-slider--boxes .pmb-slider__track { gap: var(--pmb-cols-gap, 1.5rem); }
.pmb-slider--boxes .pmb-slider__bullets { position: static; margin-top: 1rem; } .pmb-slider--boxes .pmb-slider__bullets button { background: rgba(0,0,0,.25); } .pmb-slider--boxes .pmb-slider__bullets button.is-active { background: rgba(0,0,0,.7); }
@media (max-width: 767px) { .pmb-slider--boxes .pmb-slider__track > * { flex-basis: 80%; } .pmb-slider--container, .pmb-slider--nav-outside { padding: 0; } }

/* ---- stack / gap / divider ---- */
.pmb-stack { display: flex; flex-wrap: wrap; }
.pmb-stack > * { margin-top: 0 !important; }
.pmb-stack--logos { flex-wrap: nowrap; } .pmb-stack--logos > .pmb-logo { min-width: 0; flex: 0 1 auto; } .pmb-stack--logos > .pmb-logo img { max-width: 100%; object-fit: contain; }
.pmb-gap { display: block; }
.pmb-divider-line { display: block; } .pmb-divider-line span { display: block; background: var(--pmb-brand); max-width: 100%; }
.pmb-divider-line--center span { margin-left: auto !important; margin-right: auto !important; } .pmb-divider-line--right span { margin-left: auto !important; }

/* ---- text / title ---- */
.pmb-text__inner > :first-child { margin-top: 0; } .pmb-text__inner > :last-child { margin-bottom: 0; }
.pmb-text__inner p + p { margin-top: .8em; }
.pmb-title { display: flex; align-items: center; gap: 1rem; margin: .5em 0; }
.pmb-title__text { margin: 0; display: inline-flex; align-items: center; gap: .4em; }
.pmb-title__line { display: none; flex: 1; height: 2px; background: var(--pmb-border); }
.pmb-title--normal .pmb-title__line:last-child, .pmb-title--bold .pmb-title__line:last-child { display: block; }
.pmb-title--center { justify-content: center; text-align: center; } .pmb-title--center .pmb-title__line, .pmb-title--bold-center .pmb-title__line { display: block; }
.pmb-title--bold-center { justify-content: center; text-align: center; }
.pmb-title--bold .pmb-title__line, .pmb-title--bold-center .pmb-title__line { height: 4px; background: var(--pmb-brand); }
.pmb-title--bold .pmb-title__text, .pmb-title--bold-center .pmb-title__text { font-weight: 800; }
.pmb-title__link { margin-left: auto; font-size: .8em; text-decoration: none; color: var(--pmb-brand); white-space: nowrap; }
.pmb-title--center .pmb-title__link, .pmb-title--bold-center .pmb-title__link { margin-left: 0; }

/* ---- buttons ---- */
.pmb-btn { --b: var(--pmb-brand); --fg: #fff; display: inline-flex; align-items: center; justify-content: center; gap: .5em; padding: .8em 1.6em; border: 2px solid var(--b); border-radius: var(--pm-radius-btn, 6px); background: var(--b); color: var(--fg); font-weight: 600; font-size: .95rem; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; line-height: 1.2; cursor: pointer; transition: transform .2s ease, box-shadow .2s ease, background .2s ease, color .2s ease, filter .2s ease; margin: .25em .25em .25em 0; }
.pmb-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.pmb-btn--secondary { --b: var(--pmb-accent); } .pmb-btn--alert { --b: var(--pmb-alert); } .pmb-btn--success { --b: var(--pmb-success); } .pmb-btn--white { --b: #fff; --fg: #111; }
.pmb-btn--outline { background: transparent; color: var(--b); } .pmb-btn--outline:hover { background: var(--b); color: var(--fg); }
.pmb-btn--white.pmb-btn--outline { color: #fff; } .pmb-btn--white.pmb-btn--outline:hover { color: #111; }
.pmb-btn--link { background: none; border-color: transparent; color: var(--b); padding-left: 0; padding-right: 0; } .pmb-btn--link:hover { text-decoration: underline; transform: none; }
.pmb-btn--white.pmb-btn--link { color: #fff; }
.pmb-btn--underline { background: none; border: 0; border-bottom: 2px solid var(--b); border-radius: 0; color: var(--b); padding: .3em 0; }
.pmb-btn--white.pmb-btn--underline { color: #fff; }
.pmb-btn--shade { background-image: linear-gradient(rgba(255,255,255,.18), rgba(0,0,0,.12)); }
.pmb-btn--bevel { box-shadow: inset 0 -3px 0 rgba(0,0,0,.25); }
.pmb-btn--gloss { background-image: linear-gradient(rgba(255,255,255,.35) 0 50%, rgba(255,255,255,0) 50%); }
.pmb-btn--xxsmall { font-size: .6rem; padding: .6em 1.1em; } .pmb-btn--xsmall { font-size: .7rem; } .pmb-btn--smaller { font-size: .78rem; } .pmb-btn--small { font-size: .85rem; }
.pmb-btn--large { font-size: 1.05rem; padding: .9em 1.9em; } .pmb-btn--larger { font-size: 1.15rem; padding: 1em 2.1em; } .pmb-btn--xlarge { font-size: 1.3rem; padding: 1em 2.3em; } .pmb-btn--xxlarge { font-size: 1.6rem; padding: 1em 2.5em; }
.pmb-btn--lower { text-transform: none; letter-spacing: 0; }
.pmb-btn--expand { display: flex; width: 100%; }
.pmb-btn--icon-reveal .pmb-btn__icon { width: 0; overflow: hidden; opacity: 0; transition: all .25s; margin-left: -.5em; } .pmb-btn--icon-reveal:hover .pmb-btn__icon { width: 1em; opacity: 1; margin-left: 0; }

/* ---- images ---- */
.pmb-image { margin: 0; display: block; max-width: 100%; }
.pmb-image__inner { position: relative; display: block; overflow: hidden; }
.pmb-image img { display: block; width: 100%; height: auto; }
.pmb-media.pmb-ratio { position: relative; } .pmb-media.pmb-ratio > img, .pmb-media.pmb-ratio > iframe, .pmb-media.pmb-ratio > video, .pmb-media.pmb-ratio > .pmb-video__empty { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pmb-media.pmb-fixed > img { height: 100%; object-fit: cover; }
.pmb-image__link { display: block; color: inherit; }
.pmb-image__caption { font-size: .85em; opacity: .75; margin-top: .5em; text-align: center; }
.pmb-logo { display: inline-block; } .pmb-logo img { display: block; width: auto; max-width: 100%; }
.pmb-logo__link { display: inline-block; }
.pmb-slider__track > .pmb-logo { display: grid; place-items: center; padding: 1rem; }
.pmb-slider__track > .pmb-image { width: 100%; }

/* ---- boxes (image boxes, posts, products, pages, team, gallery) ---- */
.pmb-box-link, .pmb-box-wrap { display: block; color: inherit; text-decoration: none; }
.pmb-box { position: relative; overflow: hidden; border-radius: var(--pmb-box-radius, 0); background: var(--pmb-box-bg, transparent); }
.pmb-box__img { position: relative; margin: 0 auto; }
.pmb-box__img-inner { position: relative; overflow: hidden; }
.pmb-box__media img { width: 100%; display: block; }
.pmb-box__text { padding: 1rem 0; }
.pmb-box__text > * + * { margin-top: .5rem; }
.pmb-box__title { margin: 0; font-size: 1.05em; }
.pmb-box__excerpt { font-size: .9em; opacity: .85; margin: 0; }
.pmb-box--default .pmb-box__text, .pmb-box--normal .pmb-box__text { padding: 1rem .25rem; }
.pmb-box--none .pmb-box__text { display: none; }
.pmb-box--overlay .pmb-box__text, .pmb-box--shade .pmb-box__text, .pmb-box--vertical .pmb-box__text { position: absolute; left: 0; right: 0; padding: 1.25rem; color: #fff; z-index: 2; }
.pmb-box--overlay .pmb-box__text, .pmb-box--shade .pmb-box__text, .pmb-box--vertical .pmb-box__text, .pmb-box--overlay .pmb-box__text h5, .pmb-box--shade .pmb-box__text h5 { color: #fff; }
.pmb-box--overlay .pmb-box__img::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.25); transition: background .3s; } .pmb-box--overlay:hover .pmb-box__img::after { background: rgba(0,0,0,.5); }
.pmb-box--shade .pmb-box__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.7), transparent 60%); }
.pmb-box--text-bottom .pmb-box__text { bottom: 0; } .pmb-box--text-top .pmb-box__text { top: 0; } .pmb-box--text-middle .pmb-box__text { top: 50%; transform: translateY(-50%); }
.pmb-box--vertical .pmb-box__text { writing-mode: vertical-rl; transform: rotate(180deg); left: 0; right: auto; top: 0; bottom: 0; padding: 1rem; }
.pmb-box--label .pmb-box__text { position: absolute; left: 1rem; bottom: 1rem; right: auto; background: #fff; color: #111; padding: .6rem 1rem; border-radius: 4px; z-index: 2; }
.pmb-box--badge .pmb-box__text { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); background: rgba(255,255,255,.95); color: #111; padding: .8rem 1.2rem; border-radius: 999px; z-index: 2; text-align: center; white-space: nowrap; }
.pmb-box--push .pmb-box__text { transition: transform .35s ease; } .pmb-box--push:hover .pmb-box__text { transform: translateY(-6px); }
.pmb-box--push .pmb-box__img img { transition: transform .35s ease; } .pmb-box--push:hover .pmb-box__img img { transform: translateY(-4px); }
.pmb-box--bounce:hover { animation: pmb-bounce .6s; }
.pmb-box .pmb-btn { margin-top: .5rem; }
.pmb-badge { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; width: 3.2em; height: 3.2em; background: var(--pmb-brand); color: #fff; line-height: 1; font-size: .85em; margin-bottom: .5rem; }
.pmb-badge b { font-size: 1.3em; } .pmb-badge small { font-size: .65em; text-transform: uppercase; }
.pmb-badge--outline { background: none; border: 2px solid var(--pmb-brand); color: inherit; } .pmb-badge--square { border-radius: 0; } .pmb-badge--circle, .pmb-badge--circle-inside { border-radius: 50%; }
.pmb-box--overlay .pmb-badge, .pmb-box--shade .pmb-badge, .pmb-badge--circle-inside { position: absolute; top: 1rem; left: 1rem; z-index: 3; }
.pmb-post__date, .pmb-post__cat, .pmb-post__comments, .pmb-product__cat { font-size: .8em; opacity: .7; margin: 0; }
.pmb-post__cat.is-label { display: inline-block; background: var(--pmb-brand); color: #fff; padding: .2em .6em; border-radius: 3px; opacity: 1; font-size: .7em; text-transform: uppercase; }
.pmb-reveal-fade, .pmb-reveal-slide, .pmb-reveal-reveal { opacity: 0; transition: all .35s; } .pmb-reveal-slide { transform: translateY(8px); } .pmb-reveal-reveal { max-height: 0; overflow: hidden; }
.pmb-box:hover .pmb-reveal-fade, .pmb-box:hover .pmb-reveal-slide, .pmb-box:hover .pmb-reveal-reveal { opacity: 1; transform: none; max-height: 200px; }
.pmb-product__price { font-weight: 700; margin: 0; } .pmb-stars { color: #f59e0b; letter-spacing: .05em; font-size: .9em; } .pmb-stars .is-off { color: rgba(0,0,0,.15); }
.pmb-count { opacity: .5; font-weight: 400; }
.pmb-boxes { display: grid; grid-template-columns: repeat(var(--pmb-cols, 4), minmax(0, 1fr)); gap: var(--pmb-cols-gap, 1.5rem); max-width: var(--pm-container, 1180px); margin: 0 auto; }
.pmb-boxes--gap-collapse { --pmb-cols-gap: 0; } .pmb-boxes--gap-xsmall { --pmb-cols-gap: .25rem; } .pmb-boxes--gap-small { --pmb-cols-gap: .75rem; } .pmb-boxes--gap-normal { --pmb-cols-gap: 1.5rem; } .pmb-boxes--gap-large { --pmb-cols-gap: 2.5rem; }
.pmb-boxes--full-width { max-width: none; }
.pmb-boxes--slider, .pmb-boxes--slider-full { display: block; } .pmb-boxes--slider-full { max-width: none; }
.pmb-boxes--grid { grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: calc(var(--pmb-grid-h, 600px) / 12); }
.pmb-boxes--grid .pmb-box, .pmb-boxes--grid .pmb-box-link, .pmb-boxes--grid .pmb-box__img, .pmb-boxes--grid .pmb-box__img-inner, .pmb-boxes--grid .pmb-box__media { height: 100%; } .pmb-boxes--grid .pmb-box__media img { height: 100%; object-fit: cover; }
.pmb-boxes--grid .pmb-boxes__item .pmb-box__text { position: absolute; bottom: 0; left: 0; right: 0; padding: 1.25rem; color: #fff; background: linear-gradient(to top, rgba(0,0,0,.7), transparent); z-index: 2; } .pmb-boxes--grid .pmb-box__text h5 { color: #fff; }
.pmb-boxes--masonry { display: block; columns: var(--pmb-cols, 4); column-gap: var(--pmb-cols-gap, 1.5rem); } .pmb-boxes--masonry .pmb-boxes__item { break-inside: avoid; margin-bottom: var(--pmb-cols-gap, 1.5rem); }
.pmb-boxes__item { min-width: 0; }
.pmb-relay { margin: 1.5rem 0; display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; } .pmb-relay.pmb-text-center { justify-content: center; } .pmb-relay.pmb-text-right { justify-content: flex-end; }
.pmb-relay a, .pmb-relay span { display: inline-grid; place-items: center; min-width: 2.2em; height: 2.2em; padding: 0 .5em; border: 1px solid var(--pmb-border); border-radius: 4px; text-decoration: none; color: inherit; } .pmb-relay .is-active { background: var(--pmb-brand); color: #fff; border-color: var(--pmb-brand); }
.pmb-relay .pmb-btn { min-width: 0; height: auto; } .pmb-relay__count { width: 100%; text-align: center; font-size: .85em; opacity: .7; margin: .25rem 0 0; }
.pmb-products-list__item { display: flex; gap: 1rem; align-items: center; padding: .75rem 0; border-bottom: 1px solid var(--pmb-border); text-decoration: none; color: inherit; } .pmb-products-list__item img { width: 64px; height: 64px; object-fit: cover; border-radius: 4px; } .pmb-products-list__body { display: flex; flex-direction: column; gap: .2rem; }
@media (max-width: 849px) { .pmb-boxes { --pmb-cols: 3 !important; } .pmb-boxes--masonry { columns: 2; } }
@media (max-width: 767px) { .pmb-boxes { --pmb-cols: 2 !important; } .pmb-boxes--grid { grid-auto-rows: auto; } .pmb-boxes--grid .pmb-boxes__item { grid-column: span 12 !important; grid-row: auto !important; min-height: 220px; } .pmb-boxes--masonry { columns: 1; } }

/* ---- video ---- */
.pmb-video { display: block; } .pmb-video__box { background: #000; overflow: hidden; } .pmb-video iframe, .pmb-video video { border: 0; display: block; width: 100%; }
.pmb-video__empty { display: grid; place-items: center; color: #fff; background: #1f2937; min-height: 200px; }
.pmb-videobtn { display: inline-block; }
.pmb-videobtn__btn { display: inline-grid; place-items: center; width: 4.5em; height: 4.5em; border-radius: 50%; background: #fff; color: #111; text-decoration: none; box-shadow: 0 8px 24px rgba(0,0,0,.25); font-size: 1em; transition: transform .2s; } .pmb-videobtn__btn:hover { transform: scale(1.06); }
.pmb-videobtn__btn i { margin-left: .15em; font-size: 1.4em; }
.pmb-lightbox { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,.9); display: grid; place-items: center; padding: 2rem; }
.pmb-lightbox__body { position: relative; width: min(1100px, 100%); }
.pmb-lightbox__body iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; } .pmb-lightbox__body img { max-width: 100%; max-height: 85vh; display: block; margin: 0 auto; }
.pmb-lightbox__close, .pmb-lightbox__nav { position: absolute; top: 1rem; right: 1rem; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255,255,255,.15); color: #fff; font-size: 22px; cursor: pointer; }
.pmb-lightbox__nav { top: 50%; transform: translateY(-50%); } .pmb-lightbox__nav--prev { left: 1rem; right: auto; }
.pmb-lightbox__caption { color: #fff; text-align: center; margin-top: .75rem; font-size: .9em; }

/* ---- accordion / tabs / nav ---- */
.pmb-accordion__heading, .pmb-tabs__heading { margin: 0 0 .75rem; }
.pmb-accordion__item { border-top: 1px solid var(--pmb-border); } .pmb-accordion__item:last-child { border-bottom: 1px solid var(--pmb-border); }
.pmb-accordion__trigger { display: flex; align-items: center; gap: .75rem; width: 100%; padding: 1rem 0; background: none; border: 0; font: inherit; font-weight: 600; text-align: left; cursor: pointer; color: inherit; }
.pmb-accordion__icon { display: inline-grid; place-items: center; width: 1.6em; height: 1.6em; border: 1px solid currentColor; border-radius: 50%; font-size: .7em; transition: transform .25s; }
.pmb-accordion__trigger[aria-expanded="true"] .pmb-accordion__icon { transform: rotate(45deg); }
.pmb-accordion__panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .3s ease; } .pmb-accordion__panel > .pmb-accordion__content { overflow: hidden; }
.pmb-accordion__item.is-open > .pmb-accordion__panel { grid-template-rows: 1fr; } .pmb-accordion__content > * + * { margin-top: .75rem; } .pmb-accordion__item.is-open .pmb-accordion__content { padding-bottom: 1rem; }
.pmb-nav { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; font-weight: 600; font-size: .9em; } .pmb-nav--vertical { flex-direction: column; gap: .25rem; }
.pmb-nav a, .pmb-nav button { color: inherit; text-decoration: none; background: none; border: 0; font: inherit; padding: .5em 0; cursor: pointer; opacity: .7; position: relative; transition: opacity .2s; }
.pmb-nav a:hover, .pmb-nav button:hover, .pmb-nav .is-active { opacity: 1; }
.pmb-nav--line .is-active::after, .pmb-nav--line-bottom .is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--pmb-brand); } .pmb-nav--line-bottom { border-bottom: 1px solid var(--pmb-border); }
.pmb-nav--line-grow a::after, .pmb-nav--line-grow button::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 0; height: 2px; background: var(--pmb-brand); transition: all .25s; } .pmb-nav--line-grow .is-active::after, .pmb-nav--line-grow a:hover::after, .pmb-nav--line-grow button:hover::after { left: 0; right: 0; }
.pmb-nav--divided > * + * { border-left: 1px solid var(--pmb-border); padding-left: 1.5rem; } .pmb-nav--divided { gap: .25rem 1.5rem; }
.pmb-nav--outline a, .pmb-nav--outline button { border: 1px solid var(--pmb-border); padding: .5em 1em; border-radius: 4px; } .pmb-nav--outline .is-active { border-color: var(--pmb-brand); color: var(--pmb-brand); }
.pmb-nav--tabs a, .pmb-nav--tabs button { border: 1px solid transparent; border-bottom: 0; padding: .6em 1.2em; border-radius: 6px 6px 0 0; } .pmb-nav--tabs { border-bottom: 1px solid var(--pmb-border); gap: 0; } .pmb-nav--tabs .is-active { border-color: var(--pmb-border); background: var(--pm-color-surface, #fff); margin-bottom: -1px; }
.pmb-nav--bold { font-weight: 800; font-size: 1.1em; }
.pmb-nav--pills a, .pmb-nav--pills button { padding: .5em 1.1em; border-radius: 999px; } .pmb-nav--pills .is-active { background: var(--pmb-brand); color: #fff; }
.pmb-nav--xsmall { font-size: .7em; } .pmb-nav--small { font-size: .8em; } .pmb-nav--medium { font-size: .9em; } .pmb-nav--large { font-size: 1.05em; } .pmb-nav--xlarge { font-size: 1.25em; }
.pmb-tabs--horizontal .pmb-nav { margin-bottom: 1.25rem; } .pmb-tabs.pmb-text-center .pmb-nav { justify-content: center; } .pmb-tabs.pmb-text-right .pmb-nav { justify-content: flex-end; }
.pmb-tabs--vertical { display: grid; grid-template-columns: 200px 1fr; gap: 2rem; } .pmb-tabs--vertical .pmb-nav { flex-direction: column; gap: .25rem; } .pmb-tabs--vertical .pmb-tabs__heading { grid-column: 1 / -1; }
.pmb-tabs__panel { display: none; } .pmb-tabs__panel.is-active { display: block; } .pmb-tabs__panel > * + * { margin-top: .75rem; }
@media (max-width: 767px) { .pmb-tabs--vertical { grid-template-columns: 1fr; } }

/* ---- icon box / testimonial / team / pricing / message ---- */
.pmb-iconbox { display: flex; gap: 1.25rem; align-items: flex-start; text-decoration: none; color: inherit; }
.pmb-iconbox--top { flex-direction: column; align-items: flex-start; } .pmb-iconbox--center { flex-direction: column; align-items: center; text-align: center; }
.pmb-iconbox--right { flex-direction: row-reverse; text-align: right; }
.pmb-iconbox__icon { display: inline-grid; place-items: center; color: var(--pmb-brand); font-size: 2.2em; } .pmb-iconbox__icon img { width: 100%; height: auto; display: block; }
.pmb-iconbox.has-border .pmb-iconbox__icon { border-style: solid; border-color: currentColor; border-radius: 50%; padding: .5em; aspect-ratio: 1; }
.pmb-iconbox__text { flex: 1; min-width: 0; } .pmb-iconbox__text h5 { margin: 0 0 .25rem; } .pmb-iconbox__text h6 { margin: 0 0 .5rem; opacity: .7; font-weight: 500; } .pmb-iconbox__text > * + * { margin-top: .5rem; }
.pmb-testimonial { display: flex; gap: 1.25rem; align-items: flex-start; } .pmb-testimonial--right { flex-direction: row-reverse; text-align: right; } .pmb-testimonial--top { flex-direction: column; } .pmb-testimonial--center { flex-direction: column; align-items: center; text-align: center; }
.pmb-testimonial__img img { border-radius: 50%; display: block; aspect-ratio: 1; object-fit: cover; }
.pmb-testimonial__text { font-style: italic; } .pmb-testimonial__text > * + * { margin-top: .5rem; } .pmb-testimonial__meta { margin-top: .75rem; font-size: .9em; } .pmb-testimonial__company { opacity: .7; } .pmb-testimonial .pmb-stars { margin-bottom: .5rem; }
.pmb-team__title { font-size: .85em; opacity: .7; margin: 0; } .pmb-team__bio { font-size: .9em; } .pmb-team__bio > * + * { margin-top: .5rem; } .pmb-team__social { margin-top: .75rem; }
.pmb-pricing { border: 1px solid var(--pmb-border); border-radius: var(--pmb-radius); background: var(--pm-color-surface, #fff); text-align: center; overflow: hidden; }
.pmb-pricing.is-featured { border-color: var(--pmb-brand); transform: scale(1.03); box-shadow: 0 14px 34px rgba(0,0,0,.15); }
.pmb-pricing__head { padding: 1.75rem 1.25rem 1.25rem; background: var(--pmb-surface); } .pmb-pricing.is-featured .pmb-pricing__head { background: var(--pmb-brand); color: #fff; } .pmb-pricing.is-featured .pmb-pricing__head h4 { color: inherit; }
.pmb-pricing__title { margin: 0 0 .5rem; text-transform: uppercase; letter-spacing: .05em; font-size: .9em; } .pmb-pricing__price { font-size: 2.4em; font-weight: 800; line-height: 1; } .pmb-pricing__desc { margin: .5rem 0 0; font-size: .85em; opacity: .8; }
.pmb-pricing__body { padding: 1.25rem; } .pmb-pricing__body > * + * { margin-top: .6rem; } .pmb-pricing__body .pmb-btn { margin-top: 1rem; }
.pmb-bullet { display: flex; align-items: center; justify-content: center; gap: .5rem; padding: .35rem 0; border-bottom: 1px solid var(--pmb-border); } .pmb-bullet i { color: var(--pmb-success); font-size: .85em; } .pmb-bullet.is-off { opacity: .45; } .pmb-bullet.is-off i { color: var(--pmb-alert); }
.pmb-messagebox { position: relative; background: var(--pmb-brand); color: #fff; } .pmb-messagebox h1, .pmb-messagebox h2, .pmb-messagebox h3, .pmb-messagebox h4, .pmb-messagebox p { color: inherit; }
.pmb-messagebox__inner > * + * { margin-top: .5rem; }
.pmb-messagebox:not(.pmb-light) { color: var(--pm-fg, #111); } .pmb-messagebox:not(.pmb-light) h1, .pmb-messagebox:not(.pmb-light) h2, .pmb-messagebox:not(.pmb-light) h3, .pmb-messagebox:not(.pmb-light) p { color: inherit; }

/* ---- social / follow ---- */
.pmb-follow { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; } .pmb-follow__title { font-weight: 600; }
.pmb-social { display: inline-flex; gap: .4em; flex-wrap: wrap; } .pmb-social--left { display: flex; } .pmb-social--center { display: flex; justify-content: center; width: 100%; } .pmb-social--right { display: flex; justify-content: flex-end; width: 100%; }
.pmb-social a { display: inline-grid; place-items: center; width: 2.3em; height: 2.3em; border-radius: 50%; border: 1px solid currentColor; color: inherit; text-decoration: none; opacity: .8; transition: all .2s; } .pmb-social a:hover { opacity: 1; background: var(--pmb-brand); border-color: var(--pmb-brand); color: #fff; }
.pmb-social--fill a { background: var(--pmb-brand); border-color: var(--pmb-brand); color: #fff; } .pmb-social--small a { width: 1.8em; height: 1.8em; font-size: .85em; border: 0; }

/* ---- menu / search / countdown / map / misc ---- */
.pmb-menu ul { list-style: none; margin: 0; padding: 0; } .pmb-menu__item + .pmb-menu__item { margin-top: .4rem; } .pmb-menu--solid .pmb-menu__item + .pmb-menu__item { border-top: 1px solid var(--pmb-border); padding-top: .4rem; }
.pmb-menu a { color: inherit; text-decoration: none; display: flex; align-items: center; gap: .5em; } .pmb-menu a:hover { color: var(--pmb-brand); } .pmb-menu__title { font-weight: 700; text-transform: uppercase; font-size: .8em; letter-spacing: .05em; margin: .8rem 0 .4rem; }
.pmb-label { font-size: .65em; padding: .15em .5em; border-radius: 3px; background: var(--pmb-brand); color: #fff; text-transform: uppercase; margin-left: .3em; } .pmb-label-hot { background: var(--pmb-alert); } .pmb-label-new { background: var(--pmb-success); } .pmb-label-popular { background: var(--pmb-accent); }
.pmb-search { display: flex; gap: 0; max-width: 100%; } .pmb-search .pm-input { flex: 1; min-width: 0; border-radius: 6px 0 0 6px; } .pmb-search__btn { border: 0; background: var(--pmb-brand); color: #fff; padding: 0 1.1em; border-radius: 0 6px 6px 0; cursor: pointer; }
.pmb-search--flat .pm-input { border: 0; background: var(--pmb-surface); }
.pmb-search.pmb-size-xsmall { font-size: .75em; } .pmb-search.pmb-size-small { font-size: .85em; } .pmb-search.pmb-size-large { font-size: 1.15em; } .pmb-search.pmb-size-xlarge { font-size: 1.35em; }
.pmb-countdown { display: flex; gap: .25em; justify-content: center; flex-wrap: wrap; font-size: 300%; }
.pmb-countdown__unit { display: flex; flex-direction: column; align-items: center; min-width: 1.5em; padding: .2em .15em; border-radius: .08em; }
.pmb-countdown__num { font-weight: 800; font-size: 1em; line-height: 1; font-variant-numeric: tabular-nums; }
.pmb-countdown__label { font-size: .28em; text-transform: uppercase; letter-spacing: .08em; opacity: .7; margin-top: .3em; }
.pmb-countdown--text { font-size: 100%; gap: .5em; } .pmb-countdown--text .pmb-countdown__unit { background: none !important; padding: 0; min-width: 0; flex-direction: row; gap: .25em; align-items: baseline; } .pmb-countdown--text .pmb-countdown__num { font-size: 1.3em; } .pmb-countdown--text .pmb-countdown__label { font-size: .8em; margin: 0; }
.pmb-map { position: relative; overflow: hidden; border-radius: var(--pmb-radius); } .pmb-map__frame { position: absolute; inset: 0; } .pmb-map iframe { width: 100%; height: 100%; border: 0; display: block; }
.pmb-map__tint { position: absolute; inset: 0; mix-blend-mode: color; pointer-events: none; opacity: .8; }
.pmb-map__content { position: absolute; padding: 1.25rem; border-radius: 6px; box-shadow: 0 8px 24px rgba(0,0,0,.2); z-index: 2; font-size: .9em; } .pmb-map__content > * + * { margin-top: .5rem; }
@media (max-width: 767px) { .pmb-map__content { position: relative; left: auto !important; top: auto !important; transform: none !important; width: auto !important; margin: 1rem; } .pmb-map { display: flex; flex-direction: column; justify-content: flex-end; } }
.pmb-scrollto { height: 0; }
.pmb-scrollto-nav { position: fixed; right: 20px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 10px; z-index: 50; }
.pmb-scrollto-nav a { width: 12px; height: 12px; border-radius: 50%; background: rgba(0,0,0,.25); position: relative; } .pmb-scrollto-nav a.is-active { background: var(--pmb-brand); }
.pmb-scrollto-nav a::after { content: attr(data-title); position: absolute; right: 20px; top: 50%; transform: translateY(-50%); background: #111; color: #fff; padding: .25em .6em; border-radius: 3px; font-size: 12px; white-space: nowrap; opacity: 0; transition: opacity .2s; pointer-events: none; } .pmb-scrollto-nav a:hover::after { opacity: 1; }
.pmb-crumbs { display: flex; gap: .5em; font-size: .85em; opacity: .8; flex-wrap: wrap; } .pmb-crumbs a { color: inherit; text-decoration: none; } .pmb-crumbs span:last-child { opacity: .7; }
.pmb-pageheader { position: relative; display: flex; align-items: center; padding: 3rem 0; margin-bottom: 2rem; background: var(--pmb-surface); }
.pmb-pageheader--featured { min-height: 260px; background: #1f2937; color: #fff; } .pmb-pageheader--simple { background: none; padding: 1.5rem 0; } .pmb-pageheader--divided { background: none; border-bottom: 1px solid var(--pmb-border); }
.pmb-pageheader.pmb-v-top { align-items: flex-start; } .pmb-pageheader.pmb-v-bottom { align-items: flex-end; }
.pmb-pageheader__inner { position: relative; z-index: 2; width: 100%; padding-inline: var(--pm-gutter, 5%); display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.pmb-pageheader.pmb-text-center .pmb-pageheader__inner { flex-direction: column; } .pmb-pageheader.pmb-text-right .pmb-pageheader__inner { flex-direction: row-reverse; }
.pmb-pageheader__title { margin: 0; } .pmb-pageheader__sub { margin: .25rem 0 0; opacity: .8; }
.pmb-the-title { margin: 0; } .pmb-excerpt { opacity: .85; }
.pmb-html { display: block; } .pmb-legacy { display: block; }

/* ---- contact form ---- */
.pmb-form { display: block; max-width: 100%; }
.pmb-form__field { margin: 0 0 1em; }
.pmb-form__field label { display: block; margin-bottom: .35em; font-weight: 600; font-size: .9375em; }
.pmb-form__req { color: var(--pm-palette-primary, #c00); }
.pmb-form input:not([type="checkbox"]):not([type="radio"]), .pmb-form textarea, .pmb-form select { display: block; width: 100%; box-sizing: border-box; padding: .7em .9em; border: 1px solid var(--pm-color-border-subtle, #ddd); border-radius: var(--pm-radius-form, 4px); background: var(--pm-color-surface, #fff); color: inherit; font: inherit; line-height: 1.4; }
.pmb-form input:focus, .pmb-form textarea:focus, .pmb-form select:focus { outline: none; border-color: var(--pm-palette-primary, #333); box-shadow: var(--pm-shadow-focus, 0 0 0 3px rgba(0,0,0,.08)); }
.pmb-form textarea { min-height: 7em; resize: vertical; }
.pmb-form--boxed input:not([type="checkbox"]):not([type="radio"]), .pmb-form--boxed textarea, .pmb-form--boxed select { background: var(--pm-color-surface-subtle, #f5f5f5); }
.pmb-form--underline input:not([type="checkbox"]):not([type="radio"]), .pmb-form--underline textarea, .pmb-form--underline select { border-width: 0 0 1px; border-radius: 0; padding-left: 0; padding-right: 0; background: transparent; }
.pmb-form--underline input:focus, .pmb-form--underline textarea:focus { box-shadow: none; border-bottom-color: var(--pm-palette-primary, #333); }
.pmb-form--columns { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1em; }
.pmb-form--columns > .pmb-form__field--textarea, .pmb-form--columns > .pmb-form__actions, .pmb-form--columns > .pmb-form__status, .pmb-form--columns > .pmb-form__hp { grid-column: 1 / -1; }
@media (max-width: 549px) { .pmb-form--columns { grid-template-columns: 1fr; } }
.pmb-form__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; margin: 0; }
.pmb-form__actions { margin: 0; }
.pmb-form .pmb-btn--expand { display: block; width: 100%; text-align: center; }
.pmb-form__status { margin-top: .9em; font-size: .9375em; }
.pmb-form__status:empty { display: none; }
.pmb-form.is-sent .pmb-form__status { color: var(--pm-color-success, #2e7d32); }
.pmb-form.is-failed .pmb-form__status { color: var(--pm-color-danger, #c62828); }
.pmb-form.is-sending .pmb-btn { opacity: .6; cursor: progress; }
.pmb-form.is-sent .pmb-form__field, .pmb-form.is-sent .pmb-form__actions { display: none; }
.pmb-dark .pmb-form input:not([type="checkbox"]):not([type="radio"]), .pmb-dark .pmb-form textarea, .pmb-dark .pmb-form select { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.25); color: #fff; }
.pmb-missing { padding: 1rem; border: 1px dashed currentColor; opacity: .6; text-align: center; }

/* ---- visibility (UX Builder names: small < 850, medium = tablet) ---- */
.pmb-hidden { display: none !important; }
@media (max-width: 849px) { .pmb-hide-for-medium { display: none !important; } }
@media (min-width: 850px) { .pmb-show-for-medium { display: none !important; } }
@media (max-width: 549px) { .pmb-hide-for-small { display: none !important; } }
@media (min-width: 550px) { .pmb-show-for-small { display: none !important; } }

/* ==========================================================================
   v6 — effects, conditions, scheme helpers and the elements borrowed from
   Flatsome 1.0 (marquee, image comparer, progress, rating, icon, list,
   popover, payment icons, lottie, content switcher).
   ========================================================================== */

/* transforms, opacity, hover state */
.pmb-tf { --pmb-tr: .3s; transition: transform var(--pmb-tr), opacity var(--pmb-tr), box-shadow var(--pmb-tr), background-color var(--pmb-tr), color var(--pmb-tr), filter var(--pmb-tr); }
.pmb-tf { transform: translate(var(--pmb-tx, 0), var(--pmb-ty, 0)) rotate(var(--pmb-rot, 0deg)) scale(var(--pmb-scale, 1)); opacity: var(--pmb-op, 1); }
.pmb-tf:not([style*="--pmb-tx"]):not([style*="--pmb-ty"]):not([style*="--pmb-rot"]):not([style*="--pmb-scale"]):not(.pmb-tf-hover) { transform: none; }
.pmb-tf-hover:hover { transform: translate(var(--pmb-tx, 0), calc(var(--pmb-ty, 0px) - var(--pmb-hlift, 0px))) rotate(var(--pmb-rot, 0deg)) scale(var(--pmb-hscale, var(--pmb-scale, 1))); opacity: var(--pmb-hop, var(--pmb-op, 1)); }
.pmb-hbg:hover { background-color: var(--pmb-hbg) !important; }
.pmb-hcol:hover, .pmb-hcol:hover h1, .pmb-hcol:hover h2, .pmb-hcol:hover h3, .pmb-hcol:hover h4, .pmb-hcol:hover p, .pmb-hcol:hover a { color: var(--pmb-hcol) !important; }
.pmb-shadow-xs { box-shadow: 0 1px 2px rgba(0,0,0,.08); } .pmb-shadow-sm { box-shadow: 0 2px 6px rgba(0,0,0,.1); } .pmb-shadow-md { box-shadow: 0 6px 16px rgba(0,0,0,.12); }
.pmb-shadow-lg { box-shadow: 0 12px 32px rgba(0,0,0,.16); } .pmb-shadow-xl { box-shadow: 0 24px 56px rgba(0,0,0,.22); } .pmb-shadow-inset { box-shadow: inset 0 2px 8px rgba(0,0,0,.14); }
.pmb-z { position: relative; }
.pmb-clamp { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--pmb-clamp, 3); overflow: hidden; }
.pmb-hidden-by-rule { display: none !important; }
.pmb-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.pmb-box--pos-top .pmb-box__text { top: 0; bottom: auto; } .pmb-box--pos-center .pmb-box__text { top: 50%; bottom: auto; transform: translateY(-50%); }
.pmb-countdown__unit.is-hidden { display: none; }
.pmb-countdown--text { display: inline-flex; gap: .35em; font-size: 100%; } .pmb-countdown--text .pmb-countdown__unit { flex-direction: row; gap: .2em; min-width: 0; padding: 0; align-items: baseline; }
.pmb-countdown--text .pmb-countdown__num { font-weight: 700; } .pmb-countdown--text .pmb-countdown__label { font-size: .8em; opacity: .75; }
.pmb-countdown--text .pmb-countdown__label:empty { display: none; }

/* marquee */
.pmb-marquee { --pmb-mq-gap: 40px; position: relative; overflow: hidden; width: 100%; }
.pmb-marquee__track { display: flex; width: max-content; will-change: transform; }
.pmb-marquee__group { display: flex; align-items: center; gap: var(--pmb-mq-gap); padding-right: var(--pmb-mq-gap); flex: 0 0 auto; }
.pmb-marquee--v-top .pmb-marquee__group { align-items: flex-start; } .pmb-marquee--v-bottom .pmb-marquee__group { align-items: flex-end; }
.pmb-marquee__group > * { flex: 0 0 auto; margin: 0 !important; width: auto; max-width: 80vw; }
.pmb-marquee__group > .pmb-image, .pmb-marquee__group > .pmb-logo { width: auto; }
.pmb-marquee--loop .pmb-marquee__track { animation: pmb-marquee var(--pmb-mq-dur, 20s) linear infinite; }
.pmb-marquee--loop.pmb-marquee--right .pmb-marquee__track { animation-direction: reverse; }
.pmb-marquee.is-pausable:hover .pmb-marquee__track { animation-play-state: paused; }
.pmb-marquee.has-fade { -webkit-mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent); mask-image: linear-gradient(to right, transparent, #000 10%, #000 90%, transparent); }
@keyframes pmb-marquee { to { transform: translateX(calc(-1 * var(--pmb-mq-w, 50%))); } }
@media (prefers-reduced-motion: reduce) { .pmb-marquee--loop .pmb-marquee__track { animation: none; } }

/* image comparer */
.pmb-compare { --pmb-cmp-pos: 50%; --pmb-cmp-line: 3px; --pmb-cmp-grip: 44px; --pmb-cmp-color: #fff; position: relative; overflow: hidden; user-select: none; }
.pmb-compare__box { position: relative; overflow: hidden; touch-action: none; cursor: col-resize; }
.pmb-compare--vertical .pmb-compare__box { cursor: row-resize; }
.pmb-compare__after, .pmb-compare__before { position: relative; }
.pmb-compare__after img, .pmb-compare__before img { display: block; width: 100%; height: auto; }
.pmb-compare .pmb-media.pmb-ratio .pmb-compare__after img, .pmb-compare .pmb-media.pmb-fixed .pmb-compare__after img, .pmb-compare .pmb-media.pmb-ratio .pmb-compare__before img, .pmb-compare .pmb-media.pmb-fixed .pmb-compare__before img { position: absolute; inset: 0; height: 100%; object-fit: cover; }
.pmb-compare .pmb-media.pmb-ratio .pmb-compare__after, .pmb-compare .pmb-media.pmb-fixed .pmb-compare__after { position: absolute; inset: 0; }
.pmb-compare__before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pmb-cmp-pos)) 0 0); }
.pmb-compare--vertical .pmb-compare__before { clip-path: inset(0 0 calc(100% - var(--pmb-cmp-pos)) 0); }
.pmb-compare__handle { position: absolute; top: 0; bottom: 0; left: var(--pmb-cmp-pos); width: var(--pmb-cmp-line); margin-left: calc(var(--pmb-cmp-line) / -2); background: var(--pmb-cmp-color); box-shadow: 0 0 6px rgba(0,0,0,.35); pointer-events: none; }
.pmb-compare--vertical .pmb-compare__handle { top: var(--pmb-cmp-pos); bottom: auto; left: 0; right: 0; width: auto; height: var(--pmb-cmp-line); margin-left: 0; margin-top: calc(var(--pmb-cmp-line) / -2); }
.pmb-compare__grip { position: absolute; top: 50%; left: 50%; width: var(--pmb-cmp-grip); height: var(--pmb-cmp-grip); transform: translate(-50%, -50%); border-radius: 50%; background: var(--pmb-cmp-color); color: #111; display: flex; align-items: center; justify-content: center; gap: .3em; font-size: calc(var(--pmb-cmp-grip) * .32); box-shadow: 0 2px 10px rgba(0,0,0,.3); }
.pmb-compare__grip i:empty { width: 40%; height: 40%; border: 2px solid #111; border-radius: 50%; display: block; }
.pmb-compare--vertical .pmb-compare__grip i { transform: rotate(90deg); }
.pmb-compare__label { position: absolute; top: 12px; padding: .25em .7em; font-size: .8em; font-weight: 600; border-radius: 4px; background: rgba(0,0,0,.55); color: #fff; pointer-events: none; transition: opacity .3s; }
.pmb-compare__label--before { left: 12px; } .pmb-compare__label--after { right: 12px; }
.pmb-compare--vertical .pmb-compare__label--before { top: 12px; left: 12px; } .pmb-compare--vertical .pmb-compare__label--after { top: auto; bottom: 12px; left: 12px; right: auto; }
.pmb-compare--labels-hover .pmb-compare__label { opacity: 0; } .pmb-compare--labels-hover:hover .pmb-compare__label { opacity: 1; }

/* progress bar */
.pmb-progress { --pmb-prog: 70%; --pmb-prog-h: 12px; --pmb-prog-r: 999px; --pmb-prog-color: var(--pm-primary, #1a203d); --pmb-prog-track: rgba(0,0,0,.08); width: 100%; }
.pmb-progress__head { display: flex; justify-content: space-between; font-size: .9em; font-weight: 600; margin-bottom: .4em; }
.pmb-progress__track { height: var(--pmb-prog-h); border-radius: var(--pmb-prog-r); background: var(--pmb-prog-track); overflow: hidden; }
.pmb-progress__bar { height: 100%; width: var(--pmb-prog); border-radius: inherit; background: var(--pmb-prog-color); transition: width 1.2s cubic-bezier(.2,.7,.2,1); }
.pmb-progress--fill:not(.is-in) .pmb-progress__bar { width: 0; }
.pmb-progress--striped .pmb-progress__bar { background-image: linear-gradient(45deg, rgba(255,255,255,.2) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.2) 50%, rgba(255,255,255,.2) 75%, transparent 75%); background-size: 1em 1em; animation: pmb-stripes 1s linear infinite; }
.pmb-progress--glow .pmb-progress__bar { box-shadow: 0 0 10px var(--pmb-prog-color); }
@keyframes pmb-stripes { to { background-position: 1em 0; } }

/* rating */
.pmb-rating { --pmb-rate-size: 20px; --pmb-rate-gap: 2px; --pmb-rate-color: #f5a623; --pmb-rate-empty: rgba(0,0,0,.15); display: flex; align-items: center; gap: .5em; font-size: var(--pmb-rate-size); line-height: 1; }
.pmb-rating.pmb-text-center { justify-content: center; } .pmb-rating.pmb-text-right { justify-content: flex-end; }
.pmb-rating__icons { display: inline-flex; gap: var(--pmb-rate-gap); }
.pmb-rating__icon { position: relative; display: inline-block; color: var(--pmb-rate-empty); }
.pmb-rating__full { position: absolute; inset: 0; overflow: hidden; width: var(--pmb-fill, 100%); color: var(--pmb-rate-color); white-space: nowrap; }
.pmb-rating__value, .pmb-rating__text { font-size: .8em; color: var(--pm-fg-muted, #666); }

/* icon */
.pmb-icon { --pmb-icon-size: 48px; display: block; line-height: 1; }
.pmb-icon.pmb-text-center { text-align: center; } .pmb-icon.pmb-text-right { text-align: right; }
.pmb-icon__box { display: inline-flex; align-items: center; justify-content: center; font-size: var(--pmb-icon-size); color: inherit; }
.pmb-icon__box--circle, .pmb-icon__box--outline, .pmb-icon__box--square { padding: var(--pmb-icon-pad, .45em); background: var(--pmb-icon-bg, var(--pm-subtle, #f3f4f6)); border-radius: 50%; }
.pmb-icon__box--square { border-radius: var(--pm-radius-card, 10px); }
.pmb-icon__box--outline { background: transparent; border: 2px solid currentColor; }
.pmb-icon__link { color: inherit; text-decoration: none; display: inline-block; transition: transform .25s; } .pmb-icon__link:hover { transform: scale(1.08); }

/* list */
.pmb-list { --pmb-list-gap: .5em; --pmb-list-icon: var(--pm-primary, #1a203d); list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--pmb-list-cols, 1), minmax(0, 1fr)); gap: var(--pmb-list-gap) 1.5em; }
.pmb-list--small { font-size: .9em; } .pmb-list--large { font-size: 1.15em; }
.pmb-list__item { display: flex; align-items: flex-start; gap: .6em; }
.pmb-list__icon { flex: 0 0 auto; color: var(--pmb-list-icon); line-height: 1.5; min-width: 1em; text-align: center; }
.pmb-list__icon i[data-list-icon]::before { font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f00c"; }
.pmb-list--none .pmb-list__icon { display: none; }
.pmb-list--bullets, .pmb-list[class*="pmb-list--"]:not(.pmb-list--checks):not(.pmb-list--checks-primary):not(.pmb-list--icons):not(.pmb-list--ordered):not(.pmb-list--none) { }
.pmb-list:not(.pmb-list--checks):not(.pmb-list--checks-primary):not(.pmb-list--icons):not(.pmb-list--ordered):not(.pmb-list--none) .pmb-list__icon i[data-list-icon]::before { content: "\f111"; font-size: .4em; vertical-align: middle; }
.pmb-list--checks .pmb-list__icon { color: var(--pm-fg-muted, #6b7280); }
.pmb-list--checks-primary .pmb-list__icon i[data-list-icon] { display: inline-flex; align-items: center; justify-content: center; width: 1.4em; height: 1.4em; border-radius: 50%; background: var(--pmb-list-icon); color: #fff; font-size: .7em; margin-top: .15em; }
.pmb-list--ordered { counter-reset: pmb-list; }
.pmb-list--ordered .pmb-list__item { counter-increment: pmb-list; }
.pmb-list--ordered .pmb-list__icon i[data-list-icon]::before { content: counter(pmb-list); font-family: inherit; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; width: 1.6em; height: 1.6em; border-radius: 50%; background: var(--pmb-list-icon); color: #fff; font-size: .8em; }
.pmb-list.has-dividers .pmb-list__item { padding-bottom: var(--pmb-list-gap); border-bottom: 1px solid var(--pm-border-color, #e5e7eb); }
.pmb-list__item.is-muted { opacity: .5; } .pmb-list__item.is-muted .pmb-list__text { text-decoration: line-through; }
.pmb-list__link { color: inherit; } .pmb-list__link:hover { text-decoration: underline; }

/* popover */
.pmb-popover { position: relative; }
.pmb-popover__trigger--text { color: var(--pm-primary, #1a203d); text-decoration: underline dotted; cursor: pointer; }
.pmb-popover__note { display: none; }
.pmb-popover__card { position: relative; width: 380px; max-width: calc(100vw - 32px); padding: 24px; background: var(--pm-surface, #fff); color: var(--pm-fg, #111); border-radius: var(--pm-radius-card, 12px); }
.pmb-popover__card > .pmb-popover__body > *:last-child { margin-bottom: 0; }
.pmb-popover__close { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(0,0,0,.06); color: inherit; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.pmb-popover__close:hover { background: rgba(0,0,0,.12); }
/* on the site: hidden until triggered */
html:not(.pmb-editing) .pmb-popover__layer { display: none; position: fixed; z-index: 9000; }
html:not(.pmb-editing) .pmb-popover.is-open .pmb-popover__layer { display: flex; }
html:not(.pmb-editing) .pmb-popover--center .pmb-popover__layer { inset: 0; align-items: center; justify-content: center; background: rgba(10,12,20,.55); padding: 16px; }
html:not(.pmb-editing) .pmb-popover--center .pmb-popover__card { animation: pmb-pop-in .3s cubic-bezier(.2,.7,.2,1) both; }
html:not(.pmb-editing) .pmb-popover--bottom-right .pmb-popover__layer { right: 20px; bottom: 20px; } html:not(.pmb-editing) .pmb-popover--bottom-left .pmb-popover__layer { left: 20px; bottom: 20px; }
html:not(.pmb-editing) .pmb-popover--bottom-right .pmb-popover__card, html:not(.pmb-editing) .pmb-popover--bottom-left .pmb-popover__card { animation: pmb-pop-up .35s cubic-bezier(.2,.7,.2,1) both; }
html:not(.pmb-editing) .pmb-popover--bottom .pmb-popover__layer, html:not(.pmb-editing) .pmb-popover--top .pmb-popover__layer { left: 0; right: 0; justify-content: center; }
html:not(.pmb-editing) .pmb-popover--bottom .pmb-popover__layer { bottom: 0; } html:not(.pmb-editing) .pmb-popover--top .pmb-popover__layer { top: 0; }
html:not(.pmb-editing) .pmb-popover--bottom .pmb-popover__card, html:not(.pmb-editing) .pmb-popover--top .pmb-popover__card { width: 100%; max-width: none; border-radius: 0; }
html:not(.pmb-editing) .pmb-popover--anchor .pmb-popover__layer { position: fixed; }
html:not(.pmb-editing) .pmb-popover--anchor .pmb-popover__card { animation: pmb-pop-in .2s ease-out both; }
body.pmb-popover-open { overflow: hidden; }
@keyframes pmb-pop-in { from { opacity: 0; transform: scale(.94) translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes pmb-pop-up { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
/* in the editor: the card sits inline under its trigger so it can be edited */
html.pmb-editing .pmb-popover__layer { display: block; margin-top: 10px; }
html.pmb-editing .pmb-popover__note { display: inline-block; font: 600 11px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; letter-spacing: .04em; text-transform: uppercase; color: #3d8ad6; background: rgba(61,138,214,.1); border: 1px dashed rgba(61,138,214,.6); border-radius: 4px; padding: 5px 8px; margin-bottom: 6px; }
html.pmb-editing .pmb-popover__card { border: 1px dashed rgba(61,138,214,.6); }

/* payment icons */
.pmb-pay { --pmb-pay-size: 32px; --pmb-pay-gap: 10px; display: flex; align-items: center; gap: .75em; flex-wrap: wrap; }
.pmb-pay.pmb-text-center { justify-content: center; } .pmb-pay.pmb-text-right { justify-content: flex-end; }
.pmb-pay__label { font-size: .85em; color: var(--pm-fg-muted, #666); }
.pmb-pay__icons { display: inline-flex; gap: var(--pmb-pay-gap); align-items: center; }
.pmb-pay__icon { position: relative; font-size: var(--pmb-pay-size); line-height: 1; display: inline-flex; }

/* lottie */
.pmb-lottie { display: block; }
.pmb-lottie.pmb-text-center .pmb-lottie__player { margin-left: auto; margin-right: auto; } .pmb-lottie.pmb-text-right .pmb-lottie__player { margin-left: auto; }
.pmb-lottie__player { position: relative; width: 100%; max-width: 100%; }
.pmb-lottie__player svg { display: block; width: 100%; height: 100%; }
.pmb-lottie__empty { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5em; color: #6b7280; background: repeating-linear-gradient(45deg, #f6f7f9 0 10px, #eef0f3 10px 20px); border-radius: 8px; font-size: .9em; }
.pmb-lottie__empty i { font-size: 2em; opacity: .5; }

/* content switcher */
.pmb-switch { --pmb-switch-color: var(--pm-primary, #1a203d); --pmb-switch-track: rgba(0,0,0,.06); }
.pmb-switch__nav.pmb-nav { display: inline-flex; gap: 0; padding: 4px; border-radius: 999px; background: var(--pmb-switch-track); margin-bottom: 1.5em; border: 0; }
.pmb-switch.pmb-text-center .pmb-switch__nav { margin-left: auto; margin-right: auto; display: flex; width: max-content; } .pmb-switch.pmb-text-right .pmb-switch__nav { margin-left: auto; display: flex; width: max-content; }
.pmb-switch .pmb-tabs__tab { position: relative; border: 0; background: transparent; padding: .55em 1.3em; border-radius: 999px; font-weight: 600; color: inherit; cursor: pointer; transition: background .25s, color .25s; }
.pmb-switch .pmb-tabs__tab.is-active { background: var(--pmb-switch-color); color: #fff; }
.pmb-switch--small .pmb-tabs__tab { font-size: .85em; padding: .45em 1em; } .pmb-switch--large .pmb-tabs__tab { font-size: 1.15em; padding: .65em 1.6em; }
.pmb-switch--tabs .pmb-switch__nav.pmb-nav { background: transparent; border-radius: 0; padding: 0; border-bottom: 2px solid var(--pm-border-color, #e5e7eb); gap: 1.5em; }
.pmb-switch--tabs .pmb-tabs__tab { border-radius: 0; padding: .6em 0; margin-bottom: -2px; border-bottom: 2px solid transparent; }
.pmb-switch--tabs .pmb-tabs__tab.is-active { background: transparent; color: var(--pmb-switch-color); border-bottom-color: var(--pmb-switch-color); }
.pmb-switch--toggle .pmb-switch__nav.pmb-nav { background: transparent; padding: 0; gap: .6em; align-items: center; }
.pmb-switch--toggle .pmb-tabs__tab { padding: .2em .2em; border-radius: 0; color: var(--pm-fg-muted, #666); }
.pmb-switch--toggle .pmb-tabs__tab.is-active { background: transparent; color: inherit; }
.pmb-switch--toggle .pmb-tabs__tab:first-child::after { content: ""; display: inline-block; vertical-align: middle; margin-left: .6em; width: 44px; height: 24px; border-radius: 999px; background: var(--pmb-switch-color); position: relative; }
.pmb-switch--toggle .pmb-tabs__tab:first-child::before { content: ""; position: absolute; right: 7px; top: 50%; width: 18px; height: 18px; margin-top: -9px; border-radius: 50%; background: #fff; z-index: 1; transition: transform .25s; }
.pmb-switch--toggle .pmb-tabs__tab:first-child.is-active::before { transform: translateX(-20px); }
.pmb-switch__badge { display: inline-block; margin-left: .5em; padding: .15em .5em; font-size: .7em; border-radius: 999px; background: var(--pm-accent, #db0072); color: #fff; vertical-align: middle; }
.pmb-switch .pmb-tabs__tab.is-active .pmb-switch__badge { background: rgba(255,255,255,.25); }
.pmb-switch--tabs .pmb-tabs__tab.is-active .pmb-switch__badge, .pmb-switch--toggle .pmb-tabs__tab.is-active .pmb-switch__badge { background: var(--pm-accent, #db0072); }
.pmb-dark .pmb-list { --pmb-list-icon: currentColor; }
.pmb-dark .pmb-list--checks-primary .pmb-list__icon i[data-list-icon], .pmb-dark .pmb-list--ordered .pmb-list__icon i[data-list-icon]::before { background: #fff; color: var(--pm-primary, #1a203d); }
.pmb-dark .pmb-progress { --pmb-prog-track: rgba(255,255,255,.18); --pmb-prog-color: #fff; }
.pmb-dark .pmb-switch { --pmb-switch-track: rgba(255,255,255,.14); --pmb-switch-color: #fff; } .pmb-dark .pmb-switch .pmb-tabs__tab.is-active { color: var(--pm-primary, #1a203d); }
.pmb-dark .pmb-icon__box--circle, .pmb-dark .pmb-icon__box--square { --pmb-icon-bg: rgba(255,255,255,.14); }
.pmb-dark .pmb-rating { --pmb-rate-empty: rgba(255,255,255,.25); } .pmb-dark .pmb-rating__value, .pmb-dark .pmb-rating__text, .pmb-dark .pmb-pay__label { color: inherit; opacity: .8; }
/* a colour scheme paints the element with the design-system tokens it switches */
.pmb-section[class*="pm-scheme-"], .pmb-row[class*="pm-scheme-"], .pmb-col[class*="pm-scheme-"], .pmb-grid__item[class*="pm-scheme-"], .pmb-banner[class*="pm-scheme-"], .pmb-textbox[class*="pm-scheme-"], .pmb-stack[class*="pm-scheme-"], .pmb-box-wrap[class*="pm-scheme-"], .pmb-messagebox[class*="pm-scheme-"], .pmb-pricing[class*="pm-scheme-"], .pmb-iconbox[class*="pm-scheme-"], .pmb-marquee[class*="pm-scheme-"], .pmb-popover[class*="pm-scheme-"] .pmb-popover__card, .pmb-tabs__panel[class*="pm-scheme-"] { background-color: var(--pm-bg); color: var(--pm-fg); }
