/* DN_ROOM_VIDEO_STAGE_PATCH_V4_DISPLAY_STAGE_20260529 */

.dn-proof .container,
.dn-proof__inner,
.dn-proof__wrap {
  max-width: 1380px !important;
}

.dn-proof__grid,
.dn-proof__content {
  grid-template-columns: minmax(390px, .95fr) minmax(620px, 1.05fr) !important;
  gap: clamp(54px, 5.5vw, 92px) !important;
  align-items: center !important;
}

.dn-proof__copy,
.dn-proof__text {
  max-width: 590px !important;
}

.dn-proof__visual,
.dn-proof__media,
.dn-proof__mockup {
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  isolation: isolate !important;
}

/* stage visível atrás do vídeo: contraste por massa, não só glow */
.dn-proof__visual::before,
.dn-proof__media::before,
.dn-proof__mockup::before {
  content: "" !important;
  position: absolute !important;
  z-index: -2 !important;
  left: 50% !important;
  top: 50% !important;
  width: 112% !important;
  height: 118% !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 46px !important;
  background:
    linear-gradient(135deg, rgba(24, 38, 76, .88), rgba(10, 18, 42, .82) 48%, rgba(5, 9, 24, .92)),
    radial-gradient(circle at 58% 42%, rgba(115, 145, 255, .26), transparent 48%) !important;
  box-shadow:
    0 42px 140px rgba(0,0,0,.44),
    0 0 0 1px rgba(150,170,255,.10) inset !important;
  pointer-events: none !important;
}

/* halo mais fino, só no contorno externo */
.dn-proof__visual::after,
.dn-proof__media::after,
.dn-proof__mockup::after {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  left: 50% !important;
  top: 50% !important;
  width: 108% !important;
  height: 104% !important;
  transform: translate(-50%, -50%) !important;
  border-radius: 46px !important;
  background:
    radial-gradient(circle at 50% 48%, rgba(112, 142, 255, .22), transparent 62%) !important;
  filter: blur(26px) !important;
  opacity: .74 !important;
  pointer-events: none !important;
}

.dn-room-video-card {
  width: min(820px, 48vw) !important;
  max-width: none !important;
  margin-inline: auto !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
  perspective: none !important;
}

.dn-room-demo-video {
  width: 100% !important;
  display: block !important;
  border-radius: 24px !important;
  background: #020611 !important;
  box-shadow:
    0 34px 110px rgba(0,0,0,.76),
    0 0 0 1px rgba(255,255,255,.10),
    0 0 0 2px rgba(120,145,255,.10) !important;
  filter: brightness(1.08) contrast(1.18) saturate(1.06) !important;
}

/* fundo geral mais chapado para o stage aparecer */
.dn-proof {
  background:
    radial-gradient(circle at 72% 46%, rgba(96, 126, 255, .22), transparent 36%),
    radial-gradient(circle at 58% 52%, rgba(42, 68, 150, .14), transparent 42%),
    linear-gradient(180deg, #040814 0%, #081122 52%, #040814 100%) !important;
}

/* cards da esquerda um pouco mais discretos para não brigar */
.dn-proof__card {
  background: rgba(12, 18, 32, .72) !important;
  border-color: rgba(145, 160, 210, .12) !important;
}

@media (max-width: 1200px) {
  .dn-room-video-card {
    width: min(760px, 52vw) !important;
  }
}

@media (max-width: 1100px) {
  .dn-proof__grid,
  .dn-proof__content {
    grid-template-columns: 1fr !important;
  }

  .dn-room-video-card {
    width: min(860px, 100%) !important;
  }

  .dn-proof__copy,
  .dn-proof__text {
    max-width: none !important;
  }
}

@media (max-width: 900px) {
  .dn-room-demo-video {
    border-radius: 18px !important;
  }

  .dn-room-video-card {
    width: 100% !important;
  }
}
