/* V15 — PRODUTOS EM VÍDEO no mesmo tamanho/linguagem dos CASES do Media Kit + HERO com o banner completo. */

/* ================= HERO DESKTOP — usa a arte completa sem recorte ================= */
@media (min-width:821px){
  html body #heroSection,
  html body #heroSection.hero-v4{
    position:relative!important;
    width:min(1220px,calc(100% - 40px))!important;
    max-width:1220px!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:2048/682!important;
    padding:0!important;
    overflow:hidden!important;
    background:#010914!important;
    border:1px solid rgba(33,171,255,.22)!important;
    border-radius:0!important;
  }
  html body #heroSection #heroBg.hero-bg,
  html body #heroSection.hero-v4 #heroBg.hero-bg{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    opacity:1!important;
    background-image:url('/recomendacoes/assets/recomendacoes-hero-delta.webp')!important;
    background-repeat:no-repeat!important;
    background-size:100% 100%!important;
    background-position:center center!important;
    transform:none!important;
    filter:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }
  html body #heroSection::before,
  html body #heroSection::after,
  html body #heroSection .hero-shade,
  html body #heroSection .hero-content,
  html body #heroSection .hero-rail{
    display:none!important;
  }
}

/* ================= PRODUTOS EM VÍDEO — estilo CASES do Media Kit ================= */
html body #proofGallerySection.videos-v4.videos-v15{
  position:relative!important;
  overflow:hidden!important;
  padding-top:32px!important;
  padding-bottom:34px!important;
}
html body #proofGallerySection.videos-v15 .section-head{
  margin-bottom:20px!important;
}
html body #proofGallerySection.videos-v15 .proof-gallery-viewport{
  position:relative!important;
  width:100%!important;
  overflow:hidden!important;
  padding:2px 0 18px!important;
  scroll-behavior:auto!important;
  scrollbar-width:none!important;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 1.1%,#000 98.9%,transparent 100%)!important;
  mask-image:linear-gradient(90deg,transparent 0,#000 1.1%,#000 98.9%,transparent 100%)!important;
}
html body #proofGallerySection.videos-v15 .proof-gallery-viewport::-webkit-scrollbar{display:none!important}
html body #proofGallerySection.videos-v15 .proof-gallery-track{
  display:flex!important;
  align-items:stretch!important;
  gap:14px!important;
  width:max-content!important;
  min-width:max-content!important;
  transform:none!important;
  animation:none!important;
  will-change:auto!important;
}

html body #proofGallerySection.videos-v15 .proof-gallery-card{
  position:relative!important;
  flex:0 0 315px!important;
  width:315px!important;
  min-width:315px!important;
  height:510px!important;
  min-height:510px!important;
  max-height:510px!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  scroll-snap-align:none!important;
  border:1px solid rgba(90,166,222,.25)!important;
  border-radius:16px!important;
  background:#050d16!important;
  box-shadow:0 18px 44px rgba(0,0,0,.22)!important;
  transform:translateZ(0)!important;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease!important;
}
html body #proofGallerySection.videos-v15 .proof-gallery-card:hover{
  transform:translateY(-4px)!important;
  border-color:rgba(52,184,255,.62)!important;
  box-shadow:0 24px 54px rgba(0,0,0,.33),0 0 26px rgba(0,146,255,.08)!important;
  z-index:4!important;
}

html body #proofGallerySection.videos-v15 .proof-embed{
  position:relative!important;
  flex:0 0 260px!important;
  width:100%!important;
  height:260px!important;
  min-height:260px!important;
  max-height:260px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 44%,rgba(19,171,255,.12),transparent 34%),
    #06111e!important;
  border-bottom:1px solid rgba(90,166,222,.14)!important;
  isolation:isolate!important;
  cursor:pointer!important;
}
html body #proofGallerySection.videos-v15 .proof-embed img,
html body #proofGallerySection.videos-v15 .proof-embed video,
html body #proofGallerySection.videos-v15 .proof-embed iframe{
  width:100%!important;
  height:100%!important;
  display:block!important;
  border:0!important;
  object-fit:cover!important;
}
html body #proofGallerySection.videos-v15 .proof-embed iframe:not([src]){display:none!important}
html body #proofGallerySection.videos-v15 .proof-embed.is-playing::after,
html body #proofGallerySection.videos-v15 .proof-embed.is-playing .proof-video-placeholder{display:none!important}
html body #proofGallerySection.videos-v15 .proof-gallery-card:hover .proof-embed img{transform:scale(1.025)!important;filter:saturate(1.04) brightness(1.03)!important}

