body {
      box-sizing: border-box;
      font-family: 'Poppins', sans-serif;
    }
    .font-display { font-family: 'Fredoka One', cursive; }
    .font-handwritten { font-family: 'Caveat', cursive; }
    
    @keyframes float {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-10px); }
    }
    @keyframes pulse-glow {
      0%, 100% { box-shadow: 0 0 20px rgba(255, 111, 60, 0.4); }
      50% { box-shadow: 0 0 40px rgba(255, 111, 60, 0.8); }
    }
    @keyframes slide-in {
      from { opacity: 0; transform: translateX(-20px); }
      to { opacity: 1; transform: translateX(0); }
    }
    @keyframes fade-up {
      from { opacity: 0; transform: translateY(30px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .animate-float { animation: float 3s ease-in-out infinite; }
    .animate-pulse-glow { animation: pulse-glow 2s ease-in-out infinite; }
    .animate-slide-in { animation: slide-in 0.5s ease-out forwards; }
    .animate-fade-up { animation: fade-up 0.6s ease-out forwards; }
    
    .card-hover {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .card-hover:hover {
      transform: translateY(-8px) scale(1.02);
      box-shadow: 0 20px 40px rgba(255, 111, 60, 0.2);
    }
    .btn-bounce:hover {
      animation: bounce 0.5s ease-in-out;
    }
    @keyframes bounce {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.05); }
    }
    @keyframes badge-bounce {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.3); }
    }
    .badge-animate {
      animation: badge-bounce 0.3s ease-in-out;
    }
    
    .gradient-text {
      background: linear-gradient(135deg, #FF6F3C, #FFD966);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }
    
    .hero-gradient {
      background: linear-gradient(135deg, rgba(255, 111, 60, 0.1) 0%, rgba(255, 217, 102, 0.1) 50%, rgba(163, 228, 215, 0.1) 100%);
    }
    
    .scroll-smooth { scroll-behavior: smooth; }
    
    .nav-link {
      position: relative;
    }
    .nav-link::after {
      content: '';
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 0;
      height: 2px;
      background: #FF6F3C;
      transition: width 0.3s ease;
    }
    .nav-link:hover::after {
      width: 100%;
    }
    
    .modal-overlay {
      background: rgba(0, 0, 0, 0.6);
      backdrop-filter: blur(4px);
    }
    
    .toast {
      animation: slide-in 0.3s ease-out;
    }