/* Hero Section Opacity Enhancements */

/* Hide old hero background elements */
.animated-background,
.floating-shape,
.particle-container,
.hero-decorations {
  display: none !important;
}

/* Video background styling */
.hero video,
video[id*="hero"],
video[class*="hero"] {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  z-index: 0 !important;
  opacity: 1 !important;
  display: block !important;
}

/* Overlay for contrast between video and content */
.hero-overlay {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background: rgba(0, 0, 0, 0.45) !important;
  z-index: 1 !important;
  pointer-events: none !important;
}

/* Hero canvas element should be behind content */
.hero canvas,
canvas[id*="hero"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

/* Ensure hero section has proper positioning context */
.hero {
  position: relative;
  z-index: 1;
}

/* Hero content with proper z-index stacking */
.hero-content,
.hero-diagonal-content,
.container {
  position: relative;
  z-index: 2 !important;
}

/* Increased hero content background opacity from 0.05 to 0.15 for better visibility */
.hero-content {
  background: rgba(255, 255, 255, 0.15) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

/* Increased page-hero-diagonal background gradient opacity */
.page-hero-diagonal {
  background: linear-gradient(135deg, rgba(64, 224, 208, 0.2) 0%, rgba(32, 178, 170, 0.15) 100%) !important;
  position: relative;
  z-index: 1;
}

/* Increased diagonal overlay opacity from 0.1 to 0.2 */
.page-hero-diagonal::before {
  background: linear-gradient(45deg, transparent 40%, rgba(64, 224, 208, 0.2) 50%, transparent 60%) !important;
}