/* AOS compatibility overrides for existing portfolio CSS. Load after styles.css and aos.css. */
/* Existing site styles include a custom [data-aos] animation that competes with AOS. */
html:not(.no-js) [data-aos]:not(.aos-animate) {
  visibility: visible;
}

/* Let the official AOS stylesheet own the transforms and opacity. */
[data-aos]:not(.reveal) {
  transition-property: opacity, transform !important;
}

/* Do not apply the site's custom active class as an AOS completion state. */
[data-aos].aos-animate:not(.reveal) {
  opacity: 1 !important;
  transform: none !important;
}

/* Avoid old reveal keyframes on AOS card elements. */
[data-aos].tile,
[data-aos].path-card {
  animation: none !important;
}

/* Keep skills page's own scroll-reveal system independent. */
@media (prefers-reduced-motion: reduce) {
  [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Restore AOS motion on mobile where the old site's media query disables tile transitions. */
@media (max-width: 820px) and (prefers-reduced-motion: no-preference) {

  .tile[data-aos],
  .path-card[data-aos],
  .steps>div[data-aos],
  .contact-tip[data-aos] {
    transition-property: opacity, transform !important;
    transition-duration: 750ms !important;
    transition-timing-function: ease-out !important;
  }

  .tile[data-aos]:not(.aos-animate),
  .path-card[data-aos]:not(.aos-animate),
  .steps>div[data-aos]:not(.aos-animate),
  .contact-tip[data-aos]:not(.aos-animate) {
    opacity: 0 !important;
  }
}