/**
 * Emma Sinclair — Refined Animation CSS
 * ─────────────────────────────────────────
 * Enhancement only — no layout, colors, typography or structure changed.
 * These styles add micro-interactions and transition polish on top of
 * the existing style.css without overriding any visual design decisions.
 */

/* ── Performance baseline ──────────────────────────────────────────── */
.hero__bg,
.page-hero__bg,
.gph__img {
  will-change: transform;
}

/* ── Nav — frosted glass on scroll ────────────────────────────────── */
.site-nav.is-scrolled {
  backdrop-filter: blur(12px) saturate(1.4);
  -webkit-backdrop-filter: blur(12px) saturate(1.4);
}

/* ── Nav links — refined underline ────────────────────────────────── */
.nav-links a::after {
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
              opacity 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── Buttons — refined hover lift ─────────────────────────────────── */
.btn {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1),
              background 0.25s ease,
              border-color 0.25s ease,
              color 0.25s ease;
}

.btn--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.14);
}

.btn--outline-white:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
}

/* ── Images — hover effects removed per request ──────────────────── */

/* ── Gallery pile — magnetic feel ─────────────────────────────────── */
#ssPW {
  transform-style: preserve-3d;
  perspective: 800px;
  transition: filter 0.4s ease;
}

#ssPile {
  cursor: pointer;
  transition: filter 0.35s ease;
}

#ssPile:hover {
  filter: brightness(1.04);
}

/* Gallery masonry cards — refined hover ──────────────────────────── */
.ss-print {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.4s ease !important;
}

.ss-print.is-dealt:hover {
  transform: rotate(0deg) translateY(-6px) scale(1.02) !important;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.22) !important;
  filter: brightness(1.05);
  z-index: 100 !important;
}

/* Gallery caption — refined reveal ───────────────────────────────── */
.ss-cap {
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ── Rate cards — refined hover ────────────────────────────────────── */
.rate-card,
.rates-card,
[class*="rate-card"] {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.rate-card:hover,
.rates-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.10);
}

/* ── Testimonials — refined ────────────────────────────────────────── */
.pc-card {
  transition: transform 1.1s cubic-bezier(0.16, 1, 0.3, 1),
              opacity  1.1s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 1.1s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Only lift the active card on hover — never override prev/next/far positioning */
.pc-card[data-state="active"]:hover {
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.10) !important;
}

/* ── Footer flight lane ─────────────────────────────────────────────── */
.footer-flight-lane {
  transform-origin: left center;
}

/* ── Scroll progress — refined gradient ────────────────────────────── */
#scroll-progress {
  background: linear-gradient(
    90deg,
    rgba(180, 195, 220, 0.3) 0%,
    rgba(201, 169, 110, 0.75) 100%
  ) !important;
  height: 1px !important;
  transition: none !important;
}

/* ── Page transition overlay ────────────────────────────────────────── */
.pt-overlay {
  transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* ── Cursor glow ─────────────────────────────────────────────────────── */
#cursor-glow {
  pointer-events: none;
  mix-blend-mode: screen;
}

/* ── Link hover — refined ───────────────────────────────────────────── */
.footer-nav__links a,
.footer-nav__links--light a {
  transition: color 0.3s cubic-bezier(0.16, 1, 0.3, 1),
              letter-spacing 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* ── Instagram posts — refined hover ───────────────────────────────── */
.instagram-post {
  transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1),
              filter 0.55s ease !important;
  overflow: hidden;
}

.instagram-post:hover {
  transform: scale(1.03) translateY(-4px) !important;
  filter: brightness(1.06) !important;
}

.instagram-post img {
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.instagram-post:hover img {
  transform: scale(1.05) !important;
}

/* ── Reduced motion override ────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .btn,
  .ss-print,
  .rate-card,
  .rates-card,
  .pc-card,
  .instagram-post,
  .about-intro__photo,
  .travel-intro__photo,
  .sticky-photo img {
    transition: none !important;
    transform: none !important;
    filter: none !important;
  }

  #cursor-glow {
    display: none;
  }
}
