/* ============================================================
   EVARA MOTION SYSTEM, Pass 20
   One motion per moment. Restraint is the brand signal.
   ============================================================ */

/* --- Scroll Reveal (base) --- */
.reveal {
  opacity: 1;
  transform: none;
}
.reveal.is-visible {
  opacity: 1;
  transform: none;
}


/* Stagger children */
.reveal-stagger > * {
  opacity: 1;
  transform: none;
}
.reveal-stagger.is-visible > * {
  opacity: 1;
  transform: none;
}
.reveal-stagger.is-visible > *:nth-child(1) { transition-delay: 0s; }
.reveal-stagger.is-visible > *:nth-child(2) { transition-delay: 0.06s; }
.reveal-stagger.is-visible > *:nth-child(3) { transition-delay: 0.12s; }
.reveal-stagger.is-visible > *:nth-child(4) { transition-delay: 0.18s; }
.reveal-stagger.is-visible > *:nth-child(5) { transition-delay: 0.24s; }
.reveal-stagger.is-visible > *:nth-child(6) { transition-delay: 0.30s; }
.reveal-stagger.is-visible > *:nth-child(7) { transition-delay: 0.36s; }
.reveal-stagger.is-visible > *:nth-child(8) { transition-delay: 0.42s; }
.reveal-stagger.is-visible > *:nth-child(9) { transition-delay: 0.48s; }
.reveal-stagger.is-visible > *:nth-child(10) { transition-delay: 0.54s; }
.reveal-stagger.is-visible > *:nth-child(11) { transition-delay: 0.60s; }
.reveal-stagger.is-visible > *:nth-child(12) { transition-delay: 0.66s; }

/* Fade in (no movement) */
.fade-in {
  opacity: 1;
}
.fade-in.is-visible {
  opacity: 1;
}

/* Slide up */
.slide-up {
  opacity: 1;
  transform: none;
}
.slide-up.is-visible {
  opacity: 1;
  transform: none;
}

/* Scale in (for CTAs, celebration) */
.scale-in {
  opacity: 1;
  transform: none;
}
.scale-in.is-visible {
  opacity: 1;
  transform: none;
}

/* --- Card hover polish --- */
.card-lift {
  transition: transform var(--dur-base, 320ms) cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow var(--dur-base, 320ms) cubic-bezier(0.16, 1, 0.3, 1);
}
.card-lift:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg, 0 12px 32px rgba(20, 16, 12, 0.55));
}

/* --- Button hover polish --- */
.btn-press:active {
  transform: scale(0.97);
}

