/* ═══════════════════════════════════════════════════════════════
   AL-SDRH PROJECTS — Premium Animations Stylesheet
   GSAP 3.12.5 + Lenis 1.1.14 + SplitType 0.3.4
   ═══════════════════════════════════════════════════════════════ */

/* ── Disable native smooth scroll — Lenis takes over ── */
html { scroll-behavior: auto !important; }

/* ════════════ LUXURY CURSOR ════════════ */
@media (hover: hover) {
  body { cursor: none; }
  a, button, [role="button"], .chip, .nav__link,
  .partner-logo, label, input, textarea, select { cursor: none; }
}

/* ── GPU-accelerated cursor — uses transform:translate (no left/top reflow) ── */
#cur-dot {
  position: fixed;
  top: 0;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--gold);
  pointer-events: none;
  z-index: 2147483647;
  /* will-change on transform (compositor thread = zero main thread cost) */
  will-change: transform;
  transition:
    width 160ms var(--ease),
    height 160ms var(--ease),
    background 160ms,
    opacity 220ms;
  opacity: 0;
}

/* Hover state — dot expands with smooth CSS transition */
body.cur-hover #cur-dot {
  width: 10px;
  height: 10px;
  background: var(--gold-lt);
}

/* Click feedback */
body.cur-click #cur-dot {
  width: 4px;
  height: 4px;
}

/* Hidden on touch devices */
@media (hover: none) {
  #cur-dot { display: none !important; }
}

/* ════════════ SPLITTYPE WORD WRAPPERS ════════════ */
.word-outer {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  line-height: inherit;
}

.word-inner {
  display: inline-block;
  line-height: inherit;
}

/* ════════════ LOADER COUNTER ════════════ */
.loader__counter {
  font-family: 'DM Sans', sans-serif;
  font-size: 2.8rem;
  font-weight: 700;
  color: var(--gold-lt);
  letter-spacing: .04em;
  line-height: 1;
  opacity: 0;
  margin-bottom: -8px;
}

/* ════════════ GSAP READY — Kill CSS reveal system ════════════ */
/* Once GSAP is active, disable all CSS transitions on .reveal.
   GSAP controls opacity/transform via inline styles exclusively. */
.gsap-ready .reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

/* Kill CSS keyframe animations on hero content — GSAP handles them */
.gsap-ready .hero__tag,
.gsap-ready .hero__title,
.gsap-ready .hero__sub,
.gsap-ready .hero__actions {
  animation: none !important;
}

/* Kill CSS loader animations that GSAP replaces */
.gsap-ready .loader__logo-wrap,
.gsap-ready .loader__sub,
.gsap-ready .loader__bar {
  animation: none !important;
  opacity: 1;
  transform: none;
}

/* ════════════ MAGNETIC BUTTONS — Transform isolation ════════════ */
.btn--gold,
.btn--outline,
.nav__link--pill {
  will-change: transform;
}

/* Prevent CSS hover transform conflicting with magnetic GSAP */
.gsap-ready .btn--gold:hover,
.gsap-ready .btn--outline:hover {
  transform: none;
}

/* ════════════ IMAGE PARALLAX — Overflow enforcement ════════════ */
.poster,
.proj-card__media,
.blog-card__img,
.news-card__img {
  overflow: hidden;
}

/* ════════════ REDUCED MOTION — Kill everything ════════════ */
@media (prefers-reduced-motion: reduce) {
  #cur-dot { display: none !important; }
  .word-outer { overflow: visible !important; }
  .loader__counter { display: none !important; }
}
