/* ============================================================
   ZETERO — animations.css
   AOS overrides + keyframes + micro-interactions
   ============================================================ */

/* ── AOS custom overrides ───────────────────────────────────── */
[data-aos] { pointer-events: none; }
[data-aos].aos-animate { pointer-events: auto; }

[data-aos="fade-up"] {
  transform: translateY(40px);
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos="fade-up"].aos-animate {
  transform: translateY(0);
  opacity: 1;
}
[data-aos="fade-right"] {
  transform: translateX(-40px);
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos="fade-right"].aos-animate {
  transform: translateX(0);
  opacity: 1;
}
[data-aos="fade-left"] {
  transform: translateX(40px);
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos="fade-left"].aos-animate {
  transform: translateX(0);
  opacity: 1;
}
[data-aos="zoom-in"] {
  transform: scale(.94);
  opacity: 0;
  transition-property: opacity, transform;
}
[data-aos="zoom-in"].aos-animate {
  transform: scale(1);
  opacity: 1;
}

/* ── Reveal line animation ──────────────────────────────────── */
.reveal-line {
  overflow: hidden;
}
.reveal-line-inner {
  display: block;
  transform: translateY(105%);
  transition: transform .9s var(--ease-silk);
}
.reveal-line.revealed .reveal-line-inner {
  transform: translateY(0);
}

/* ── Gold shimmer on hover ──────────────────────────────────── */
.shimmer-hover {
  position: relative;
  overflow: hidden;
}
.shimmer-hover::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%; height: 100%;
  background: linear-gradient(
    120deg,
    transparent 0%,
    rgba(201,169,110,.12) 50%,
    transparent 100%
  );
  transition: left .6s var(--ease-silk);
}
.shimmer-hover:hover::after { left: 160%; }

/* ── Count-up numbers ───────────────────────────────────────── */
.stat-number {
  font-family: var(--ff-heading);
  font-size: clamp(3rem, 6vw, 5rem);
  color: var(--col-white);
  line-height: 1;
}
.stat-label {
  font-size: .75rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--col-muted);
  margin-top: .5rem;
}

/* ── Parallax image container ───────────────────────────────── */
.parallax-wrap {
  overflow: hidden;
  position: relative;
}
.parallax-wrap img {
  will-change: transform;
  transform: translateY(0);
}

/* ── Cursor dot (desktop only) ──────────────────────────────── */
@media (hover: hover) {
  .cursor-dot {
    position: fixed;
    width: 8px; height: 8px;
    background: var(--col-gold);
    border-radius: 50%;
    pointer-events: none;
    z-index: 10000;
    transform: translate(-50%, -50%);
    transition: transform .08s linear, opacity .3s;
    mix-blend-mode: difference;
  }
  .cursor-ring {
    position: fixed;
    width: 36px; height: 36px;
    border: 1px solid rgba(201,169,110,.5);
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: transform .18s var(--ease-silk), width .3s, height .3s, opacity .3s;
  }
  .cursor-ring.expanded {
    width: 60px; height: 60px;
    border-color: var(--col-gold);
  }
}

/* ── Page transition ────────────────────────────────────────── */
.page-transition {
  position: fixed; inset: 0;
  background: var(--col-gold);
  z-index: 9990;
  transform: scaleY(0);
  transform-origin: bottom;
}
.page-transition.entering {
  animation: pageIn .5s var(--ease-silk) forwards;
}
.page-transition.leaving {
  transform-origin: top;
  animation: pageOut .5s .2s var(--ease-silk) forwards;
}
@keyframes pageIn {
  from { transform: scaleY(0); }
  to   { transform: scaleY(1); }
}
@keyframes pageOut {
  from { transform: scaleY(1); }
  to   { transform: scaleY(0); }
}

/* ── Floating coffee particle (decorative) ──────────────────── */
.decor-circle {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(201,169,110,.12);
  pointer-events: none;
  animation: rotateSlow 30s linear infinite;
}
@keyframes rotateSlow {
  to { transform: rotate(360deg); }
}

/* ── Input focus ring ───────────────────────────────────────── */
.form-group input:focus,
.form-group textarea:focus {
  box-shadow: 0 0 0 3px rgba(201,169,110,.08);
}

/* ── Swiper pagination dots ─────────────────────────────────── */
.swiper-pagination-bullet {
  background: var(--col-muted) !important;
  opacity: 1 !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 0 !important;
  transition: background .3s, width .3s !important;
}
.swiper-pagination-bullet-active {
  background: var(--col-gold) !important;
  width: 20px !important;
}
