/* Public entrance and scroll reveal; component interactions remain independent. */
@media (prefers-reduced-motion: no-preference) {
  body > .navbar {
    animation: public-nav-enter .75s ease-out backwards;
  }

  :is(
    .home-hero,
    .activity-hero,
    .media-hero,
    .detail-hero,
    .sp-hero,
    .cabinet-cover,
    .layanan-head,
    .hubungi-content
  ) {
    animation: public-hero-enter 1.1s ease-out backwards;
  }

  :is(.home-hero, .activity-hero, .media-hero, .detail-hero)::before {
    animation: public-overlay-enter 1.3s ease-out backwards;
  }

  .home-brand-lockup,
  .activity-hero h1,
  .media-hero h1,
  .detail-hero-inner,
  .hubungi-linktree,
  .layanan-content > h1,
  .layanan-content > h2 {
    animation: public-copy-enter 1s cubic-bezier(.2,.75,.25,1) .16s backwards;
  }

  .home-hero h1 {
    animation: public-copy-enter 1.05s cubic-bezier(.2,.75,.25,1) .26s backwards;
  }

  .home-hero-tagline {
    animation: public-copy-enter 1.05s cubic-bezier(.2,.75,.25,1) .38s backwards;
  }

  .home-actions,
  .media-jump {
    animation: public-copy-enter 1.05s cubic-bezier(.2,.75,.25,1) .5s backwards;
  }

  .home-stat {
    animation: public-copy-enter .95s cubic-bezier(.2,.75,.25,1) backwards;
  }

  .home-stat:nth-child(1) { animation-delay: .42s; }
  .home-stat:nth-child(2) { animation-delay: .54s; }
  .home-stat:nth-child(3) { animation-delay: .66s; }
  .home-stat:nth-child(4) { animation-delay: .78s; }

  .home-section[aria-labelledby="home-about-title"]
  :is(.home-heading, .home-about-photo, .home-about-copy):not(.public-scroll-pending):not(.public-scroll-reveal) {
    animation: public-section-enter 1.2s ease-out backwards;
  }

  .public-scroll-pending {
    opacity: 0;
  }

  .public-scroll-reveal {
    animation: public-section-enter 1.2s ease-out backwards;
  }

  .public-scroll-reveal :is(.home-heading, .media-section-heading, .sp-section-heading) {
    animation: public-copy-enter 1.05s cubic-bezier(.2,.75,.25,1) backwards;
  }
}

@keyframes public-nav-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes public-hero-enter {
  from { opacity: .35; }
  to { opacity: 1; }
}

@keyframes public-overlay-enter {
  from { opacity: .35; }
  to { opacity: 1; }
}

@keyframes public-copy-enter {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes public-section-enter {
  from { opacity: 0; translate: 0 22px; }
  to { opacity: 1; translate: 0 0; }
}