/* =============================================================
   LODGE MILANO & CO — ANIMATIONS & MICRO-INTERACTIONS
============================================================= */

/* ---- Reveal on Scroll (IntersectionObserver) ---- */
[data-reveal] {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 0.75s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
[data-reveal="left"]  { transform: translateX(-28px); }
[data-reveal="right"] { transform: translateX(28px); }
[data-reveal="scale"] { transform: scale(0.96); }
[data-reveal="fade"]  { transform: none; }

[data-reveal].revealed {
  opacity: 1;
  transform: none;
}

/* Stagger children */
[data-reveal-stagger] > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
[data-reveal-stagger].revealed > *:nth-child(1) { transition-delay: 0.05s; }
[data-reveal-stagger].revealed > *:nth-child(2) { transition-delay: 0.15s; }
[data-reveal-stagger].revealed > *:nth-child(3) { transition-delay: 0.25s; }
[data-reveal-stagger].revealed > *:nth-child(4) { transition-delay: 0.35s; }
[data-reveal-stagger].revealed > *:nth-child(5) { transition-delay: 0.45s; }
[data-reveal-stagger].revealed > *:nth-child(6) { transition-delay: 0.55s; }
[data-reveal-stagger].revealed > *:nth-child(n+7) { transition-delay: 0.65s; }
[data-reveal-stagger].revealed > * { opacity: 1; transform: none; }

/* ---- Page Load Curtain ---- */
.lmc-page-loader {
  position: fixed;
  inset: 0;
  background: var(--white);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.lmc-page-loader.loaded {
  opacity: 0;
  visibility: hidden;
}
.lmc-page-loader__logo {
  font-family: var(--font-display);
  font-size: 1.5rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  animation: loaderPulse 1.5s ease-in-out infinite;
}
@keyframes loaderPulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.35; }
}

/* ---- Hero Text Animation ---- */
.lmc-hero__title .word {
  display: inline-block;
  overflow: hidden;
}
.lmc-hero__title .word span {
  display: inline-block;
  animation: wordReveal 0.9s cubic-bezier(0.77, 0, 0.175, 1) forwards;
  opacity: 0;
}
.lmc-hero__eyebrow { animation: fadeSlideUp 0.8s 0.3s ease forwards; opacity: 0; }
.lmc-hero__title { animation: fadeSlideUp 0.9s 0.5s ease forwards; opacity: 0; }
.lmc-hero__desc  { animation: fadeSlideUp 0.9s 0.75s ease forwards; opacity: 0; }
.lmc-hero__actions { animation: fadeSlideUp 0.9s 0.95s ease forwards; opacity: 0; }

@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes wordReveal {
  from { transform: translateY(100%); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* ---- Cursor Follower ---- */
.lmc-cursor {
  position: fixed;
  width: 8px;
  height: 8px;
  background: var(--black);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transition: transform 0.1s ease, width 0.3s ease, height 0.3s ease, background 0.3s ease;
  transform: translate(-50%, -50%);
  mix-blend-mode: difference;
}
.lmc-cursor-ring {
  position: fixed;
  width: 36px;
  height: 36px;
  border: 1px solid rgba(0,0,0,0.3);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%);
  transition: transform 0.12s ease, width 0.4s ease, height 0.4s ease, border-color 0.3s ease, opacity 0.3s ease;
}
.lmc-cursor.hover  { width: 40px; height: 40px; background: rgba(0,0,0,0.1); }
.lmc-cursor-ring.hover { width: 60px; height: 60px; opacity: 0; }

/* ---- Image Parallax ---- */
.lmc-parallax-img {
  will-change: transform;
}

/* ---- Add to cart / Button loading ---- */
.btn.loading {
  pointer-events: none;
  opacity: 0.7;
}
.btn.loading::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 1.5px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.6s linear infinite;
  margin-left: 0.5rem;
  vertical-align: middle;
}
@keyframes spin {
  to { transform: rotate(360deg); }
}

/* ---- Notification Toast ---- */
.lmc-toast {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  background: var(--black);
  color: var(--white);
  padding: 1rem 1.5rem;
  max-width: 320px;
  font-size: 0.8125rem;
  z-index: 9000;
  transform: translateY(20px);
  opacity: 0;
  transition: all 0.4s ease;
  pointer-events: none;
}
.lmc-toast.show {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
.lmc-toast__title {
  font-size: 0.625rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold-light);
  margin-bottom: 0.25rem;
  font-weight: 600;
}

/* ---- Number counter animation ---- */
.lmc-counter { display: inline-block; }

/* ---- Hover line animation for links ---- */
.lmc-hover-line {
  position: relative;
  display: inline-block;
}
.lmc-hover-line::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: currentColor;
  transition: width 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.lmc-hover-line:hover::after { width: 100%; }

/* ---- Skeleton loader for products ---- */
.lmc-skeleton {
  background: linear-gradient(90deg, var(--light-gray) 25%, var(--off-white) 50%, var(--light-gray) 75%);
  background-size: 200% 100%;
  animation: skeleton 1.5s ease-in-out infinite;
}
@keyframes skeleton {
  from { background-position: 200% 0; }
  to   { background-position: -200% 0; }
}

/* ---- Cart sidebar animation ---- */
.lmc-cart-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 420px;
  max-width: 100vw;
  background: var(--white);
  z-index: 9000;
  transform: translateX(100%);
  transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  display: flex;
  flex-direction: column;
  box-shadow: -5px 0 30px rgba(0,0,0,0.08);
}
.lmc-cart-drawer.open { transform: translateX(0); }
.lmc-cart-drawer__overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 8999;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.lmc-cart-drawer__overlay.open { opacity: 1; visibility: visible; }

/* ---- Search overlay ---- */
.lmc-search-overlay {
  position: fixed;
  inset: 0;
  background: rgba(255,255,255,0.97);
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.lmc-search-overlay.open { opacity: 1; visibility: visible; }
.lmc-search-overlay__inner {
  width: 100%;
  max-width: 640px;
  padding: 2rem;
}
.lmc-search-overlay__input {
  width: 100%;
  font-family: var(--font-serif);
  font-size: clamp(1.75rem, 4vw, 3rem);
  font-weight: 300;
  border: none;
  border-bottom: 1px solid var(--border-dark);
  outline: none;
  padding: 1rem 0;
  background: transparent;
  color: var(--text);
}
.lmc-search-overlay__close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  background: none;
  border: none;
  font-size: 1.5rem;
  cursor: pointer;
  color: var(--text);
}

/* ---- Reduce motion ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
  }
  [data-reveal], [data-reveal-stagger] > * { opacity: 1; transform: none; }
  .lmc-page-loader { display: none; }
  .lmc-cursor, .lmc-cursor-ring { display: none; }
}