/* Scoped styles so Flatsome defaults do not alter the component. */
.hpdl-slider{container-type:inline-size;--hpdl-ratio:4/3;--hpdl-gap:12px;--hpdl-radius:12px;position:relative;width:100%;max-width:100%;font-family:inherit;color:#fff;line-height:1.4;box-sizing:border-box;isolation:isolate}
.hpdl-slider *{box-sizing:border-box}
.hpdl-slider button{font-family:inherit;cursor:pointer;box-shadow:none;margin:0;border:0;text-transform:none;letter-spacing:normal}
.hpdl-stage{position:relative;min-width:0;overflow:hidden;border-radius:var(--hpdl-radius)}
.hpdl-track{display:flex;gap:var(--hpdl-gap);width:100%;align-items:stretch;min-width:0}
.hpdl-slide{position:relative;overflow:hidden;min-width:0;aspect-ratio:var(--hpdl-ratio);border-radius:var(--hpdl-radius);background:#172332;flex:none;transition:flex .5s cubic-bezier(.2,.8,.2,1),opacity .25s ease;isolation:isolate}
.hpdl-slide-hit{display:block;width:100%;height:100%;padding:0;background:#162332;border:0;border-radius:inherit;overflow:hidden;position:relative}
.hpdl-slide-hit img{display:block;width:100%;height:100%;max-height:none;max-width:none;object-fit:cover;object-position:center;transition:transform .45s ease;filter:none}
.hpdl-slide:hover .hpdl-slide-hit img{transform:scale(1.025)}
.hpdl-slide-caption{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:22px 16px 12px;background:linear-gradient(transparent,rgba(0,0,0,.72));color:#fff;font-size:14px;font-weight:600;line-height:1.45;pointer-events:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.hpdl-video-placeholder{width:100%;height:100%;display:grid;place-items:center;background:linear-gradient(145deg,#243953,#101820)}
.hpdl-play-icon{display:grid;place-items:center;padding-left:4px;width:60px;height:60px;border-radius:100%;font-size:23px;color:#fff;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.58);backdrop-filter:blur(8px)}
.hpdl-inline-frame{position:absolute;inset:0;z-index:3;width:100%;height:100%;border:0;background:#101820}
.hpdl-nav{position:absolute!important;top:50%;z-index:5;transform:translateY(-50%);background:rgba(0,0,0,.48)!important;color:white!important;display:grid;place-items:center;width:40px;height:40px;min-height:0!important;line-height:1;border:1px solid rgba(255,255,255,.24)!important;border-radius:50%;padding:0!important;font-size:21px;transition:background .2s}
.hpdl-nav:hover{background:rgba(0,0,0,.85)!important}.hpdl-prev{left:12px}.hpdl-next{right:12px}
.hpdl-layout-expand .hpdl-stage{overflow:visible}
.hpdl-layout-expand .hpdl-track{height:clamp(220px,36vw,480px)}
.hpdl-layout-expand .hpdl-slide{flex:1 1 0;height:100%;aspect-ratio:auto;min-width:40px}
.hpdl-layout-expand .hpdl-slide.is-active{flex:3.4 1 0}
.hpdl-layout-expand .hpdl-slide-caption{opacity:0;transition:opacity .2s}.hpdl-layout-expand .hpdl-slide.is-active .hpdl-slide-caption{opacity:1}
.hpdl-layout-gallery .hpdl-track{display:block;position:relative;min-height:260px}
.hpdl-layout-gallery .hpdl-slide{width:100%;display:none;max-height:660px}.hpdl-layout-gallery .hpdl-slide.is-active{display:block}
.hpdl-thumbs{display:flex;gap:8px;margin-top:10px;overflow-x:auto;scrollbar-width:thin;padding:2px 0 6px}
.hpdl-thumb{padding:0!important;flex:0 0 clamp(64px,12vw,110px);height:72px;min-height:0!important;overflow:hidden;background:#243953!important;border:2px solid transparent!important;border-radius:7px;opacity:.65;transition:opacity .2s}
.hpdl-thumb.is-active{border-color:#2271b1!important;opacity:1}
.hpdl-thumb img{width:100%;height:100%;object-fit:cover;display:block}.hpdl-thumb-video{display:grid;place-items:center;color:#fff;font-size:25px;height:100%}
.hpdl-layout-mixed .hpdl-track,.hpdl-layout-reels .hpdl-track{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 0 2px;scroll-behavior:smooth}
.hpdl-layout-mixed .hpdl-track::-webkit-scrollbar,.hpdl-layout-reels .hpdl-track::-webkit-scrollbar{display:none}
.hpdl-layout-mixed .hpdl-slide{flex:0 0 min(70%,420px);scroll-snap-align:start}
.hpdl-layout-reels .hpdl-slide{flex:0 0 min(43%,290px);aspect-ratio:9/16;scroll-snap-align:start}
.hpdl-layout-reels .hpdl-stage,.hpdl-layout-mixed .hpdl-stage{overflow:hidden}
.hpdl-lightbox{position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:20px}
.hpdl-lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.88);border:0;cursor:zoom-out}
.hpdl-lightbox-content{position:relative;z-index:2;max-width:min(1200px,96vw);max-height:92vh;display:grid;place-items:center}
.hpdl-lightbox-content img{display:block;max-width:96vw;max-height:90vh;width:auto;height:auto;object-fit:contain}
.hpdl-lightbox-content iframe{width:min(1100px,92vw);height:min(78vh,620px);border:0;background:#111}
.hpdl-lightbox-close{position:absolute;right:0;top:-45px;background:transparent;border:0;color:#fff;font-size:38px;line-height:1;cursor:pointer}
@media(max-width:849px){.hpdl-layout-expand .hpdl-track{height:clamp(210px,65vw,440px)}.hpdl-layout-expand .hpdl-slide.is-active{flex:2.6 1 0}.hpdl-layout-mixed .hpdl-slide{flex-basis:75%}.hpdl-layout-reels .hpdl-slide{flex-basis:55%}.hpdl-nav{width:34px;height:34px;font-size:17px}}
@media(max-width:549px){.hpdl-layout-expand .hpdl-track{gap:5px;height:280px}.hpdl-layout-expand .hpdl-slide{min-width:19px}.hpdl-layout-expand .hpdl-slide.is-active{flex:7 1 0}.hpdl-layout-gallery .hpdl-track{min-height:180px}.hpdl-layout-mixed .hpdl-slide{flex-basis:86%}.hpdl-layout-reels .hpdl-slide{flex-basis:73%}.hpdl-slide-caption{font-size:12px;padding:22px 10px 10px}.hpdl-prev{left:6px}.hpdl-next{right:6px}.hpdl-thumb{flex-basis:65px;height:55px}}
@media(prefers-reduced-motion:reduce){.hpdl-slider *{transition:none!important;scroll-behavior:auto!important}}

/* 3D Coverflow. The same CSS is used inside Flatsome UX Builder and on the site. */
.hpdl-layout-coverflow{container-type:inline-size}
.hpdl-layout-coverflow .hpdl-stage{perspective:1250px;perspective-origin:50% 45%;overflow:hidden;padding:14px 0 24px;border-radius:var(--hpdl-radius)}
.hpdl-layout-coverflow .hpdl-track{display:block;position:relative;height:auto;aspect-ratio:var(--hpdl-coverflow-ratio);min-height:210px;max-height:520px;transform-style:preserve-3d;overflow:visible}
.hpdl-layout-coverflow .hpdl-slide{position:absolute;left:50%;top:0;width:min(59%,570px);height:100%;max-height:none;aspect-ratio:auto;transform-origin:center center;transform:translate3d(-50%,0,-320px) scale(.7);opacity:0;pointer-events:none;backface-visibility:hidden;box-shadow:0 18px 34px rgba(3,15,27,.27);transition:transform .55s cubic-bezier(.2,.75,.2,1),opacity .45s ease,box-shadow .45s ease;will-change:transform}
.hpdl-layout-coverflow .hpdl-slide.is-active{box-shadow:0 20px 45px rgba(3,15,27,.38)}
.hpdl-layout-coverflow .hpdl-slide .hpdl-slide-hit img{transition:transform .35s ease}
.hpdl-layout-coverflow .hpdl-nav{z-index:60}
/* CSS-only initial preview if a visual builder delays or disables JavaScript. */
.hpdl-layout-coverflow:not(.hpdl-ready) .hpdl-slide:first-child{opacity:1;pointer-events:auto;z-index:5;transform:translate3d(-50%,0,0) scale(1)}
.hpdl-layout-coverflow:not(.hpdl-ready) .hpdl-slide:nth-child(2){opacity:.78;pointer-events:auto;z-index:4;transform:translate3d(calc(-50% + 22cqw),0,-150px) rotateY(-38deg) scale(.86)}
.hpdl-layout-coverflow:not(.hpdl-ready) .hpdl-slide:nth-child(3){opacity:.6;pointer-events:auto;z-index:3;transform:translate3d(calc(-50% + 37cqw),0,-260px) rotateY(-49deg) scale(.76)}
.hpdl-layout-coverflow:not(.hpdl-ready) .hpdl-slide:nth-child(4){opacity:.78;pointer-events:auto;z-index:4;transform:translate3d(calc(-50% - 22cqw),0,-150px) rotateY(38deg) scale(.86)}
.hpdl-layout-coverflow:not(.hpdl-ready) .hpdl-slide:nth-child(5){opacity:.6;pointer-events:auto;z-index:3;transform:translate3d(calc(-50% - 37cqw),0,-260px) rotateY(49deg) scale(.76)}

@media(max-width:549px){.hpdl-layout-coverflow .hpdl-track{height:auto;aspect-ratio:var(--hpdl-coverflow-mobile-ratio);min-height:230px;max-height:480px}.hpdl-layout-coverflow .hpdl-slide{width:76%}.hpdl-layout-coverflow .hpdl-stage{padding:9px 0 16px}}

/* Prefer the actual builder canvas/component width over the browser viewport. */
@container (max-width: 549px){
 .hpdl-layout-coverflow .hpdl-track{height:auto;aspect-ratio:var(--hpdl-coverflow-mobile-ratio);min-height:230px;max-height:480px}
 .hpdl-layout-coverflow .hpdl-slide{width:76%}
 .hpdl-layout-coverflow .hpdl-stage{padding:9px 0 16px}
 .hpdl-layout-expand .hpdl-track{height:280px;gap:5px}
 .hpdl-layout-expand .hpdl-slide{min-width:19px}
 .hpdl-layout-expand .hpdl-slide.is-active{flex:7 1 0}
 .hpdl-layout-gallery .hpdl-track{min-height:180px}
 .hpdl-layout-mixed .hpdl-slide{flex-basis:86%}
 .hpdl-layout-reels .hpdl-slide{flex-basis:73%}
 .hpdl-thumb{flex-basis:65px;height:55px}
}
@container (min-width: 550px) and (max-width: 849px){
 .hpdl-layout-expand .hpdl-track{height:clamp(210px,65cqw,440px)}
 .hpdl-layout-expand .hpdl-slide.is-active{flex:2.6 1 0}
 .hpdl-layout-mixed .hpdl-slide{flex-basis:75%}
 .hpdl-layout-reels .hpdl-slide{flex-basis:55%}
}
