@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');
@import "tailwindcss";

@theme {
  --font-sans: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-display: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
  
  --color-primary-50: #f0f7ff;
  --color-primary-100: #e0f2fe;
  --color-primary-500: #3b82f6;
  --color-primary-600: #1e3a8a;
  --color-primary-700: #1d4ed8;
  --color-primary-800: #1e3a8a;
  --color-primary-900: #172554;
  
  --color-secondary-50: #f8fafc;
  --color-secondary-100: #f1f5f9;
  --color-secondary-500: #64748b;
  --color-secondary-600: #475569;
  --color-secondary-700: #334155;
  --color-secondary-800: #1e293b;
  --color-secondary-900: #0f172a;

  --color-accent-500: #22c55e;
  --color-accent-600: #16a34a;
}

/* Custom Base Utilities or Focus States */
@layer base {
  html {
    scroll-behavior: smooth;
    background-color: #f8fafc;
    color: #1e293b;
  }
}

/* Custom visual pulse animation for Call to Action buttons */
@keyframes pulse-ring {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(30, 58, 138, 0.4);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgba(30, 58, 138, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(30, 58, 138, 0);
  }
}

.animate-pulse-ring {
  animation: pulse-ring 2s infinite;
}

/* Custom Styles from index.html */
.service-card {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.service-card:hover {
  transform: translateY(-4px);
  border-color: #3b82f6;
  box-shadow: 0 10px 25px -5px rgba(30, 58, 138, 0.05);
}
.pulse-ring {
  animation: pulse-ring-anim 2s infinite;
}
@keyframes pulse-ring-anim {
  0% {
    box-shadow: 0 0 0 0 rgba(30, 58, 138, 0.4);
  }
  70% {
    box-shadow: 0 0 0 12px rgba(30, 58, 138, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(30, 58, 138, 0);
  }
}
@keyframes fade-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-in {
  animation: fade-in 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}