/* ==========================================================================
   LAMIA TRADERS — Animation system
   Reusable, IntersectionObserver-driven reveal classes.
   Add a class, the observer adds `.is-visible` when it enters the viewport.
   ========================================================================== */

:root {
  --reveal-dur: 0.95s;
  --reveal-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Base reveal states ------------------------------------------------------ */
.reveal-up,
.reveal-left,
.reveal-right,
.reveal-scale,
.reveal-fade,
.stagger-item {
  opacity: 0;
  will-change: transform, opacity;
  transition:
    opacity var(--reveal-dur) var(--reveal-ease),
    transform var(--reveal-dur) var(--reveal-ease);
}

.reveal-up      { transform: translate3d(0, 46px, 0); }
.reveal-left    { transform: translate3d(-56px, 0, 0); }
.reveal-right   { transform: translate3d(56px, 0, 0); }
.reveal-scale   { transform: scale(0.94); }
.reveal-fade    { transform: none; }
.stagger-item   { transform: translate3d(0, 34px, 0); }

.reveal-up.is-visible,
.reveal-left.is-visible,
.reveal-right.is-visible,
.reveal-scale.is-visible,
.reveal-fade.is-visible,
.stagger-item.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

/* Staggering: parent gets .stagger, children get .stagger-item ------------- */
.stagger .stagger-item:nth-child(1)  { transition-delay: 0.00s; }
.stagger .stagger-item:nth-child(2)  { transition-delay: 0.09s; }
.stagger .stagger-item:nth-child(3)  { transition-delay: 0.18s; }
.stagger .stagger-item:nth-child(4)  { transition-delay: 0.27s; }
.stagger .stagger-item:nth-child(5)  { transition-delay: 0.36s; }
.stagger .stagger-item:nth-child(6)  { transition-delay: 0.45s; }
.stagger .stagger-item:nth-child(7)  { transition-delay: 0.54s; }
.stagger .stagger-item:nth-child(8)  { transition-delay: 0.63s; }
.stagger .stagger-item:nth-child(9)  { transition-delay: 0.72s; }
.stagger .stagger-item:nth-child(10) { transition-delay: 0.81s; }
.stagger .stagger-item:nth-child(11) { transition-delay: 0.90s; }
.stagger .stagger-item:nth-child(12) { transition-delay: 0.99s; }

/* Manual delays ----------------------------------------------------------- */
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.4s; }
.delay-5 { transition-delay: 0.5s; }
.delay-6 { transition-delay: 0.6s; }

/* Image reveal: curtain wipe + slow settle -------------------------------- */
.image-reveal { position: relative; overflow: hidden; }
.image-reveal::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--dark);
  transform-origin: right;
  transform: scaleX(1);
  transition: transform 1.15s var(--reveal-ease);
  z-index: 3;
}
.image-reveal > img,
.image-reveal > picture > img {
  transform: scale(1.22);
  transition: transform 1.7s var(--reveal-ease);
}
.image-reveal.is-visible::after { transform: scaleX(0); transform-origin: left; }
.image-reveal.is-visible > img,
.image-reveal.is-visible > picture > img { transform: scale(1); }

/* Vertical variant */
.image-reveal-y::after { transform-origin: bottom; transform: scaleY(1); }
.image-reveal-y.is-visible::after { transform: scaleY(0); transform-origin: top; }

/* Text reveal: line masks ------------------------------------------------- */
.text-reveal { display: block; overflow: hidden; }
.text-reveal > span {
  display: block;
  transform: translate3d(0, 105%, 0);
  transition: transform 1.05s var(--reveal-ease);
}
.text-reveal.is-visible > span { transform: translate3d(0, 0, 0); }
.text-reveal:nth-of-type(2) > span { transition-delay: 0.1s; }
.text-reveal:nth-of-type(3) > span { transition-delay: 0.2s; }

/* Animated divider line --------------------------------------------------- */
.line-grow {
  height: 1px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1.1s var(--reveal-ease);
}
.line-grow.is-visible { transform: scaleX(1); }
.line-grow-v {
  width: 1px;
  transform: scaleY(0);
  transform-origin: top;
}
.line-grow-v.is-visible { transform: scaleY(1); }

/* Parallax (JS sets --py) ------------------------------------------------- */
.parallax-image { will-change: transform; overflow: hidden; }
.parallax-image > img,
.parallax-image > .parallax-inner {
  transform: translate3d(0, var(--py, 0px), 0) scale(1.16);
  will-change: transform;
}

/* Counter --------------------------------------------------------------- */
.counter { font-variant-numeric: tabular-nums; }

/* Page-load choreography (hero) ------------------------------------------ */
.preloaded .load-in { animation: loadIn 1.1s var(--reveal-ease) both; }
.load-in-1 { animation-delay: 0.10s; }
.load-in-2 { animation-delay: 0.22s; }
.load-in-3 { animation-delay: 0.34s; }
.load-in-4 { animation-delay: 0.46s; }
.load-in-5 { animation-delay: 0.58s; }
.load-in-6 { animation-delay: 0.70s; }

@keyframes loadIn {
  from { opacity: 0; transform: translate3d(0, 34px, 0); }
  to   { opacity: 1; transform: none; }
}

.load-mask { overflow: hidden; display: block; }
.preloaded .load-mask > span {
  display: block;
  animation: loadMask 1.25s var(--reveal-ease) both;
}
@keyframes loadMask {
  from { transform: translate3d(0, 105%, 0); }
  to   { transform: none; }
}

/* Brand preloader --------------------------------------------------------- */
.preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--dark);
  display: grid;
  place-items: center;
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.preloader__logo {
  font-family: var(--font-display);
  font-size: clamp(2rem, 6vw, 4rem);
  color: #fff;
  letter-spacing: 0.1em;
  text-align: center;
  animation: logoIn 1.1s var(--reveal-ease) both;
}
.preloader__logo small {
  display: block;
  font-family: var(--font-body);
  font-size: 0.6rem;
  letter-spacing: 0.42em;
  color: var(--accent);
  margin-top: 10px;
}
.preloader__bar {
  width: min(240px, 50vw);
  height: 1px;
  background: rgba(255,255,255,0.16);
  margin: 26px auto 0;
  overflow: hidden;
}
.preloader__bar i {
  display: block;
  height: 100%;
  width: 100%;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
  animation: barFill 1.05s var(--reveal-ease) forwards;
}
@keyframes logoIn { from { opacity: 0; transform: scale(0.94); } to { opacity: 1; transform: none; } }
@keyframes barFill { to { transform: scaleX(1); } }
.preloader.is-done { opacity: 0; visibility: hidden; }

/* Hover micro-interaction helpers ----------------------------------------- */
.hover-lift { transition: transform 0.55s var(--reveal-ease), box-shadow 0.55s var(--reveal-ease); }
.hover-lift:hover { transform: translateY(-6px); }

/* Accessibility ----------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal-up, .reveal-left, .reveal-right, .reveal-scale, .reveal-fade, .stagger-item {
    opacity: 1 !important;
    transform: none !important;
  }
  .image-reveal::after { display: none; }
  .image-reveal > img { transform: none !important; }
  .text-reveal > span { transform: none !important; }
  .line-grow { transform: none !important; }
  .parallax-image > img { transform: none !important; }
  .hero__media img { animation: none; transform: none; }
}