/* منتجع النيل الدولي — افتتاحية Hero سينمائية T33 */
:root {
  --nile-intro-gold: #e5bd57;
  --nile-intro-deep: #020914;
}


/* T35 — حركة Hero واحدة فقط، بدون أي أنيميشن قديم متداخل. */
.hero-content,
.primary-actions,
.primary-actions .feature-card {
  animation: none !important;
}

/* T36 — التسلسل المعتمد: الشعار، لمعة واحدة، النص، ثم البطاقات الثلاث مرة واحدة. */
html.nile-hero-intro-pending.nile-hero-intro-play .hero-logo-stage {
  animation: nileHeroLogoReveal .76s cubic-bezier(.16,.90,.28,1) .18s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero-logo-stage::after {
  animation: nileHeroLogoGlint .68s ease-in-out .82s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero h1 {
  animation: nileHeroTextReveal .58s cubic-bezier(.16,.86,.30,1) .96s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero-subtitle {
  animation: nileHeroTextReveal .54s cubic-bezier(.16,.86,.30,1) 1.08s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero-ornament {
  animation: nileHeroTextReveal .50s cubic-bezier(.16,.86,.30,1) 1.18s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .primary-actions .feature-card:nth-child(1) {
  animation: nileHeroCardReveal .58s cubic-bezier(.16,.86,.30,1) 1.36s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .primary-actions .feature-card:nth-child(2) {
  animation: nileHeroCardReveal .58s cubic-bezier(.16,.86,.30,1) 1.47s forwards !important;
}
html.nile-hero-intro-pending.nile-hero-intro-play .primary-actions .feature-card:nth-child(3) {
  animation: nileHeroCardReveal .58s cubic-bezier(.16,.86,.30,1) 1.58s forwards !important;
}

html.nile-hero-intro-complete .hero-content,
html.nile-hero-intro-complete .primary-actions,
html.nile-hero-intro-complete .primary-actions .feature-card,
html.nile-hero-intro-skip .hero-content,
html.nile-hero-intro-skip .primary-actions,
html.nile-hero-intro-skip .primary-actions .feature-card {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}

.hero.hero-photo {
  background-image: url('assets/hero-cinematic-night.webp');
  background-position: center 48%;
  background-size: cover;
  isolation: isolate;
}
.hero-cinematic-media,
.hero-cinematic-light {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero-cinematic-media {
  z-index: 0;
  overflow: hidden;
  border-radius: inherit;
}
.hero-cinematic-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 48%;
  transform: scale(1.015);
  filter: saturate(1.02) contrast(1.03) brightness(.88);
  will-change: transform, filter;
}
.hero-overlay {
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(2,8,15,.26) 0%, rgba(3,10,18,.18) 30%, rgba(3,10,18,.58) 64%, rgba(2,7,13,.92) 100%),
    radial-gradient(circle at 50% 38%, rgba(229,189,87,.10), transparent 28rem);
}
.hero-cinematic-light {
  z-index: 2;
  opacity: 0;
  overflow: hidden;
  mix-blend-mode: screen;
}
.hero-cinematic-light::before {
  content: "";
  position: absolute;
  top: -18%;
  bottom: -18%;
  left: -32%;
  width: 24%;
  transform: skewX(-16deg);
  background: linear-gradient(90deg, transparent, rgba(255,239,190,.19), rgba(255,246,216,.42), rgba(255,239,190,.14), transparent);
  filter: blur(6px);
}
.hero-content,
.primary-actions { z-index: 3; }
.hero-logo-stage {
  position: relative;
  display: inline-grid;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  isolation: isolate;
}
.hero-logo-stage::before {
  content: "";
  position: absolute;
  inset: 7%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(229,189,87,.14), transparent 66%);
  filter: blur(12px);
  opacity: .75;
  z-index: -1;
}
.hero-logo-stage::after {
  content: "";
  position: absolute;
  top: -18%;
  bottom: -18%;
  left: -42%;
  width: 18%;
  transform: skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255,247,214,.76), transparent);
  filter: blur(4px);
  opacity: 0;
  pointer-events: none;
}
.hero-logo-stage .main-logo {
  display: block;
  filter: drop-shadow(0 18px 30px rgba(0,0,0,.52)) drop-shadow(0 0 18px rgba(229,189,87,.16));
}

/* الحالة الأولى: لا نخفي الصفحة، فقط نهيّئ عناصر الـHero */
html.nile-hero-intro-pending .hero-cinematic-media img {
  transform: scale(1.075);
  filter: saturate(.86) contrast(1.02) brightness(.53) blur(1.2px);
}
html.nile-hero-intro-pending .hero-overlay {
  background:
    linear-gradient(180deg, rgba(2,7,13,.70) 0%, rgba(2,7,13,.58) 45%, rgba(2,7,13,.92) 100%),
    radial-gradient(circle at 50% 38%, rgba(229,189,87,.04), transparent 24rem);
}
html.nile-hero-intro-pending .hero-logo-stage,
html.nile-hero-intro-pending .hero h1,
html.nile-hero-intro-pending .hero-subtitle,
html.nile-hero-intro-pending .hero-ornament,
html.nile-hero-intro-pending .primary-actions .feature-card {
  opacity: 0;
}
html.nile-hero-intro-pending .hero-logo-stage {
  transform: translateY(20px) scale(.93);
  filter: blur(2px);
}
html.nile-hero-intro-pending .hero h1,
html.nile-hero-intro-pending .hero-subtitle,
html.nile-hero-intro-pending .hero-ornament {
  transform: translateY(18px);
}
html.nile-hero-intro-pending .primary-actions .feature-card {
  transform: translateY(24px) scale(.985);
}

html.nile-hero-intro-pending.nile-hero-intro-play .hero-cinematic-media img {
  animation: nileHeroImageReveal 1.72s cubic-bezier(.16,.84,.24,1) forwards;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero-overlay {
  animation: nileHeroOverlayReveal 1.62s cubic-bezier(.2,.8,.2,1) forwards;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero-cinematic-light {
  animation: nileHeroLightLayer 1.4s ease-out .2s forwards;
}
html.nile-hero-intro-pending.nile-hero-intro-play .hero-cinematic-light::before {
  animation: nileHeroLightSweep 1.35s cubic-bezier(.2,.8,.3,1) .28s forwards;
}

@keyframes nileHeroImageReveal {
  from { transform: scale(1.075); filter: saturate(.86) contrast(1.02) brightness(.53) blur(1.2px); }
  to { transform: scale(1.015); filter: saturate(1.02) contrast(1.03) brightness(.88) blur(0); }
}
@keyframes nileHeroOverlayReveal {
  from { opacity: 1; }
  to { opacity: 1; background: linear-gradient(180deg, rgba(2,8,15,.26) 0%, rgba(3,10,18,.18) 30%, rgba(3,10,18,.58) 64%, rgba(2,7,13,.92) 100%), radial-gradient(circle at 50% 38%, rgba(229,189,87,.10), transparent 28rem); }
}
@keyframes nileHeroLightLayer { from { opacity: 0; } 18% { opacity: 1; } to { opacity: 0; } }
@keyframes nileHeroLightSweep { from { left: -32%; } to { left: 118%; } }
@keyframes nileHeroLogoReveal {
  from { opacity: 0; transform: translateY(20px) scale(.93); filter: blur(2px); }
  to { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}
@keyframes nileHeroLogoGlint {
  0% { left: -42%; opacity: 0; }
  22% { opacity: .78; }
  100% { left: 124%; opacity: 0; }
}
@keyframes nileHeroTextReveal {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes nileHeroCardReveal {
  from { opacity: 0; transform: translateY(24px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 920px) {
  .hero-cinematic-media img { object-position: 50% 46%; }
  .hero-logo-stage .main-logo { width: min(240px, 66vw) !important; }
}
@media (max-width: 520px) {
  .hero-cinematic-media img { object-position: 52% 46%; }
  html.nile-hero-intro-pending.nile-hero-intro-play .hero-cinematic-media img {
    animation-duration: 1.35s;
  }
  .hero-cinematic-light::before { width: 34%; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-cinematic-media img,
  .hero-logo-stage,
  .hero h1,
  .hero-subtitle,
  .hero-ornament,
  .primary-actions .feature-card {
    animation: none !important;
    transition: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
  .hero-cinematic-light { display: none !important; }
}

/* T67 — شلال سينمائي ثابت للـHero بأعلى جودة عملية. */
.hero.hero-photo.hero-video-mode {
  background-image: url('assets/video/alnil-waterfall-hero-poster-desktop.jpg') !important;
  background-position: center center !important;
  background-size: cover !important;
}
.hero-video-mode .hero-cinematic-media {
  background: #020813 url('assets/video/alnil-waterfall-hero-poster-desktop.jpg') center center / cover no-repeat;
}
.hero-video-mode .hero-cinematic-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 50% 43%, transparent 28%, rgba(1,5,10,.10) 72%, rgba(1,5,10,.34) 100%),
    linear-gradient(90deg, rgba(1,6,12,.16), transparent 18%, transparent 82%, rgba(1,6,12,.16));
}
.hero-waterfall-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  opacity: 0;
  transform: none !important;
  filter: saturate(1.04) contrast(1.04) brightness(.92);
  transition: opacity .8s ease;
  will-change: opacity;
}
.hero-waterfall-video.is-ready {
  opacity: 1;
}
.hero-video-mode .hero-overlay {
  background:
    linear-gradient(180deg,
      rgba(2,7,13,.28) 0%,
      rgba(2,7,13,.10) 26%,
      rgba(2,8,15,.20) 54%,
      rgba(2,7,13,.70) 78%,
      rgba(2,6,12,.92) 100%),
    radial-gradient(circle at 50% 38%, rgba(229,189,87,.08), transparent 30rem) !important;
}
.hero-video-mode .hero-stars {
  display: none !important;
}
/* لا نحرّك المشهد نفسه في افتتاحية الصفحة؛ الحركة تبقى في الماء فقط. */
html.nile-hero-intro-pending .hero-video-mode .hero-waterfall-video,
html.nile-hero-intro-pending.nile-hero-intro-play .hero-video-mode .hero-waterfall-video {
  transform: none !important;
  filter: saturate(1.04) contrast(1.04) brightness(.92) !important;
  animation: none !important;
}
@media (max-width: 720px) {
  .hero.hero-photo.hero-video-mode,
  .hero-video-mode .hero-cinematic-media {
    background-image: url('assets/video/alnil-waterfall-hero-mobile-t75-poster.jpg') !important;
    background-position: center center !important;
  }
  .hero-waterfall-video {
    object-position: 50% 50%;
    filter: saturate(1.05) contrast(1.05) brightness(.90);
  }
  .hero-video-mode .hero-overlay {
    background:
      linear-gradient(180deg,
        rgba(2,7,13,.24) 0%,
        rgba(2,7,13,.08) 24%,
        rgba(2,8,15,.24) 52%,
        rgba(2,7,13,.74) 76%,
        rgba(2,6,12,.94) 100%),
      radial-gradient(circle at 50% 38%, rgba(229,189,87,.08), transparent 22rem) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .hero-waterfall-video {
    transition: none !important;
  }
}