/* --- Image hover zoom (apply to container with overflow:hidden) --- */
.img-hover-zoom {
  overflow: hidden;
}
.img-hover-zoom img,
.img-hover-zoom .img-inner {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.img-hover-zoom:hover img,
.img-hover-zoom:hover .img-inner {
  transform: scale(1.05);
}

/* --- Reading progress bar --- */
.reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 0;
  background: var(--gold, #C9A96E);
  z-index: 2001;
  transition: none;
  pointer-events: none;
}

/* --- Nav scroll states --- */
nav {
  transition: padding 0.32s cubic-bezier(0.16, 1, 0.3, 1),
              background 0.32s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.32s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}

/* --- Mobile menu stagger --- */
.mm-stagger > * {
  opacity: 0;
  transform: translateX(24px);
  transition: opacity 0.32s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}
.mm-stagger.active > * {
  opacity: 1;
  transform: none;
}
.mm-stagger.active > *:nth-child(1) { transition-delay: 0.05s; }
.mm-stagger.active > *:nth-child(2) { transition-delay: 0.10s; }
.mm-stagger.active > *:nth-child(3) { transition-delay: 0.12s; }
.mm-stagger.active > *:nth-child(4) { transition-delay: 0.14s; }
.mm-stagger.active > *:nth-child(5) { transition-delay: 0.16s; }
.mm-stagger.active > *:nth-child(6) { transition-delay: 0.18s; }
.mm-stagger.active > *:nth-child(7) { transition-delay: 0.20s; }
.mm-stagger.active > *:nth-child(8) { transition-delay: 0.22s; }
.mm-stagger.active > *:nth-child(9) { transition-delay: 0.24s; }
.mm-stagger.active > *:nth-child(10) { transition-delay: 0.26s; }

/* --- Floating label form inputs --- */
.form-group-float {
  position: relative;
}
.form-group-float label {
  position: absolute;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
  color: var(--muted, #7A7088);
  pointer-events: none;
  transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  background: transparent;
  padding: 0 4px;
}
.form-group-float textarea ~ label {
  top: 18px;
  transform: none;
}
.form-group-float input:focus ~ label,
.form-group-float input:not(:placeholder-shown) ~ label,
.form-group-float select:focus ~ label,
.form-group-float select:valid ~ label,
.form-group-float textarea:focus ~ label,
.form-group-float textarea:not(:placeholder-shown) ~ label {
  top: -8px;
  transform: none;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--am-ll, #B08FCC);
  background: var(--d2, #0F0C15);
}

/* --- Form submit loading spinner --- */
.fsub .spinner {
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  border-top-color: #fff;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* --- Footer polish --- */
.footer-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--brdp, rgba(61,26,92,0.35)), transparent);
  margin-bottom: 0;
}

/* Footer link hover underline */
.ftl a {
  position: relative;
}

/* --- Cookie banner entrance refinement --- */
.cookie-banner-enter {
  transform: translateY(100%);
  opacity: 0;
  transition: transform 0.48s cubic-bezier(0.16, 1, 0.3, 1),
              opacity 0.48s cubic-bezier(0.16, 1, 0.3, 1);
}
.cookie-banner-enter.visible {
  transform: none;
  opacity: 1;
}

/* --- Tier card hover glow --- */
.pkg:hover,
.pkg2:hover {
  box-shadow: 0 0 0 1px var(--am-l, #7B4FA6), var(--shadow-md, 0 4px 12px rgba(20, 16, 12, 0.5));
}
.pkg.feat:hover,
.pkg2.feat:hover {
  box-shadow: 0 0 0 1px var(--gold, #C9A96E), 0 8px 24px rgba(201, 169, 110, 0.15);
}

/* --- Tier inclusion list stagger --- */
.pfeats.is-visible li {
  opacity: 1;
  transform: none;
}

/* --- Grid card image zoom on hover --- */
.gc .story-img,
.gc .ss-img,
.story .story-img {
  transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), filter 0.5s ease;
}
.gc:hover .story-img,
.gc:hover .ss-img,
.story:hover .story-img {
  transform: scale(1.05);
}

/* --- Image blur-up placeholder --- */
.img-blur-up {
  filter: blur(12px);
  transform: scale(1.05);
  transition: filter 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.img-blur-up.loaded {
  filter: blur(0);
  transform: scale(1);
}

/* --- Image placeholder bg --- */
img[loading="lazy"] {
  background: var(--d3, #16121F);
}

/* --- Smooth image fade-in on load --- */
.img-fade {
  opacity: 0;
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.img-fade.loaded {
  opacity: 1;
}

/* --- Blog pull quote styling --- */
article blockquote,
.pull-quote {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px;
  font-style: italic;
  color: var(--body, #BFB5CE);
  line-height: 1.65;
  padding: 24px 0 24px 24px;
  border-left: 3px solid var(--gold, #C9A96E);
  margin: 32px 0;
}

/* --- Dropdown smooth expand --- */
.ddm {
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

/* --- Social icon hover --- */
.social-icon {
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.social-icon:hover {
  transform: scale(1.1);
}

/* === V2: Hero parallax layer, will-change removed (caused full-viewport compositing layer on iOS) === */
.hero-parallax {
  transition: none;
}

/* === V2: Reveal from left/right for editorial storytelling === */
.reveal-left {
  opacity: 1;
  transform: none;
}
.reveal-left.is-visible {
  opacity: 1;
  transform: none;
}
.reveal-right {
  opacity: 1;
  transform: none;
}
.reveal-right.is-visible {
  opacity: 1;
  transform: none;
}

/* === V2: Gold line draw animation (section dividers) === */
.line-draw {
  width: min(200px, 40vw);
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold, #C9A96E), transparent);
  margin: 0 auto;
  transform-origin: left center;
}
.line-draw.is-visible {
  width: min(200px, 40vw);
}

/* === V2: Shimmer on gold buttons (subtle) === */
@keyframes btn-shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}
.bg.shimmer-once {
  background-image: linear-gradient(
    110deg,
    var(--gold, #C9A96E) 0%,
    var(--gold, #C9A96E) 40%,
    var(--gold-l, #E2C99A) 50%,
    var(--gold, #C9A96E) 60%,
    var(--gold, #C9A96E) 100%
  );
  background-size: 200% 100%;
  animation: btn-shimmer 2s ease-in-out 2s 1 both;
}

/* === V2: Number glow pulse for live stats === */
@keyframes stat-glow {
  0%, 100% { text-shadow: 0 0 20px rgba(201,169,110,0.08); }
  50% { text-shadow: 0 0 30px rgba(201,169,110,0.2); }
}
.stat-num[data-n],
.snum[data-count] {
  animation: stat-glow 4s ease-in-out infinite;
}

/* === V2: Testimonial card hover, inner glow === */
@media (hover: hover) {
  .tc:hover,
  .testimonial-card:hover {
    box-shadow: inset 0 1px 0 rgba(201,169,110,0.12),
                0 8px 32px rgba(7,5,10,0.4);
  }
}

/* === V2: Footer link underline draw === */
.ftl a::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--am-ll, #B08FCC);
  transition: width 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.ftl a:hover::after {
  width: 100%;
}

/* --- Reduced motion overrides --- */
@media (prefers-reduced-motion: reduce) {
  .reveal, .fade-in, .slide-up, .scale-in,
  .reveal-left, .reveal-right,
  .reveal-stagger > *,
  .mm-stagger > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  .card-lift:hover {
    transform: none !important;
  }
  .img-hover-zoom:hover img,
  .img-hover-zoom:hover .img-inner {
    transform: none !important;
  }
  .hero-parallax {
    transform: none !important;
  }
  .line-draw {
    width: min(200px, 40vw) !important;
    transition: none !important;
  }
  .bg.shimmer-once {
    animation: none !important;
  }
  .stat-num[data-n],
  .snum[data-count] {
    animation: none !important;
  }
}