/* New Moon Esthetics — moonrise intro + gentle scroll reveals.
   The intro covers the page from the first frame (no pre-animation
   flash): her real logo fades up under a glowing crescent, then the
   whole veil lifts. Skippable on tap/click; auto-dismisses as a
   failsafe even if an animation event never fires. */

#moon-intro {
  position: fixed; inset: 0; z-index: 1000;
  background: radial-gradient(700px 420px at 50% 30%, #121A3A 0%, #070B1D 62%, #05070F 100%);
  display: flex; align-items: center; justify-content: center;
  animation: intro-lift 0.8s cubic-bezier(.65,0,.35,1) 2.3s forwards;
}
#moon-intro.intro-done { display: none; }
#moon-intro .intro-stage { text-align: center; padding: 24px; animation: intro-stage-in .6s ease-out both; }
#moon-intro .intro-logo {
  width: 132px; height: 132px; object-fit: cover; border-radius: 50%; margin: 0 auto 14px;
  border: 3px solid #EEC987; box-shadow: 0 0 44px rgba(238,201,135,.5);
  animation: intro-logo-in 1.1s cubic-bezier(.3,1.3,.4,1) .1s both;
}
#moon-intro .intro-word {
  font-family: 'Great Vibes', cursive; font-size: 46px; color: #F6F1E7; line-height: 1.1;
  animation: intro-stage-in .7s ease-out .45s both;
}
#moon-intro .intro-sub {
  font-size: 13px; font-weight: 800; letter-spacing: .34em; text-transform: uppercase; color: #35B5AC;
  animation: intro-stage-in .7s ease-out .7s both;
}
@keyframes intro-lift { to { opacity: 0; visibility: hidden; transform: translateY(-3.5%); } }
@keyframes intro-stage-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes intro-logo-in { from { opacity: 0; transform: scale(.7) rotate(-8deg); } to { opacity: 1; transform: none; } }

/* Scroll reveals — elements rise softly as they enter the viewport. */
[data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  #moon-intro { animation-duration: .1s; animation-delay: .1s; }
}
