/**
 * Evolvix Clinic — Premium Animation Styles
 */

/* 1. Lenis Smooth Scroll Core Styles */
html.lenis, html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: hidden;
}
.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

/* 2. Elegant Preloader Overlay */
#evolvix-preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #040A1C; /* Matches clinic's dark theme */
  z-index: 99999;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  pointer-events: all;
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.6s;
}

#evolvix-preloader.fade-out {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.preloader-content {
  text-align: center;
  color: var(--color-white, #ffffff);
}

.preloader-logo {
  font-size: 2.5rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  font-family: 'Montserrat', sans-serif;
  margin-bottom: var(--space-xs, 8px);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.preloader-logo-mark {
  color: var(--color-gold, #CFA32B);
  display: inline-block;
}

.preloader-logo-dot {
  color: var(--color-gold, #CFA32B);
}

.preloader-subtitle {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color: rgba(255, 255, 255, 0.6);
  font-family: 'Inter', sans-serif;
}

.preloader-bar-wrap {
  width: 120px;
  height: 2px;
  background: rgba(255, 255, 255, 0.1);
  margin: var(--space-md, 20px) auto 0;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
}

.preloader-bar {
  width: 100%;
  height: 100%;
  background: var(--color-gold, #CFA32B);
  transform: scaleX(0);
  transform-origin: left;
}

/* 3. Ambient Background Glow Blobs */
.bg-glow-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: -2;
}

.bg-glow-blob {
  position: absolute;
  width: 600px;
  height: 600px;
  border-radius: 50%;
  filter: blur(140px);
  opacity: 0.18;
  pointer-events: none;
  mix-blend-mode: screen;
  will-change: transform;
}

.bg-glow-blob-1 {
  background: radial-gradient(circle, rgba(207, 163, 43, 0.3) 0%, rgba(4, 10, 28, 0) 70%);
  top: 10%;
  right: -10%;
}

.bg-glow-blob-2 {
  background: radial-gradient(circle, rgba(46, 92, 219, 0.25) 0%, rgba(4, 10, 28, 0) 70%);
  top: 45%;
  left: -15%;
}

.bg-glow-blob-3 {
  background: radial-gradient(circle, rgba(207, 163, 43, 0.2) 0%, rgba(4, 10, 28, 0) 70%);
  bottom: 15%;
  right: -10%;
}

/* 4. GSAP FOUC Prevention & Animation Initial States */
/* Only hide elements if GSAP is successfully loaded and initialized */
.gsap-loaded .gsap-reveal {
  opacity: 0;
  visibility: hidden;
}

.gsap-loaded .hero-line-span {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
}

.gsap-loaded .hero-line-inner {
  display: inline-block;
  transform: translateY(100%);
}

/* 5. Magnetic Hover Helpers & Micro-interactions */
.btn-evolvix, .evolvix-nav ul li a, .evolvix-logo {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* 6. Sticky Header premium styling updates */
.evolvix-header {
  transition: height 0.3s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.3s cubic-bezier(0.16, 1, 0.3, 1), backdrop-filter 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* 7. Accessibility & Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
  html.lenis, html.lenis body {
    scroll-behavior: smooth !important;
  }
  
  .bg-glow-blob, 
  #evolvix-preloader,
  .preloader-bar-wrap {
    display: none !important;
  }
  
  .gsap-loaded .gsap-reveal {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .gsap-loaded .hero-line-inner {
    transform: none !important;
  }
}