/* Custom Design System for RGM Energia Solar - Modern Solar Cyan / Deep Blue Theme */
:root {
  --color-brand-primary: #F59E0B;
  --color-brand-secondary: #FBBF24;
  --color-brand-cyan: #00D2FF;
  --color-brand-blue: #0284C7;
  --color-bg-dark: #07111E;
  --color-bg-surface: #0E2238;
  --color-bg-card: rgba(16, 37, 65, 0.75);
  --color-border-glow: rgba(0, 210, 255, 0.3);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 9px;
}
::-webkit-scrollbar-track {
  background: #07111E;
}
::-webkit-scrollbar-thumb {
  background: #1E3E62;
  border-radius: 5px;
  border: 2px solid #07111E;
}
::-webkit-scrollbar-thumb:hover {
  background: #00D2FF;
}

/* Text Selection */
::selection {
  background: #00D2FF;
  color: #07111E;
}

/* Glassmorphism Header */
.glass-header {
  background: rgba(7, 17, 30, 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(0, 210, 255, 0.15);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.glass-header.scrolled {
  background: rgba(7, 17, 30, 0.98);
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.6), 0 0 20px rgba(0, 210, 255, 0.15);
  border-bottom: 1px solid rgba(0, 210, 255, 0.3);
}

/* Hero Background Slide Transitions */
.hero-slide-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transform: scale(1.08);
  transition: opacity 1.8s cubic-bezier(0.4, 0, 0.2, 1), transform 8s ease-out;
  pointer-events: none;
}
.hero-slide-bg.active {
  opacity: 1;
  transform: scale(1);
  pointer-events: auto;
}

/* Glass Card */
.glass-card {
  background: rgba(14, 34, 58, 0.78);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(0, 210, 255, 0.14);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.glass-card:hover {
  border-color: rgba(0, 210, 255, 0.5);
  box-shadow: 0 15px 35px -10px rgba(0, 210, 255, 0.25), 0 0 25px rgba(245, 158, 11, 0.15);
  transform: translateY(-4px);
}

/* Glowing Neon Borders & Badges */
.glow-gold {
  box-shadow: 0 0 25px rgba(245, 158, 11, 0.35);
}
.glow-cyan {
  box-shadow: 0 0 25px rgba(0, 210, 255, 0.4);
}
.text-glow-gold {
  text-shadow: 0 0 20px rgba(245, 158, 11, 0.6), 0 0 40px rgba(245, 158, 11, 0.3);
}
.text-glow-cyan {
  text-shadow: 0 0 20px rgba(0, 210, 255, 0.6), 0 0 40px rgba(0, 210, 255, 0.3);
}

/* Strong Text Relief for High Readability */
.text-relief {
  text-shadow: 0 4px 25px rgba(0, 0, 0, 0.98), 0 2px 8px rgba(0, 0, 0, 0.95), 0 0 30px rgba(0, 0, 0, 0.9);
}
.text-relief-title {
  text-shadow: 0 5px 30px rgba(0, 0, 0, 1), 0 2px 10px rgba(0, 0, 0, 0.9), 0 0 20px rgba(0, 210, 255, 0.25);
}

/* Primary CTA Button */
.btn-solar {
  background: linear-gradient(135deg, #FBBF24 0%, #F59E0B 50%, #D97706 100%);
  color: #07111E;
  font-weight: 800;
  transition: all 0.35s ease;
  box-shadow: 0 6px 25px rgba(245, 158, 11, 0.45);
  position: relative;
  overflow: hidden;
}
.btn-solar::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -60%;
  width: 40%;
  height: 200%;
  background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.7), rgba(255,255,255,0));
  transform: rotate(30deg);
  transition: all 0.75s ease;
}
.btn-solar:hover::after {
  left: 120%;
}
.btn-solar:hover {
  background: linear-gradient(135deg, #FEF08A 0%, #FBBF24 50%, #EA580C 100%);
  box-shadow: 0 8px 35px rgba(245, 158, 11, 0.7), 0 0 20px rgba(0, 210, 255, 0.4);
  transform: translateY(-2px) scale(1.02);
}

/* Cyan Action Button */
.btn-cyan {
  background: linear-gradient(135deg, #38BDF8 0%, #00D2FF 50%, #0284C7 100%);
  color: #07111E;
  font-weight: 800;
  transition: all 0.35s ease;
  box-shadow: 0 6px 25px rgba(0, 210, 255, 0.4);
}
.btn-cyan:hover {
  background: linear-gradient(135deg, #BAE6FD 0%, #38BDF8 50%, #0369A1 100%);
  box-shadow: 0 8px 35px rgba(0, 210, 255, 0.65);
  transform: translateY(-2px) scale(1.02);
}

/* WhatsApp Floating Button */
.btn-whatsapp-float {
  background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  box-shadow: 0 8px 30px rgba(37, 211, 102, 0.45);
  animation: pulse-whatsapp 2.5s infinite;
}
@keyframes pulse-whatsapp {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(37, 211, 102, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
  }
}

/* Range Slider Styling */
input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  background: #1E3E62;
  height: 8px;
  border-radius: 4px;
  outline: none;
}
input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: linear-gradient(135deg, #00D2FF, #0284C7);
  cursor: pointer;
  box-shadow: 0 0 15px rgba(0, 210, 255, 0.8), 0 0 0 4px rgba(7, 17, 30, 0.9);
  transition: transform 0.15s ease;
}
input[type=range]::-webkit-slider-thumb:hover {
  transform: scale(1.2);
}