/* ======================================================
   VITAL VIBES — animations.css v4.0
   All animation systems · IntersectionObserver driven
   ====================================================== */

@keyframes heroFadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(50px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes fadeLeft {
  from { opacity: 0; transform: translateX(-50px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes fadeRight {
  from { opacity: 0; transform: translateX(50px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.9); }
  to   { opacity: 1; transform: scale(1); }
}
@keyframes scrollLine {
  0%   { top: -100%; }
  100% { top: 100%; }
}
@keyframes pulseRing {
  0%   { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(1.5); opacity: 0; }
}
@keyframes rippleAnim {
  to { transform: scale(4); opacity: 0; }
}
@keyframes lineGrow {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes floatIn {
  from { opacity: 0; transform: translateX(40px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ── Scroll Reveal ── */
.anim-fade-up {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 1.2s cubic-bezier(0.16,1,0.3,1),
              transform 1.2s cubic-bezier(0.16,1,0.3,1);
}
.anim-fade-left {
  opacity: 0;
  transform: translateX(-50px);
  transition: opacity 1.2s cubic-bezier(0.16,1,0.3,1),
              transform 1.2s cubic-bezier(0.16,1,0.3,1);
}
.anim-fade-right {
  opacity: 0;
  transform: translateX(50px);
  transition: opacity 1.2s cubic-bezier(0.16,1,0.3,1),
              transform 1.2s cubic-bezier(0.16,1,0.3,1);
}
.anim-scale-in {
  opacity: 0;
  transform: scale(0.92);
  transition: opacity 1s cubic-bezier(0.16,1,0.3,1),
              transform 1s cubic-bezier(0.16,1,0.3,1);
}
.anim-fade-up.is-visible,
.anim-fade-left.is-visible,
.anim-fade-right.is-visible,
.anim-scale-in.is-visible { opacity: 1; transform: none; }

[data-delay="1"] { transition-delay: 0.05s; }
[data-delay="2"] { transition-delay: 0.15s; }
[data-delay="3"] { transition-delay: 0.25s; }
[data-delay="4"] { transition-delay: 0.35s; }
[data-delay="5"] { transition-delay: 0.45s; }
[data-delay="6"] { transition-delay: 0.55s; }

/* ── Image Reveal ── */
.img-reveal-wrap { position: relative; overflow: hidden; }
.img-reveal-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--surface-alt, #EBE4D8);
  transform: scaleX(1);
  transform-origin: left;
  transition: transform 1.5s cubic-bezier(0.77,0,0.175,1);
  z-index: 1;
}
.img-reveal-wrap.is-visible::after { transform: scaleX(0); transform-origin: right; }

/* ── Section Rule ── */
.section-rule {
  transform-origin: left;
  transform: scaleX(0);
  transition: transform .8s cubic-bezier(0.16,1,0.3,1);
}
.section-rule.is-visible { transform: scaleX(1); }

/* ── Heading Line ── */
.heading-line { position: relative; display: inline-block; }
.heading-line::after {
  content: '';
  position: absolute;
  bottom: -6px; left: 0;
  width: 0; height: 1px;
  background: var(--gold, #D4A84B);
  transition: width 1s .3s cubic-bezier(0.16,1,0.3,1);
}
.heading-line.is-visible::after { width: 100%; }

/* ── Link underline draw ── */
.link-draw { position: relative; }
.link-draw::after {
  content: '';
  position: absolute;
  bottom: -2px; left: 0;
  width: 0; height: 1px;
  background: currentColor;
  transition: width .4s cubic-bezier(0.16,1,0.3,1);
}
.link-draw:hover::after { width: 100%; }

/* ── Icon pop ── */
.icon-pop { display: inline-block; transition: transform .3s cubic-bezier(0.175,0.885,0.32,1.275); }
.icon-pop:hover { transform: scale(1.2); }

/* ── Float-in ── */
.float-cta { animation: floatIn .6s cubic-bezier(0.16,1,0.3,1) 3s forwards; }

/* ── Spec row ── */
.spec-row { opacity: 0; transform: translateX(-20px); transition: opacity .5s, transform .5s cubic-bezier(0.16,1,0.3,1); }
.spec-row.is-visible { opacity: 1; transform: none; }
.spec-row:nth-child(2) { transition-delay: .1s; }
.spec-row:nth-child(3) { transition-delay: .2s; }
.spec-row:nth-child(4) { transition-delay: .3s; }
.spec-row:nth-child(5) { transition-delay: .4s; }

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .anim-fade-up, .anim-fade-left, .anim-fade-right, .anim-scale-in {
    opacity: 1 !important; transform: none !important; transition: none !important;
  }
  .img-reveal-wrap::after { display: none; }
  .h1-line__inner { transform: translateY(0) !important; }
  .section-rule { transform: scaleX(1); }
  .heading-line::after { width: 100%; }
}
