/* Custom Styles and Animations for Integrate Global - Ultra Modern Theme */

/* Base Styles */
html {
  scroll-behavior: smooth;
  background-color: #030712; /* Deep slate-950 */
  color: #f8fafc;
}

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background-color: #030712;
  color: #f8fafc;
  overflow-x: hidden;
}

/* Typography Enhancements */
h1, h2, h3, h4, h5, h6 {
  letter-spacing: -0.03em;
}

/* Custom Animations */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Glassmorphism Utilities - Dark by default */
.glass {
  background: rgba(3, 7, 18, 0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.glass-card {
  background: rgba(15, 23, 42, 0.4);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
}

.glass-card:hover {
  background: rgba(30, 41, 59, 0.6);
  border: 1px solid rgba(59, 130, 246, 0.3); /* Blue border on hover */
}

/* Bento Box Grid Utilities */
.bento-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.bento-item-large {
  grid-column: span 2;
  grid-row: span 2;
}

.bento-item-wide {
  grid-column: span 2;
  grid-row: span 1;
}

.bento-item-tall {
  grid-column: span 1;
  grid-row: span 2;
}

@media (max-width: 1024px) {
  .bento-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .bento-grid {
    grid-template-columns: 1fr;
  }
  .bento-item-large, .bento-item-wide, .bento-item-tall {
    grid-column: span 1;
    grid-row: span 1;
  }
}

/* Glow effects */
.glow-text {
  text-shadow: 0 0 20px rgba(59, 130, 246, 0.5);
}

/* Hide scrollbar for clean look */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #030712; 
}
::-webkit-scrollbar-thumb {
  background: #1e293b; 
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #334155; 
}