/* —— Вариант A: Тихий люкс —— */

/* Hero: медленный zoom фото (только ПК) */
@keyframes luxury-hero-zoom {
  from { transform: scale(1); }
  to { transform: scale(1.04); }
}

@keyframes luxury-fade-up {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes luxury-btn-shine {
  from { transform: translateX(-120%); }
  to { transform: translateX(120%); }
}

/* Появление при скролле */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity 0.55s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
  transition-delay: calc(var(--reveal-i, 0) * 80ms);
}

.reveal-on-scroll.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

/* Шапка при скролле — только тень, без смены высоты */
.site-header {
  transition: box-shadow 0.25s ease;
}

.site-header.is-scrolled {
  box-shadow: 0 4px 22px rgba(26, 43, 60, 0.11);
}

/* Кнопки: блик и отклик на нажатие */
.btn {
  position: relative;
  overflow: hidden;
  transition: background 0.2s, transform 0.12s ease;
}

.btn::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    transparent 38%,
    rgba(255, 255, 255, 0.32) 50%,
    transparent 62%
  );
  transform: translateX(-120%);
  pointer-events: none;
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .btn:hover::after {
    animation: luxury-btn-shine 0.7s ease;
  }
}

.btn:active {
  transform: scale(0.98);
}

/* Мобильное меню: плавнее затемнение */
.mobile-nav-backdrop {
  transition: opacity 0.25s ease;
}

/* Hero: каскад появления текста */
@media (prefers-reduced-motion: no-preference) {
  .hero-brand .site-emblem--hero,
  .hero-brand .hero-title,
  .hero-brand .hero-sub,
  .hero-brand .ornament,
  .hero-features li,
  .hero-copy .hero-title,
  .hero-stars-row,
  .hero-tagline,
  .hero-copy .hero-sub,
  .hero-copy .btn-hero-outline,
  .hero-copy .hero-cta,
  .hero-copy-anchor .hero-cta,
  .hero-note,
  .hero-note__caption {
    opacity: 0;
    animation: luxury-fade-up 0.65s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }

  .hero-title-layer .hero-title {
    opacity: 0;
    animation: luxury-fade-in 0.75s cubic-bezier(0.22, 1, 0.36, 1) forwards;
    transform: none;
  }

  .hero-brand .site-emblem--hero { animation-delay: 0.1s; }
  .hero-brand .hero-title { animation-delay: 0.2s; }
  .hero-brand .hero-sub { animation-delay: 0.28s; }
  .hero-brand .ornament { animation-delay: 0.36s; }
  .hero-copy .hero-title { animation-delay: 0.15s; }
  .hero-stars-row { animation-delay: 0.22s; }
  .hero-copy .hero-sub,
  .hero-tagline { animation-delay: 0.28s; }
  .hero-copy .hero-cta,
  .hero-copy-anchor .hero-cta { animation-delay: 0.42s; }
  .hero-title-layer .hero-title { animation-delay: 0.12s; }
  .hero-note,
  .hero-note__caption { animation-delay: 0.55s; }
  .hero-features li:nth-child(1) { animation-delay: 0.44s; }
  .hero-features li:nth-child(2) { animation-delay: 0.52s; }
  .hero-features li:nth-child(3) { animation-delay: 0.6s; }

  @media (min-width: 901px) {
    .hero-media img,
    .hero-bg img {
      animation: luxury-hero-zoom 10s ease-out forwards;
      will-change: transform;
    }
  }

  @media (max-width: 900px) {
    .hero-copy .hero-title,
    .hero-stars-row,
    .hero-tagline,
    .hero-copy .hero-sub,
    .hero-copy .btn-hero-outline,
    .hero-copy .hero-cta,
    .hero-copy-anchor .hero-cta,
    .hero-title-layer .hero-title,
    .hero-note,
    .hero-note__caption {
      animation: luxury-fade-in 0.55s cubic-bezier(0.22, 1, 0.36, 1) forwards;
      transform: none;
    }

    .hero-copy .hero-title { animation-delay: 0.05s; }
    .hero-stars-row { animation-delay: 0.1s; }
    .hero-copy .hero-sub,
    .hero-tagline { animation-delay: 0.12s; }
    .hero-copy .btn-hero-outline,
    .hero-copy .hero-cta,
    .hero-copy-anchor .hero-cta { animation-delay: 0.2s; }
    .hero-title-layer .hero-title { animation-delay: 0.08s; }
    .hero-note,
    .hero-note__caption { animation-delay: 0.22s; }
  }
}

@keyframes luxury-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Мобильные карточки номеров: акцент у центра */
@media (max-width: 900px) and (prefers-reduced-motion: no-preference) {
  .rooms-track .room-card {
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
    transform: scale(0.98);
  }

  .rooms-track .room-card.is-active-card {
    transform: scale(1.02);
  }
}

/* Отключение анимаций */
@media (prefers-reduced-motion: reduce) {
  .reveal-on-scroll {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .hero-media img,
  .hero-bg img,
  .hero-brand .site-emblem--hero,
  .hero-brand .hero-title,
  .hero-brand .hero-sub,
  .hero-brand .ornament,
  .hero-features li,
  .hero-copy .hero-title,
  .hero-stars-row,
  .hero-tagline,
  .hero-copy .hero-sub,
  .hero-copy .btn-hero-outline,
  .hero-copy .hero-cta,
  .hero-copy-anchor .hero-cta,
  .hero-title-layer .hero-title,
  .hero-note,
  .hero-note__caption {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .btn::after {
    display: none;
  }

  .btn:active {
    transform: none;
  }

  .rooms-track .room-card {
    transform: none;
  }

  .hero-scale {
    transform: none !important;
  }

  .site-header {
    transition: none;
  }
}
