/* =============================================
   ANIMATIONS & LUXURY SCROLL EFFECTS — v4.1
   ============================================= */

/* Above-The-Fold / Hero content is visible immediately */
.sample-hero .fade-up,
.sample-hero .fade-in,
.sample-hero .slide-right,
.sample-hero .slide-left,
.page-hero .fade-up,
.page-hero .fade-in {
  opacity: 1 !important;
  transform: none !important;
}

/* ---- Fade Up (Signature Reveal) ---- */
.fade-up {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.fade-up.visible {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* ---- Fade In ---- */
.fade-in {
  opacity: 0;
  transition: opacity 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: opacity;
}
.fade-in.visible {
  opacity: 1 !important;
}

/* ---- Slide Right ---- */
.slide-right {
  opacity: 0;
  transform: translateX(-32px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.slide-right.visible {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* ---- Slide Left ---- */
.slide-left {
  opacity: 0;
  transform: translateX(32px);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.slide-left.visible {
  opacity: 1 !important;
  transform: translateX(0) !important;
}

/* ---- Scale Up ---- */
.scale-up {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}
.scale-up.visible {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* ---- Zoom In ---- */
.zoom-in {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}
.zoom-in.visible {
  opacity: 1 !important;
  transform: scale(1) !important;
}

/* ---- Curtain Reveal (Clip Path) ---- */
.curtain-reveal {
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1.1s cubic-bezier(0.77, 0, 0.175, 1);
}
.curtain-reveal.visible {
  clip-path: inset(0 0 0% 0) !important;
}

/* ---- Stagger Children in Grids ---- */
.stagger-children > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.65s cubic-bezier(0.16, 1, 0.3, 1), transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}
.stagger-children.visible > *:nth-child(1) { transition-delay: 0.04s; }
.stagger-children.visible > *:nth-child(2) { transition-delay: 0.12s; }
.stagger-children.visible > *:nth-child(3) { transition-delay: 0.20s; }
.stagger-children.visible > *:nth-child(4) { transition-delay: 0.28s; }
.stagger-children.visible > *:nth-child(5) { transition-delay: 0.36s; }
.stagger-children.visible > *:nth-child(6) { transition-delay: 0.44s; }
.stagger-children.visible > *:nth-child(n+7) { transition-delay: 0.52s; }
.stagger-children.visible > * {
  opacity: 1;
  transform: none;
}

/* ---- Animated Reveal Line ---- */
.reveal-line {
  display: block;
  height: 1px;
  background: var(--olive-border);
  width: 0;
  transition: width 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal-line.visible {
  width: 100% !important;
}

/* ---- Floating Gentle Pulse / Shimmer ---- */
@keyframes floatSubtle {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-4px); }
}
.float-hover:hover {
  animation: floatSubtle 3s ease-in-out infinite;
}

@keyframes goldShimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.shimmer-badge {
  background: linear-gradient(90deg, rgba(100,96,58,0.12) 0%, rgba(132,127,82,0.3) 50%, rgba(100,96,58,0.12) 100%);
  background-size: 200% 100%;
  animation: goldShimmer 4s ease-in-out infinite;
}

/* ---- Explicit Delays ---- */
.delay-100 { transition-delay: 0.1s !important; }
.delay-150 { transition-delay: 0.15s !important; }
.delay-200 { transition-delay: 0.2s !important; }
.delay-250 { transition-delay: 0.25s !important; }
.delay-300 { transition-delay: 0.3s !important; }
.delay-400 { transition-delay: 0.4s !important; }
.delay-500 { transition-delay: 0.5s !important; }