/* Immediate content is the default for mobile, reduced motion, and the first screen. */
[data-ably-reveal] {
  opacity: 1 !important;
  transform: none !important;
  will-change: auto !important;
}

/* One brief desktop entrance: at most 10px, with no hidden state or stagger. */
@media (min-width: 992px) and (prefers-reduced-motion: no-preference) {
  [data-ably-reveal][data-ably-fade="pending"] {
    opacity: 0.72 !important;
  }
  [data-ably-fade="pending"][data-ably-enter="right"] {
    transform: translateX(10px) !important;
  }
  [data-ably-fade="pending"][data-ably-enter="left"] {
    transform: translateX(-10px) !important;
  }
  [data-ably-fade="pending"][data-ably-enter="up"] {
    transform: translateY(10px) !important;
  }
  [data-ably-reveal][data-ably-fade="shown"] {
    transition: opacity 260ms ease-out, transform 260ms ease-out;
  }
  [data-ably-reveal][data-ably-fade="pending"]:focus-within {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* Feedback for mouse and keyboard users, without lifting or sliding cards. */
@media (min-width: 992px) and (hover: hover) and (pointer: fine) {
  .uui-layout20_item.swiper-box,
  .uui-testimonial10_component {
    transition: box-shadow 180ms ease-out;
  }
  .uui-layout20_item.swiper-box:hover,
  .uui-layout20_item.swiper-box:focus-within,
  .uui-testimonial10_component:hover,
  .uui-testimonial10_component:focus-within {
    box-shadow: 0 0 0 1px rgba(0, 196, 167, 0.45), 0 8px 24px rgba(0, 0, 0, 0.08);
  }
  .uui-button-3, .uui-button-3-w, .uui-button-4, .uui-button-5 {
    transition: color 180ms ease-out, background-color 180ms ease-out,
      border-color 180ms ease-out, box-shadow 180ms ease-out;
  }
}

@media (max-width: 991px), (prefers-reduced-motion: reduce) {
  .c-card {
    transform: none !important;
    will-change: auto !important;
  }
  .uui-layout32_progress-bar {
    width: 1px !important;
    height: 100% !important;
  }
  .typed-words::after {
    animation: none !important;
    content: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html, body, #homepage-projects-list {
    scroll-behavior: auto !important;
  }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
}