/* Additions on top of the original Airo stylesheet (site.css).
   1) Fade-in animation that replaces the old React motion library.
   2) A few utility classes used by the new blog list, privacy, terms and thank-you pages. */

/* 1) Fade-in on scroll. Content stays visible if JavaScript is off. */
.js [data-reveal] {
  opacity: 0;
  transform: var(--reveal-from, translateY(24px));
}
.js [data-reveal].is-revealed {
  opacity: 1;
  transform: none;
  transition: opacity .55s cubic-bezier(0, 0, .58, 1) var(--reveal-delay, 0s),
              transform .55s cubic-bezier(0, 0, .58, 1) var(--reveal-delay, 0s);
}
@media (prefers-reduced-motion: reduce) {
  .js [data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* 2) Utilities not present in the original stylesheet */
.aspect-\[16\/9\] { aspect-ratio: 16 / 9; }
.min-h-\[60vh\] { min-height: 60vh; }
.group:hover .group-hover\:text-primary { color: hsl(var(--primary)); }
@media (min-width: 1024px) {
  .lg\:aspect-auto { aspect-ratio: auto; }
  .lg\:min-h-\[300px\] { min-height: 300px; }
}

/* Links inside long-form legal text */
.legal a { color: hsl(var(--primary)); font-weight: 600; text-decoration: underline; text-underline-offset: 4px; }
.legal a:hover { color: hsl(var(--foreground)); }