html body #proofGallerySection.videos-v15 .proof-embed::after{
  content:'▶'!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  z-index:5!important;
  transform:translate(-50%,-50%)!important;
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:rgba(9,157,255,.92)!important;
  border:1px solid rgba(255,255,255,.34)!important;
  color:#fff!important;
  font-size:1.18rem!important;
  line-height:1!important;
  box-shadow:0 0 28px rgba(0,144,255,.34)!important;
  pointer-events:none!important;
}
html body #proofGallerySection.videos-v15 .proof-video-placeholder{
  position:absolute!important;
  inset:0!important;
  z-index:1!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:flex-start!important;
  padding:18px!important;
  background:
    radial-gradient(circle at 68% 18%,rgba(10,142,255,.16),transparent 30%),
    linear-gradient(180deg,#071827,#020b13)!important;
  color:#86d3ff!important;
}
html body #proofGallerySection.videos-v15 .proof-video-placeholder small{
  font-size:.64rem!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}

html body #proofGallerySection.videos-v15 .proof-copy{
  flex:1 1 auto!important;
  min-width:0!important;
  min-height:0!important;
  padding:16px!important;
  display:flex!important;
  flex-direction:column!important;
  background:#050d16!important;
}
html body #proofGallerySection.videos-v15 .proof-kicker{
  display:block!important;
  margin:0 0 7px!important;
  color:#41baff!important;
  font-size:.62rem!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
html body #proofGallerySection.videos-v15 .proof-copy strong{
  display:-webkit-box!important;
  overflow:hidden!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  min-height:43px!important;
  margin:0!important;
  color:#fff!important;
  font-size:1.03rem!important;
  font-weight:800!important;
  line-height:1.18!important;
  letter-spacing:-.01em!important;
}
html body #proofGallerySection.videos-v15 .proof-copy>span{
  display:-webkit-box!important;
  overflow:hidden!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  min-height:48px!important;
  margin:10px 0 0!important;
  color:#8292a4!important;
  font-size:.72rem!important;
  line-height:1.5!important;
}
html body #proofGallerySection.videos-v15 .proof-actions{
  display:flex!important;
  margin-top:auto!important;
  padding-top:14px!important;
}
html body #proofGallerySection.videos-v15 .proof-action{
  width:100%!important;
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 16px!important;
  border-radius:9px!important;
  border:1px solid rgba(17,156,255,.35)!important;
  background:rgba(3,15,27,.55)!important;
  color:#c9e9ff!important;
  text-decoration:none!important;
  font-size:.62rem!important;
  font-weight:900!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
  transition:.2s ease!important;
}
html body #proofGallerySection.videos-v15 .proof-action:hover{
  background:rgba(17,156,255,.14)!important;
  border-color:rgba(17,156,255,.72)!important;
  color:#fff!important;
  box-shadow:0 0 18px rgba(0,132,255,.22)!important;
}
html body #proofGallerySection.videos-v15 .proof-buy-link{display:none!important}

@media(max-width:1100px){
  html body #proofGallerySection.videos-v15 .proof-gallery-card{flex-basis:292px!important;width:292px!important;min-width:292px!important;height:480px!important;min-height:480px!important;max-height:480px!important}
  html body #proofGallerySection.videos-v15 .proof-embed{flex-basis:238px!important;height:238px!important;min-height:238px!important;max-height:238px!important}
}
@media(max-width:820px){
  html body #proofGallerySection.videos-v15{padding-top:24px!important;padding-bottom:22px!important}
  html body #proofGallerySection.videos-v15 .proof-gallery-card{flex-basis:260px!important;width:260px!important;min-width:260px!important;height:430px!important;min-height:430px!important;max-height:430px!important;border-radius:14px!important}
  html body #proofGallerySection.videos-v15 .proof-embed{flex-basis:205px!important;height:205px!important;min-height:205px!important;max-height:205px!important}
  html body #proofGallerySection.videos-v15 .proof-copy{padding:13px!important}
  html body #proofGallerySection.videos-v15 .proof-copy strong{font-size:.88rem!important;min-height:39px!important}
  html body #proofGallerySection.videos-v15 .proof-copy>span{font-size:.65rem!important;min-height:40px!important}
}
@media(max-width:520px){
  html body #proofGallerySection.videos-v15 .proof-gallery-card{flex-basis:235px!important;width:235px!important;min-width:235px!important;height:405px!important;min-height:405px!important;max-height:405px!important}
  html body #proofGallerySection.videos-v15 .proof-embed{flex-basis:188px!important;height:188px!important;min-height:188px!important;max-height:188px!important}
  html body #proofGallerySection.videos-v15 .proof-embed::after{width:50px!important;height:50px!important;font-size:1rem!important}
}
