/* ===== PRELOADER ===== */
.preloader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--bg-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

.preloader.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.preloader-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}

.preloader-pulse {
  width: 120px;
  height: 40px;
}

.preloader-pulse path {
  stroke: var(--accent-primary);
  stroke-width: 2;
  fill: none;
  stroke-dasharray: 300;
  stroke-dashoffset: 300;
  animation: preloader-draw 1.5s ease forwards;
}

.preloader-text {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text-primary);
  opacity: 0;
  animation: preloader-fade 0.5s ease 0.8s forwards;
}

@keyframes preloader-draw {
  to { stroke-dashoffset: 0; }
}

@keyframes preloader-fade {
  to { opacity: 1; }
}

/* ===== SCROLL REVEAL BASE STATES ===== */
[data-animate] {
  opacity: 0;
  transition: opacity var(--transition-slow), transform var(--transition-slow);
  will-change: opacity, transform;
}

[data-animate="fade-up"] {
  transform: translateY(30px);
}

[data-animate="fade-in"] {
  transform: none;
}

[data-animate="slide-left"] {
  transform: translateX(-50px);
}

[data-animate="slide-right"] {
  transform: translateX(50px);
}

[data-animate="scale-in"] {
  transform: scale(0.9);
}

[data-animate].animated {
  opacity: 1;
  transform: none;
}

/* ===== HERO ANIMATIONS ===== */
@keyframes hero-badge-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes hero-title-in {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes hero-subtitle-in {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes hero-buttons-in {
  from { opacity: 0; transform: translateY(15px); }
  to { opacity: 1; transform: translateY(0); }
}

.hero-badge { animation: hero-badge-in 0.6s ease 0.3s both; }
.hero-title { animation: hero-title-in 0.7s ease 0.5s both; }
.hero-subtitle { animation: hero-subtitle-in 0.6s ease 0.8s both; }
.hero-buttons { animation: hero-buttons-in 0.6s ease 1s both; }
.hero-trust { animation: hero-subtitle-in 0.6s ease 1.2s both; }

/* ===== PULSE GLOW (LOGO) ===== */
@keyframes pulse-glow {
  0%, 100% { filter: drop-shadow(0 0 4px rgba(59,130,246,0.4)); }
  50% { filter: drop-shadow(0 0 12px rgba(59,130,246,0.7)); }
}

.logo-icon {
  animation: pulse-glow 3s ease-in-out infinite;
}

/* ===== FLOATING ORBS ===== */
@keyframes float-slow {
  0%, 100% { transform: translate(0, 0); }
  33% { transform: translate(30px, -20px); }
  66% { transform: translate(-15px, 15px); }
}

@keyframes float-slow-reverse {
  0%, 100% { transform: translate(0, 0); }
  33% { transform: translate(-20px, 25px); }
  66% { transform: translate(25px, -10px); }
}

.hero-orb-1 {
  animation: float-slow 8s ease-in-out infinite;
}

.hero-orb-2 {
  animation: float-slow-reverse 10s ease-in-out infinite;
}

/* ===== SCROLL INDICATOR ===== */
@keyframes bounce-down {
  0%, 100% { transform: translateY(0); opacity: 0.6; }
  50% { transform: translateY(10px); opacity: 1; }
}

.scroll-indicator {
  animation: bounce-down 2s ease-in-out infinite;
}

/* ===== COUNTER ANIMATION ===== */
.counter-value {
  display: inline-block;
  font-family: var(--font-mono);
  font-weight: 700;
  background: var(--accent-gradient);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ===== TRUST LOGOS SCROLL ===== */
@keyframes scroll-logos {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.trust-track {
  animation: scroll-logos 20s linear infinite;
}

/* ===== NAV LINK UNDERLINE ===== */
.nav-link {
  position: relative;
}

.nav-link::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 50%;
  width: 0;
  height: 2px;
  background: var(--accent-gradient);
  transition: width var(--transition-base), left var(--transition-base);
  border-radius: 1px;
}

.nav-link:hover::after,
.nav-link.active::after {
  width: 100%;
  left: 0;
}

/* ===== CARD HOVER EFFECTS ===== */
.feature-icon-wrap {
  transition: box-shadow var(--transition-base);
}

.glass-card:hover .feature-icon-wrap {
  box-shadow: 0 0 20px var(--accent-glow);
}

/* ===== FAQ CHEVRON ===== */
.faq-chevron {
  transition: transform var(--transition-base);
}

.faq-item.open .faq-chevron {
  transform: rotate(180deg);
}

/* ===== PRICING TOGGLE ===== */
.toggle-slider {
  transition: transform var(--transition-base);
}

.toggle-input:checked ~ .toggle-slider {
  transform: translateX(100%);
}

/* ===== DASHBOARD GAUGES ===== */
.gauge-circle {
  transition: stroke-dashoffset 1s ease;
}

/* ===== TESTIMONIAL CAROUSEL ===== */
@keyframes carousel-dot-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.2); }
}

/* ===== TIMELINE LINE FILL ===== */
@keyframes line-fill {
  from { height: 0; }
  to { height: 100%; }
}

/* ===== INTEGRATION ICONS ===== */
.integration-card .integration-icon {
  filter: grayscale(0.8) brightness(0.8);
  transition: filter var(--transition-base);
}

.integration-card:hover .integration-icon {
  filter: grayscale(0) brightness(1);
}

/* ===== FORM SUCCESS ===== */
@keyframes check-draw {
  to { stroke-dashoffset: 0; }
}

.form-success-icon path {
  stroke-dasharray: 40;
  stroke-dashoffset: 40;
  animation: check-draw 0.5s ease forwards;
}

/* ===== MOBILE MENU ===== */
@keyframes menu-slide-in {
  from { opacity: 0; transform: translateX(20px); }
  to { opacity: 1; transform: translateX(0); }
}

.mobile-menu-link {
  opacity: 0;
}

.mobile-menu.open .mobile-menu-link {
  animation: menu-slide-in 0.3s ease forwards;
}

.mobile-menu.open .mobile-menu-link:nth-child(1) { animation-delay: 0.05s; }
.mobile-menu.open .mobile-menu-link:nth-child(2) { animation-delay: 0.1s; }
.mobile-menu.open .mobile-menu-link:nth-child(3) { animation-delay: 0.15s; }
.mobile-menu.open .mobile-menu-link:nth-child(4) { animation-delay: 0.2s; }
.mobile-menu.open .mobile-menu-link:nth-child(5) { animation-delay: 0.25s; }
.mobile-menu.open .mobile-menu-link:nth-child(6) { animation-delay: 0.3s; }
.mobile-menu.open .mobile-menu-link:nth-child(7) { animation-delay: 0.35s; }
.mobile-menu.open .mobile-menu-link:nth-child(8) { animation-delay: 0.4s; }

/* ===== STATUS BLINK ===== */
@keyframes status-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.status-dot.online {
  background: var(--success);
  box-shadow: 0 0 6px rgba(34, 197, 94, 0.5);
  animation: status-pulse 2s ease-in-out infinite;
}

.status-dot.warning {
  background: var(--warning);
  box-shadow: 0 0 6px rgba(245, 158, 11, 0.5);
}

/* ===== SPARKLINE ===== */
@keyframes sparkline-draw {
  from { stroke-dashoffset: 100; }
  to { stroke-dashoffset: 0; }
}