/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

@import "tailwindcss";
@plugin "tailwind-scrollbar";

/* CSS Variables */
:root {
  --background: #ffffff;
  --foreground: #171717;
  --font-roboto: 'Roboto', sans-serif;       /* ✅ Added Roboto variable */
  --font-playfair: 'Playfair Display', serif;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

/* Body styling */
body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-roboto); /* Default font */
}

/* Font utility classes */
.font-roboto {
  font-family: var(--font-roboto);
}

.font-playfair {
  font-family: var(--font-playfair);
}

/* Scrollbar plugin */
@layer utilities {
  .scrollbar-none {
    @apply scrollbar-none;
  }
}

.scrollbar-hide::-webkit-scrollbar {
  display: none;
}

.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}


/* Animations */
@keyframes fadeUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

.animate-fadeUp {
  animation: fadeUp 0.8s ease forwards;
}

@keyframes zoomFade {
  0% { opacity: 0; transform: scale(0.85) translateY(20px); }
  60% { opacity: 1; transform: scale(1) translateY(0); }
  100% { opacity: 1; transform: scale(1); }
}

.animate-zoomFade {
  animation: zoomFade 0.9s ease-out forwards;
}