/* Add custom styles or animations here if needed */

/* Example: Glassmorphism effect (Tailwind's backdrop-blur and bg-opacity cover most cases) */
.glassmorphism {
  /* background: rgba(31, 41, 55, 0.6); /* Slightly transparent dark background (Tailwind: bg-gray-800 bg-opacity-60) */
  background: theme('colors.glass-bg'); /* Using Tailwind theme variable */
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px); /* Safari */
  border: 1px solid theme('colors.glass-border'); /* Subtle border */
}

/* Example: Subtle fade-in-up animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.8s ease-out forwards;
}

/* Example: Modal animations */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes scaleIn {
    from { transform: scale(0.95); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.animate-fade-in {
    animation: fadeIn 0.3s ease-out forwards;
}
.animate-scale-in {
     animation: scaleIn 0.3s ease-out forwards;
}

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

/* Add specific styles for service icons if not using a library */
/* .service-card div[class*="text-4xl"] { ... } */

/* Style scrollbar (optional, browser support varies) */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: theme('colors.gray.800');
}
::-webkit-scrollbar-thumb {
  background-color: theme('colors.brand-primary');
  border-radius: 10px;
  border: 2px solid theme('colors.gray.800');
}

/* Improve focus outlines for accessibility */
*:focus-visible {
    outline: 2px solid theme('colors.brand-primary');
    outline-offset: 2px;
    border-radius: 2px; /* Optional */
}