/* Smooth scrolling */
html {
  scroll-behavior: smooth;
}

/* Custom animations */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-in {
  animation: fadeIn 0.6s ease-out;
}

/* Hero image optimization */
.hero-bg {
  background-image: linear-gradient(rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.4) 100%), 
                    url("https://lh3.googleusercontent.com/aida-public/AB6AXuAKyFa14fFfBsGpVcn65UKjvqELDbEookzBMsWfPNqIpTPB7AlHN3gZv8WYcGxJAsEGl7-WsxEw6QWRPecW_Qs-qSH6jo-JxcGPU_kTw9FpRHjrtq-YYiRM142k8uC6p3a4-Zw92ifETdqY5EfhPdEF_pnDPG1ynTWd1lhpM_Qcs1d3KzjVL1FqI3x_DnDBzZ0cg5Zhr9Uhet68pYvKUOT4-2mmbwuhY2ufbuq5mqhON1BmNwcp5XWBFq1tpt5JJF40BchBLpGcV2M");
}

/* Hover effects */
.plan-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.plan-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

/* Button hover effects */
.btn-primary {
  transition: background-color 0.3s ease, transform 0.2s ease;
}

.btn-primary:hover {
  background-color: #0d7ab8;
  transform: scale(1.02);
}

.btn-secondary {
  transition: background-color 0.3s ease;
}

.btn-secondary:hover {
  background-color: #d1e3eb;
}

/* Mobile menu */
.mobile-menu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.mobile-menu.active {
  max-height: 500px;
}