/* Vídeo abaixo do topo: capa leve; o player do YouTube só carrega no clique.
   Mesmo componente da página do HeyVoice, na cor do HeyEase. A moldura (.video-frame)
   e o espaçamento da seção ficam em structure.css. */
.video-frame iframe,.video-play{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-play{padding:0;cursor:pointer;background:#0b0d0c;display:block}
.video-play img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease,filter .3s}
.video-play:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,#00000010,#00000059)}
.video-btn{position:absolute;left:50%;top:50%;z-index:1;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:#51b858;display:grid;place-items:center;box-shadow:0 0 0 12px #51b85833,0 16px 40px #00000066;transition:transform .25s ease}
.video-btn svg{width:34px;height:34px;fill:#0f1f10;margin-left:5px}
.video-play:hover img{transform:scale(1.02);filter:brightness(1.05)}
.video-play:hover .video-btn,.video-play:focus-visible .video-btn{transform:scale(1.08)}
.video-play:focus-visible{outline:3px solid #51b858;outline-offset:-3px}
@media (max-width:560px){.video-btn{width:64px;height:64px;margin:-32px 0 0 -32px}.video-btn svg{width:26px;height:26px}}
