/* Entry + scroll reveal for the Francis Aiello portfolio.
   Elements fade up from 70px. Homepage elements animate individually, staggered. */

/* Pre-paint hidden state — prevents a flash before React mounts. */
html.reveal-pending .home-wordmark,
html.reveal-pending .home-role,
html.reveal-pending .home-name,
html.reveal-pending .home-services,
html.reveal-pending .home-cta,
html.reveal-pending .home-hero-band,
html.reveal-pending .home-about-title,
html.reveal-pending .home-copy,
html.reveal-pending .home-portrait,
html.reveal-pending .home-icons,
html.reveal-pending .work-hero,
html.reveal-pending ul.grid > li,
html.reveal-pending #contact,
html.reveal-pending .project-hero,
html.reveal-pending .project-section,
html.reveal-pending .sigma-hero,
html.reveal-pending .sigma-logos,
html.reveal-pending .sigma-social,
html.reveal-pending .sigma-app,
html.reveal-pending main section[id] {
  opacity: 0;
}

/* Below-the-fold hidden state (JS holds it until scrolled into view). */
.fx-hide {
  opacity: 0;
}

/* Reveal animation (entry on load + on scroll). */
.fx-run {
  animation: fx-rise 0.8s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes fx-rise {
  from {
    opacity: 0;
    transform: translateY(70px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}