/* HIGHLINE — AOS FADE-IN
 * AOS supplies the trigger classes; these are our fade-only styles.
 * No transforms, so the gallery's horizontal layout stays in place.
 * Without JS/AOS, everything remains visible.
 */
html.highline-aos-ready [data-aos="fade-in"] {
  opacity: 0;
  transition-property: opacity;
  transition-duration: var(--highline-aos-duration, 700ms);
  transition-timing-function: ease-out;
  transition-delay: 0ms;
}

html.highline-aos-ready [data-aos="fade-in"].aos-animate {
  opacity: 1;
  transition-delay: var(--highline-aos-delay, 0ms);
}

/* Never make keyboard users wait to see a focused link or form control. */
html.highline-aos-ready [data-aos="fade-in"]:focus-within {
  opacity: 1 !important;
  transition: none !important;
}

@media (prefers-reduced-motion: reduce) {
  html.highline-aos-ready [data-aos="fade-in"] {
    opacity: 1 !important;
    transition: none !important;
  }
}

@media print {
  html.highline-aos-ready [data-aos="fade-in"] {
    opacity: 1 !important;
    transition: none !important;
  }
}


/* Start 40px below, then fade into the original position. */
html.highline-aos-ready [data-aos="fade-in"] {
  transform: translateY(80px);
  transition-property: opacity, transform;
}

html.highline-aos-ready [data-aos="fade-in"].aos-animate,
html.highline-aos-ready [data-aos="fade-in"]:focus-within {
  transform: none;
}

/* Keep content stationary for reduced motion and printing. */
@media (prefers-reduced-motion: reduce), print {
  html.highline-aos-ready [data-aos="fade-in"] {
    transform: none !important;
  }
}