/* =========================================== */
/* CONTACT PAGE HERO SECTION STYLES */
/* Extracted from contact.html inline styles */
/* =========================================== */

/* Fix circular fade getting cut off - match index.html hero structure */
.contact-hero {
  overflow: visible !important;
  position: relative !important;
  min-height: 100vh !important;
  display: block !important; /* Override flex from bundle */
  align-items: unset !important; /* Override align-items from bundle */
}

.contact-hero .hero-content {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  text-align: center !important;
  z-index: 10 !important;
  width: 100% !important;
  max-width: 1200px !important;
  overflow: visible !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Ensure parallax class doesn't override centering */
.contact-hero .hero-content.parallax-very-slow {
  transform: translate(-50%, -50%) !important;
}

/* Circular Dark Fade behind text - specific for contact-hero */
.contact-hero .hero-content .hero-text-fade {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: clamp(600px, 80vw, 1200px) !important;
  height: clamp(600px, 80vh, 1200px) !important;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.6) 10%, rgba(0, 0, 0, 0.45) 20%, rgba(0, 0, 0, 0.3) 30%, rgba(0, 0, 0, 0.2) 38%, rgba(0, 0, 0, 0.12) 45%, rgba(0, 0, 0, 0.06) 52%, rgba(0, 0, 0, 0.03) 60%, rgba(0, 0, 0, 0.015) 70%, rgba(0, 0, 0, 0.005) 80%, rgba(0, 0, 0, 0) 90%, rgba(0, 0, 0, 0) 95%, transparent 100%) !important;
  border-radius: 50% !important;
  z-index: -1 !important;
  pointer-events: none !important;
  filter: blur(8px) !important;
  -webkit-filter: blur(8px) !important;
  mask-image: radial-gradient(ellipse at center, black 0%, black 85%, transparent 100%) !important;
  -webkit-mask-image: radial-gradient(ellipse at center, black 0%, black 85%, transparent 100%) !important;
  background-clip: padding-box !important;
  overflow: visible !important;
  box-shadow: none !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.contact-hero .hero-content .container {
  width: 100% !important;
  max-width: 1200px !important;
  margin: 0 auto !important;
  padding: 0 1rem !important;
}

.contact-hero .hero-content .row {
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.contact-hero .hero-content .col-lg-8 {
  overflow: visible !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  text-align: center !important;
  margin: 0 auto !important;
}
