/* ================================================================
   KOOSHA PIANO — VIDEO CAPTION
   Caption styles only — section/sticky/video rules moved to hero.css
   ================================================================ */

/* Caption overlay (inside hero-section, shown at scroll end) */
.video-caption {
  position: absolute;
  bottom: 8%;
  left: var(--container-pad);
  right: auto;
  text-align: right;
  direction: rtl;
  z-index: 3;
  opacity: 0;
  transform: translateY(-40px);
  transition: opacity 1.1s cubic-bezier(0.16, 0.8, 0.3, 1),
              transform 1.1s cubic-bezier(0.16, 0.8, 0.3, 1);
  pointer-events: none;
}

.video-caption.visible {
  opacity: 1;
  transform: translateY(0);
}

/* تیتر اصلی — Vazirmatn, رنگ استخوانی برندبوک */
.video-caption-text {
  display: block;
  font-family: 'Vazirmatn', Tahoma, sans-serif;
  font-size: clamp(1.6rem, 3vw, 2.8rem);
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: #FFFFFF;
  margin: 0;
}

/* زیرنویس — سفید با stroke طلایی نازک */
.video-caption-sub {
  display: block;
  font-family: 'Vazirmatn', Tahoma, sans-serif;
  font-size: clamp(1.1rem, 1.8vw, 1.5rem);
  font-weight: 300;
  color: #FFFFFF;
  -webkit-text-stroke: 0.4px #C9AA71;
  letter-spacing: 0.06em;
  margin: 0;
}

/* ── Services slide-in: sit above hero during transition ─────── */
@media (min-width: 768px) {
  .services-section {
    position: relative;
    z-index: 5;
  }
}

/* ── Mobile: caption always visible ─────────────────────────── */
@media (max-width: 767px) {
  .video-caption {
    position: relative;
    inset: auto;
    opacity: 1 !important;
    transform: none !important;
    padding: 1.5rem var(--container-pad);
    text-align: right;
  }
}