/* 
  Gradient Backgrounds for Xploit Security Landing Page
  Author: Development Team
  Version: 1.0
*/

/* Gradient Background Classes */

.bg-gradient-blue {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
}

.bg-gradient-blue-light {
  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
}

.bg-gradient-blue-dark {
  background: linear-gradient(135deg, #0f172a 0%, #020617 100%);
}

.bg-gradient-blue-navy {
  background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
}

.bg-gradient-red-blue {
  background: linear-gradient(135deg, #ef4444 0%, #1d4ed8 100%);
}

.bg-gradient-orange-blue {
  background: linear-gradient(135deg, #f97316 0%, #1e3a8a 100%);
}

/* Hero Section Gradient */
.hero-gradient-background {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
  position: relative;
}

.hero-gradient-background::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at 30% 30%, rgba(59, 130, 246, 0.15) 0%, rgba(15, 23, 42, 0) 60%);
  z-index: 1;
}

.hero-gradient-background::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70%;
  background: radial-gradient(circle at 70% 90%, rgba(59, 130, 246, 0.1) 0%, rgba(15, 23, 42, 0) 60%);
  z-index: 1;
}

/* CTA Section Gradient */
.cta-gradient-background {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
  position: relative;
}

.cta-gradient-background::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at 70% 30%, rgba(59, 130, 246, 0.15) 0%, rgba(15, 23, 42, 0) 60%);
  z-index: 1;
}

/* Services Section Gradient */
.services-gradient-background {
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
}

/* Footer Gradient */
.footer-gradient-background {
  background: linear-gradient(to bottom, #0f172a 0%, #020617 100%);
}

/* Expertise Card Gradient */
.expertise-card-gradient {
  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
}

/* Overlay Gradients */
.overlay-gradient-dark {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
}

.overlay-gradient-blue {
  background: linear-gradient(to top, rgba(15, 23, 42, 0.9) 0%, rgba(15, 23, 42, 0) 100%);
}

/* Badge Gradients */
.badge-gradient-primary {
  background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
}

.badge-gradient-light {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%);
}

.bg-gradient-signal {
  background: linear-gradient(135deg, var(--color-signal) 0%, #e62e01 100%);
}

.bg-gradient-signal-blue {
  background: linear-gradient(135deg, var(--color-signal) 0%, var(--color-navy) 100%);
}

/* Card Hover Effects with Gradients */
.gradient-card-hover {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.gradient-card-hover::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(29, 78, 216, 0.1) 100%);
  transform: translateY(100%);
  transition: transform var(--transition-normal);
  z-index: -1;
}

.gradient-card-hover:hover::before {
  transform: translateY(0);
}
