/* Static preview photographs; the play mark is decorative, with no playback. */
.tp-hero-area{background-color:#0d0c13}
.tp-hero-demo-thumb{position:relative;isolation:isolate;overflow:hidden;border-radius:10px;width:400px}
.tp-hero-demo-thumb[data-px-layout="e139"]{width:398px}
.tp-hero-demo-thumb[data-px-layout="e151"]{width:401px}
.tp-hero-demo-thumb img{display:block;width:100%;height:auto}
.tp-hero-demo-thumb::before{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(transparent 45%,rgba(0,0,0,.18));pointer-events:none}
.tp-hero-demo-thumb::after{content:"";position:absolute;z-index:2;left:50%;top:50%;width:62px;height:62px;transform:translate(-50%,-50%);border:2px solid rgba(255,255,255,.85);border-radius:50%;background:rgba(0,0,0,.15) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M26 20Q24 19 24 22V42Q24 45 27 43L44 34Q47 32 44 30Z' fill='white'/%3E%3C/svg%3E") center/100% no-repeat;box-shadow:0 2px 15px rgba(0,0,0,.12);pointer-events:none}
@media(max-width:767px){.tp-hero-demo-thumb::after{width:50px;height:50px}}
/* Reference photos already contain the supplied video's Play mark. */
.tp-hero-demo-thumb:has(img[src*="assets/brand/hero-reference/"])::after{display:none}
.px-hero-caption{position:absolute;z-index:3;left:15px;right:15px;bottom:14px;text-align:center;color:#fff;font:700 17px/1.25 'PX Noto Sans','PX Georgian',sans-serif;pointer-events:none;text-shadow:0 1px 3px #000}
.px-hero-caption span{background:rgba(10,10,10,.65);padding:3px 7px;box-decoration-break:clone;-webkit-box-decoration-break:clone}