﻿/* ==========================================================================
   AviCore — Animation Utilities (driven by GSAP via main.js)
   ========================================================================== */

/* Progressive enhancement: only hide elements when JS is enabled.
   Without JS, content is fully visible (accessibility + no-JS fallback). */
.js [data-reveal]:not([data-avic-revealed]) {
  opacity: 0;
  will-change: transform, opacity;
  animation: avic-reveal-failsafe 0s ease 4s forwards;
}
.js [data-reveal="up"]:not([data-avic-revealed])    { transform: translateY(40px); }
.js [data-reveal="down"]:not([data-avic-revealed])  { transform: translateY(-40px); }
.js [data-reveal="left"]:not([data-avic-revealed])  { transform: translateX(-40px); }
.js [data-reveal="right"]:not([data-avic-revealed]) { transform: translateX(40px); }
.js [data-reveal="fade"]:not([data-avic-revealed])  { transform: none; }
.js [data-reveal="scale"]:not([data-avic-revealed]) { transform: scale(0.94); }

/* Stagger groups — children animate sequentially */
.js [data-reveal-stagger]:not([data-avic-revealed]) > * {
  opacity: 0;
  transform: translateY(32px);
  will-change: transform, opacity;
  animation: avic-reveal-failsafe 0s ease 4s forwards;
}

/* Once revealed, lock the visible state regardless of any leftover inline styles
   GSAP may have cleared. */
.js [data-avic-revealed],
.js [data-avic-revealed] > * {
  opacity: 1 !important;
}

/* Fail-safe: if JS reveals never fire (script error, network hiccup, etc.),
   elements force-show after 4 s instead of staying invisible. */
@keyframes avic-reveal-failsafe {
  to { opacity: 1; transform: none; }
}

/* Curtain wipe (used on photo tiles) */
[data-curtain]::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--avic-gold-grad);
  transform-origin: right center;
  transition: transform 0.85s var(--avic-ease);
  pointer-events: none;
  z-index: 5;
}
[dir="rtl"] [data-curtain]::after { transform-origin: left center; }
[data-curtain].is-revealed::after { transform: scaleX(0); }

/* Gradient stroke text reveal */
.avic-text-reveal { display: inline-block; overflow: hidden; padding-bottom: 0.12em; line-height: 1.25; }
.avic-text-reveal > span {
  display: inline-block;
  transform: translateY(110%);
}

/* Hover lift utility */
.hover-lift {
  transition: transform var(--avic-dur) var(--avic-ease), box-shadow var(--avic-dur) var(--avic-ease);
}
.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: var(--avic-shadow-lg);
}

/* Scroll cue (hero arrow) */
.avic-scroll-cue {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: var(--avic-s-2);
  font-family: var(--avic-font-body);
  font-size: 11px;
  text-transform: uppercase;
  color: var(--avic-gold);
  opacity: 0.85;
}
.avic-scroll-cue::after {
  content: "";
  width: 1px;
  height: 36px;
  background: var(--avic-gold-grad);
  animation: avic-scroll-cue-pulse 1.8s var(--avic-ease) infinite;
}
@keyframes avic-scroll-cue-pulse {
  0%   { transform: scaleY(0.2); transform-origin: top; opacity: 0; }
  40%  { transform: scaleY(1);   transform-origin: top; opacity: 1; }
  60%  { transform: scaleY(1);   transform-origin: bottom; opacity: 1; }
  100% { transform: scaleY(0.2); transform-origin: bottom; opacity: 0; }
}

/* Marquee (continuous horizontal scroll for sectors strip / clients) */
.avic-marquee {
  overflow: hidden;
  --avic-marquee-duration: 30s;
}
.avic-marquee__track {
  display: flex;
  gap: 64px;
  animation: avic-marquee var(--avic-marquee-duration) linear infinite;
  width: max-content;
}
@keyframes avic-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* Shimmer placeholder (used while images load) */
.avic-shimmer {
  background: linear-gradient(90deg, var(--avic-cream-soft) 0%, var(--avic-cream) 50%, var(--avic-cream-soft) 100%);
  background-size: 200% 100%;
  animation: avic-shimmer 1.5s linear infinite;
}
@keyframes avic-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}
