/* GSAP motion layer
   Global animation support for Integral Nexus.
   Works with public GSAP + ScrollTrigger, and enables Club GSAP plugins when dropped into /js/vendor/gsap/.
*/

html,
body {
  min-height: 100%;
}

html.gsap-smooth-ready,
html.gsap-smooth-ready body {
  height: 100%;
}

#smooth-wrapper {
  position: relative;
  min-height: 100%;
}

html.gsap-smooth-ready #smooth-wrapper {
  overflow: hidden;
}

#smooth-content {
  position: relative;
  min-height: 100%;
  will-change: transform;
}

/* Pre-hide GSAP reveal targets as soon as html.js is set (inline, before parse).
   This prevents elements flashing visible between first paint and GSAP init.
   GSAP overrides these with inline styles once animations play.
   No-JS fallback: html.js is never added, so elements remain visible. */
html.js [data-gsap-reveal] {
  opacity: 0;
}

/* Pre-hide feature cards that hero-enhanced.js will stagger in.
   The intro-strip section is always below the fold on load (hero is full-viewport),
   so hiding early causes no visible flash and prevents the autoAlpha:0 jump. */
html.js .intro-strip .feature-card {
  opacity: 0;
}

/* Pre-hide section intro blocks that hero-enhanced.js scroll-reveals.
   All three sections sit well below the fold on load — hiding early is safe. */
html.js .systems-preview__head,
html.js .featured-system__copy,
html.js .automation-scenes__head {
  opacity: 0;
}

[data-gsap-reveal],
[data-hero-copy-title],
[data-hero-copy-lede],
[data-hero-copy-subtag],
[data-hero-scene-title] {
  will-change: transform, opacity, filter;
}

.hero-home__media {
  overflow: hidden;
}

.hero-home__media img,
.hero-home__transition-image {
  will-change: transform, opacity, filter;
  backface-visibility: hidden;
  transform-origin: center center;
}

.hero-home__transition-image {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 48%;
  pointer-events: none;
  opacity: 0;
  filter: brightness(0.98) contrast(1.08) saturate(1.04);
}

.hero-home__media > img[data-hero-scene-image] {
  position: relative;
  z-index: 0;
}

.hero-home__copy .line,
.hero-home__copy .word,
.hero-home__copy .char {
  will-change: transform, opacity;
}

@media (prefers-reduced-motion: reduce) {
  #smooth-content,
  [data-gsap-reveal],
  [data-hero-copy-title],
  [data-hero-copy-lede],
  [data-hero-copy-subtag],
  [data-hero-scene-title],
  .hero-home__media img,
  .hero-home__transition-image {
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
}