/* V43 — Entrance sequence: zoom the WHOLE original logo first.
   Afterwards illuminate only the crescent and sway only the paint bucket.
   Lightweight CSS-only animation; each effect plays once per page load.
   Exactly the same original artwork and independent masks as V42. */
.brand .luna-logo-v42 {
  display: block;
  position: relative;
  width: 185px;
  height: 139px;
  flex: 0 0 auto;
  isolation: isolate;
  transform-origin: center center;
  animation: luna-entire-logo-zoom-v43 .90s cubic-bezier(.22,1,.36,1) 0s 1 both;
}
.brand .luna-logo-v42 img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  max-width: none;
  pointer-events: none;
  user-select: none;
}
.brand .luna-logo-base-v42 { z-index: 1; }
.brand .luna-moon-v42 {
  z-index: 2;
  opacity: 0;
  filter: brightness(1.24) drop-shadow(0 0 3px rgba(255,52,57,.73));
  animation: luna-moon-glow-v43 2.20s ease-in-out 1.02s 1 both;
}
.brand .luna-bucket-v42 {
  z-index: 3;
  transform-origin: 67.45% 77.7%;
  animation: luna-bucket-sway-v43 2.35s ease-in-out 1.17s 1 both;
}
/* Phase one (0–0.9 s): all parts, including lettering, zoom in together. */
@keyframes luna-entire-logo-zoom-v43 {
  0% { transform: scale(.72); opacity: .25; }
  65% { transform: scale(1.04); opacity: 1; }
  100% { transform: scale(1); opacity: 1; }
}
/* Phase two (1.02–3.22 s): crescent glow only, fading back to original. */
@keyframes luna-moon-glow-v43 {
  0%,100% { opacity: 0; }
  19% { opacity: .36; }
  44%,59% { opacity: 1; }
  86% { opacity: .16; }
}
/* Phase three (1.17–3.52 s): slight bucket swing, settles naturally. */
@keyframes luna-bucket-sway-v43 {
  0%,13%,100% { transform: rotate(0deg); }
  29% { transform: rotate(5.5deg); }
  48% { transform: rotate(-4deg); }
  65% { transform: rotate(2.5deg); }
  82% { transform: rotate(-1deg); }
}
@media (max-width: 1000px) { .brand .luna-logo-v42 { width: 168px; height: 126px; } }
@media (max-width: 760px) { .brand .luna-logo-v42 { width: 144px; height: 108px; } }
@media (max-width: 380px) { .brand .luna-logo-v42 { width: 132px; height: 100px; } }
@media (prefers-reduced-motion: reduce) {
  .brand .luna-logo-v42,
  .brand .luna-moon-v42,
  .brand .luna-bucket-v42 { animation: none !important; }
  .brand .luna-logo-v42,
  .brand .luna-bucket-v42 { transform: none !important; opacity: 1 !important; }
  .brand .luna-moon-v42 { opacity: 0 !important; }
}
