:root {
  --primary-green: #004225;
  --secondary-gold: #FFB000;
}

body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url('hero-bg.jpg') no-repeat center center/cover;
  z-index: -1;
  opacity: 0.1;
}


@keyframes bounceIn {
  0% {
    transform: scale(0.8) translateY(50px);
    opacity: 0;
  }
  60% {
    transform: scale(1.05) translateY(-10px);
    opacity: 1;
  }
  100% {
    transform: scale(1) translateY(0);
  }
}
.animate-bounce-in {
  animation: bounceIn 0.8s ease-out;
}

.cta-animated-btn {
  position: relative;
  overflow: hidden;
  transition: 
    box-shadow 0.3s cubic-bezier(0.4,0,0.2,1),
    transform 0.2s cubic-bezier(0.4,0,0.2,1);
  z-index: 1;
  animation: cta-fade-in 0.8s cubic-bezier(0.4,0,0.2,1);
}

.cta-animated-btn::before {
  content: "";
  position: absolute;
  inset: -4px;
  border-radius: 1em;
  background: linear-gradient(90deg, #FFB000, #004225, #FFB000, #004225);
  background-size: 200% 200%;
  z-index: -1;
  opacity: 0;
  transition: opacity 0.3s;
  animation: cta-glow 2s linear infinite;
}

.cta-animated-btn:hover::before,
.cta-animated-btn:focus::before {
  opacity: 1;
}

.cta-animated-btn:hover, .cta-animated-btn:focus {
  transform: scale(1.07) rotate(-1deg);
  box-shadow: 0 0 32px 0 #FFB00055, 0 8px 32px 0 #00422533;
}

@keyframes cta-glow {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes cta-fade-in {
  0% { opacity: 0; transform: translateY(40px) scale(0.95);}
  100% { opacity: 1; transform: translateY(0) scale(1);}
}

/* Ripple effect */
.cta-animated-btn .ripple {
  position: absolute;
  border-radius: 50%;
  transform: scale(0);
  animation: ripple-animate 0.6s linear;
  background: rgba(255,255,255,0.5);
  pointer-events: none;
  z-index: 2;
}
@keyframes ripple-animate {
  to {
    transform: scale(4);
    opacity: 0;
  }
}

.school-formal-font {
  font-family: 'Merriweather', Georgia, 'Times New Roman', Times, serif !important;
  letter-spacing: 0.01em;
}



