/* ── LIGHTBOX CAPTION ── */
.glightbox-clean .gslide-description { background: transparent !important; box-shadow: none !important; }
.glightbox-clean .gslide-title {
  font-family: 'Satoshi', sans-serif !important;
  font-weight: 400 !important;
  font-size: 13px !important;
  color: rgba(255,255,255,0.6) !important;
  text-align: center;
  letter-spacing: 0.04em;
  margin-bottom: 0 !important;
}

/* Hide the baked-in black fill with a handset-shaped corner mask.
   Use an elliptical radius so the crop follows the phone silhouette
   more closely without trimming the visible frame.
   Scoped to Vennio only — other projects show videos unclipped. */
[data-project="vennio"] .scrolly-outer .phone-slot video,
[data-project="vennio"] .mobile-panel-media .phone-slot video {
  clip-path: inset(0 round 24% / 11%);
}

@media (max-width: 900px) {
  /* Phase 4 phone videos already contain the phone frame — show them raw */
  .mobile-panel-media .phone-slot {
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
    aspect-ratio: auto;
    width: 100%;
  }
  .mobile-panel-media .phone-slot video {
    object-fit: contain;
    height: auto;
  }

  /* Vennio / Bleach: constrain phone videos to viewport height so they don't flood the screen */
  [data-project="vennio"] .mobile-panel-media,
  [data-project="bleach"] .mobile-panel-media {
    display: flex;
    justify-content: center;
  }
  [data-project="vennio"] .mobile-panel-media .phone-slot,
  [data-project="bleach"] .mobile-panel-media .phone-slot {
    width: auto;
  }
  [data-project="vennio"] .mobile-panel-media .phone-slot video,
  [data-project="bleach"] .mobile-panel-media .phone-slot video {
    height: 62svh;
    width: auto;
  }

  /* Remove the desktop clip-path mask on mobile — too aggressive at small sizes */
  [data-project="vennio"] .scrolly-outer .phone-slot video,
  [data-project="vennio"] .mobile-panel-media .phone-slot video {
    clip-path: none;
  }
}
