/* Depoimentos compartilhados: home e pagina de produto */
/* ═══ DEPOIMENTOS: dois videos verticais e as falas em carrossel ═══
   Os videos do Vimeo sao verticais (240x426). Na caixa 16:9 viravam uma tira fina com barras pretas.
   O cartao mostra so o rosto recortado da capa e o video toca num quadro vertical centralizado. */
.dep{display:grid;gap:18px;align-items:stretch}
@media(min-width:900px){.dep{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:22px}}
.dep-videos{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dv{position:relative;display:block;aspect-ratio:4/5;border:0;padding:0;border-radius:18px;overflow:hidden;cursor:pointer;
  background:#2a2023;isolation:isolate;box-shadow:0 18px 40px rgba(45,25,30,.2)}
@media(min-width:900px){.dv{aspect-ratio:auto;height:100%;min-height:420px}}
.dv img{position:absolute;inset:-14px;width:calc(100% + 28px);height:calc(100% + 28px);object-fit:cover;z-index:-2;
  filter:blur(6px) saturate(.85);transform:scale(1.04);transition:transform .6s ease,filter .6s ease}
.dv:hover img{transform:scale(1.09);filter:blur(4px) saturate(.95)}
/* a capa do video tem pouca resolucao: desfoque e um veu vinho por cima escondem o serrilhado */
.dv::after{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(0deg,rgba(8,5,6,.9) 0%,rgba(8,5,6,.35) 50%,rgba(8,5,6,.18) 100%),
             linear-gradient(135deg,rgba(122,28,50,.42),rgba(20,10,14,.3))}
.dv-play{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:62px;height:62px;border-radius:50%;
  display:grid;place-items:center;background:var(--ouro);color:#1E1604;box-shadow:0 0 0 10px rgba(212,175,55,.22);
  transition:transform .25s ease,box-shadow .25s ease}
.dv-play svg{margin-left:3px}
.dv:hover .dv-play{transform:translate(-50%,-50%) scale(1.08);box-shadow:0 0 0 14px rgba(212,175,55,.2)}
.dv-rot{position:absolute;left:16px;right:16px;bottom:14px;text-align:left}
.dv-rot b{display:block;font:700 14px var(--tit);color:#fff}
.dv-rot i{display:block;font-style:normal;font-size:12px;color:rgba(243,238,240,.7);margin-top:2px}
.dv:focus-visible{outline:3px solid #8A6614;outline-offset:3px}

.dep-falas{position:relative;display:flex;flex-direction:column;border-radius:22px;background:#140A0E;color:#F3EEF0;
  padding:34px 28px 26px;overflow:hidden;min-height:340px}
@media(min-width:900px){.dep-falas{padding:48px 48px 34px}}
.dep-falas::before{content:"";position:absolute;right:-90px;top:-90px;width:380px;height:380px;background:radial-gradient(circle,rgba(122,28,50,.45),transparent 65%)}
.df-aspas{position:relative;font-family:'Instrument Serif',serif;font-style:italic;font-size:110px;line-height:.55;color:#D4AF37;height:44px}
.df-palco{position:relative;flex:1;display:grid;margin-top:12px}
.df{grid-area:1/1;margin:0;display:flex;flex-direction:column;opacity:0;transform:translateY(14px);pointer-events:none;
  transition:opacity .5s ease,transform .5s ease}
.df.on{opacity:1;transform:none;pointer-events:auto}
.df blockquote{margin:0;font-family:var(--tit);font-weight:600;font-size:clamp(18px,1.9vw,24px);line-height:1.45;letter-spacing:-.015em;color:#F3EEF0}
.df figcaption{margin-top:auto;padding-top:24px}
.df figcaption b{display:block;font:700 15.5px var(--tit);color:#E8C75A}
.df figcaption span{display:block;margin-top:2px;font-size:12.5px;color:rgba(243,238,240,.6)}
.df-ctrl{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
.df-pontos{display:flex;gap:6px}
.df-ponto{width:26px;height:4px;border-radius:4px;border:0;padding:0;background:rgba(255,255,255,.18);cursor:pointer;transition:background .3s,width .3s}
.df-ponto.on{width:42px;background:#D4AF37}
.df-setas{display:flex;gap:8px}
.df-seta{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;cursor:pointer;
  display:grid;place-items:center;transition:background .2s,border-color .2s}
.df-seta:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.4)}

dialog.dv-modal{margin:auto;padding:0;border:0;background:transparent;overflow:visible;width:min(420px,calc(100vw - 32px))}
dialog.dv-modal::backdrop{background:rgba(5,3,4,.82);backdrop-filter:blur(6px)}
.dv-quadro{position:relative;aspect-ratio:9/16;max-height:calc(100vh - 80px);margin:0 auto;border-radius:18px;overflow:hidden;background:#000}
.dv-quadro iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.dv-fecha{position:absolute;top:-14px;right:-14px;z-index:2;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:#140A0E;
  font-size:26px;line-height:1;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.4)}
@media(max-width:480px){.dv-fecha{top:-52px;right:0}}


/* versao sobre fundo escuro (pagina de produto) */
.dep-escuro .dep-falas{border:1px solid rgba(255,255,255,.1);background:#170c11}
.dep-escuro .dv{box-shadow:0 18px 40px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.08)}
