/* ── CloudinaryVideo component ────────────────────────────── */
.cv-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #0a0a0a;
}

.cv-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: opacity 0.35s ease;
}

.cv-video--hidden  { opacity: 0; }
.cv-video--visible { opacity: 1; }

/* Skeleton shimmer */
.cv-skeleton {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #1a1a1a 25%, #2a2a2a 50%, #1a1a1a 75%);
  background-size: 200% 100%;
  animation: shimmer 1.4s ease infinite;
  z-index: 2;
  transition: opacity 0.3s ease;
}

.cv-skeleton--hidden {
  opacity: 0;
  pointer-events: none;
}

/* Fallback image */
.cv-fallback {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 3;
}

/* Error label */
.cv-error-label {
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 4;
  font-size: 0.6rem;
  font-family: monospace;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  pointer-events: none;
}

/* ── Scroll Reveal utility classes ──────────────────────── */
/* NOTE: reveal-hidden is applied by JS only (progressive enhancement).
   If JS fails, elements remain visible — content always accessible. */

.reveal-hidden {
  opacity: 0;
  transform: translateY(28px);
  transition: none !important;
}

.reveal-visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
  transition: opacity 0.65s cubic-bezier(0.22, 1, 0.36, 1),
              transform 0.65s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

.reveal-visible.reveal-visible--d1 {
  transition-delay: 0.12s !important;
}

.reveal-visible.reveal-visible--d2 {
  transition-delay: 0.24s !important;
}

.reveal-visible.reveal-visible--d3 {
  transition-delay: 0.36s !important;
}