/* Recortes: cards servidos pelo banco, sem SDK de terceiros. */
.bds-recortes{ --bds-accent:#E51C24; display:grid; grid-template-columns:repeat(var(--bds-cols,4),1fr); gap:14px; }
@media(max-width:1024px){ .bds-recortes{ grid-template-columns:repeat(3,1fr); } }
@media(max-width:600px){ .bds-recortes{ grid-template-columns:repeat(2,1fr); } }

.bds-rec{ display:flex; flex-direction:column; text-decoration:none; background:#16161B; border:1px solid #2C2C36; border-radius:12px; overflow:hidden; transition:transform .15s ease,border-color .15s ease; }
.bds-rec:hover{ transform:translateY(-3px); border-color:#3a3a46; }
/* Quando e um botao de play, zera o estilo nativo de botao. */
button.bds-rec{ width:100%; padding:0; margin:0; text-align:left; font:inherit; color:inherit; cursor:pointer; -webkit-appearance:none; appearance:none; }
button.bds-rec:focus-visible{ outline:2px solid var(--bds-accent); outline-offset:2px; }
.bds-rec__thumb{ position:relative; aspect-ratio:3/4; background:#0B0B0E; overflow:hidden; display:flex; align-items:center; justify-content:center; }
.bds-rec__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.bds-rec__thumb .bds-ph{ font:500 11px Inter,sans-serif; color:#3a3a46; }
.bds-rec__thumb::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:0; border-style:solid; border-width:0 0 16px 16px; border-color:transparent transparent var(--bds-accent) transparent; }
.bds-rec__body{ padding:12px 14px 14px; display:flex; flex-direction:column; gap:6px; }
.bds-rec__plat{ font:700 10px/1 Inter,system-ui,sans-serif; letter-spacing:.06em; text-transform:uppercase; color:var(--bds-accent); }
.bds-rec__title{ font:600 13px/1.35 Inter,sans-serif; color:#fff; }
.bds-rec:hover .bds-rec__title{ text-decoration:underline; }
.bds-recortes--editor{ padding:22px; border:1px dashed #4a4a55; border-radius:12px; color:#A2A8B4; font:400 13px Inter,sans-serif; background:#16161B; }

/* Botao de play sobre a miniatura. */
.bds-rec__play{ position:absolute; inset:0; margin:auto; width:52px; height:52px; border-radius:50%; background:rgba(0,0,0,.55); border:2px solid #fff; display:flex; align-items:center; justify-content:center; transition:background .15s ease,transform .15s ease; }
.bds-rec__play::after{ content:""; display:block; margin-left:3px; width:0; height:0; border-style:solid; border-width:9px 0 9px 15px; border-color:transparent transparent transparent #fff; }
.bds-rec--play:hover .bds-rec__play{ background:var(--bds-accent); border-color:var(--bds-accent); transform:scale(1.08); }

/* Lightbox: o recorte toca aqui, sem sair do site. */
body.bds-rec-noscroll{ overflow:hidden; }
.bds-rec-modal{ position:fixed; inset:0; z-index:99999; display:flex; align-items:center; justify-content:center; padding:20px; }
.bds-rec-modal[hidden]{ display:none; }
.bds-rec-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.82); }
.bds-rec-modal__box{ position:relative; z-index:1; max-width:min(92vw,520px); width:100%; display:flex; flex-direction:column; align-items:center; }
.bds-rec-modal__video{ width:100%; max-height:82vh; border-radius:12px; background:#000; display:block; }
.bds-rec-modal__title{ margin:12px 0 0; color:#fff; font:600 14px/1.4 Inter,sans-serif; text-align:center; }
.bds-rec-modal__close{ position:absolute; top:-14px; right:-14px; width:38px; height:38px; border-radius:50%; border:none; background:#fff; color:#111; font-size:24px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:0 4px 14px rgba(0,0,0,.4); }
.bds-rec-modal__close:hover{ background:var(--bds-accent,#E51C24); color:#fff; }
@media(max-width:600px){ .bds-rec-modal__close{ top:8px; right:8px; } }