/* Estilos customizados para Leonne Capital */

/* Variáveis CSS para cores do projeto */
:root {
  --color-slate-900: #0f172a;
  --color-slate-800: #1e293b;
  --color-slate-600: #475569;
  --color-slate-500: #64748b;
  --color-gray-50: #f9fafb;
  --color-gray-100: #f3f4f6;
  --color-gray-200: #e5e7eb;
  --color-gray-400: #9ca3af;
  --color-gray-600: #4b5563;
  --color-gray-700: #374151;
  --color-gray-800: #1f2937;
  --color-white: #ffffff;
}

/* Estilos base */
body,
.font-sans {
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
}

/* Scroll suave */
html {
  scroll-behavior: smooth;
}

/* Estilos para elementos customizados */
.leonne-gradient {
  background: linear-gradient(to right, var(--color-slate-900), var(--color-slate-800));
}

/* Utilitários adicionais */
.text-balance {
  text-wrap: balance;
}

/* Hero Carousel Styles */
.hero-carousel {
  position: relative;
}

.hero-slide {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.8s ease-in-out, visibility 0.8s ease-in-out;
}

.hero-slide.active {
  opacity: 1;
  visibility: visible;
}

.carousel-indicator {
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.5);
}

.carousel-indicator.active {
  width: 2rem;
  background-color: white;
}

/* Hero Section Background Colors */
.hero-section-bg {
  background: linear-gradient(to right, #0f172a, #1e293b); /* slate-900 to slate-800 - default */
}

.hero-section-bg.bg-slate {
  background: linear-gradient(to right, #0f172a, #1e293b); /* slate-900 to slate-800 */
}

.hero-section-bg.bg-blue {
  background: linear-gradient(to right, #1e3a8a, #1e40af); /* blue-900 to blue-800 */
}

.hero-section-bg.bg-indigo {
  background: linear-gradient(to right, #312e81, #3730a3); /* indigo-900 to indigo-800 */
}

.hero-section-bg.bg-purple {
  background: linear-gradient(to right, #581c87, #6b21a8); /* purple-900 to purple-800 */
}

.hero-section-bg.bg-teal {
  background: linear-gradient(to right, #134e4a, #155e75); /* teal-900 to teal-800 */
}

.hero-section-bg.bg-emerald {
  background: linear-gradient(to right, #064e3b, #065f46); /* emerald-900 to emerald-800 */
}

.hero-section-bg.bg-cyan {
  background: linear-gradient(to right, #164e63, #155e75); /* cyan-900 to cyan-800 */
}