body {
  font-family: "Fira Sans", sans-serif;
}

.disney-font {
  font-family: "Fira Sans", sans-serif;
}

/* Custom bright Disney-themed gradients */
.bg-disney-magic-light {
  background: linear-gradient(135deg, #eff6ff 0%, #fdf2f8 50%, #fefce8 100%);
}

@media screen and (min-width: 500px) {
  #hero2 {
    background: url("https://on-c2-cmshub-public.s3.ap-southeast-3.amazonaws.com/new_main_kv_4ccac64805.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 700px;
    width: 100%;
    margin-top: 100px;
  }
}

@media screen and (max-width: 480px) {
  #hero2 {
    background: url("https://www.ocbc.id/asset/media/Feature/Banner/Banner%20Nyala/disney-run-mobile.jpeg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    min-height: 480px;
    width: 100%;
  }
}

.general-red-text {
  color: #ea0a2a;
}

#hero {
  background: url("https://on-c2-cmshub-public.s3.ap-southeast-3.amazonaws.com/new_main_kv_4ccac64805.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  min-height: 500px;
  width: 100%;
}

#hero-img {
  width: 500px;
}

@media screen and (max-width: 1024px) {
  #hero {
    gap: 20px;
    flex-direction: column;
  }

  #hero-img {
    width: 300px;
  }
}

#info {
  background: url("https://on-c2-cmshub-public.s3.ap-southeast-3.amazonaws.com/info_bg_new_d6c128967d.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding-right: 15px;
  padding-left: 15px;
}

#info a {
  color: white !important;
}

.text-magic-gradient {
  background: linear-gradient(to right, #ea580c, #db2777, #7c3aed);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Floating Animation for Magic Castle & Mickey Ears */
@keyframes float {
  0%,
  100% {
    transform: translateY(0) rotate(0deg);
  }

  50% {
    transform: translateY(-10px) rotate(1.5deg);
  }
}

.animate-float {
  animation: float 4s ease-in-out infinite;
}

/* Pulse Glow for Light Theme */
@keyframes pulseGlow {
  0%,
  100% {
    opacity: 0.5;
    transform: scale(1);
  }

  50% {
    opacity: 0.9;
    transform: scale(1.08);
  }
}

.magic-glow {
  animation: pulseGlow 3s ease-in-out infinite;
}

/* Magic Canvas overlay setup */
#magicCanvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1;
}