/* ==========================================================================
   Lead Launch Pty Ltd - Custom CSS & Keyframe Animations
   Tagline: Connecting Students with Top Universities Worldwide
   Aesthetic: SaaS + Overseas Education Lead Generation (LeadGenz Inspired)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Poppins:wght@400;500;600;700;800;900&display=swap');

:root {
  --color-primary: #042546;
  --color-primary-dark: #021528;
  --color-secondary: #00A3FF;
  --color-secondary-hover: #0084FF;
  --color-accent: #00A3FF;
  --color-gold: #FFC107;
  --color-bg: #F8FBFF;
  --color-text: #1F2937;
  --font-heading: 'Poppins', sans-serif;
  --font-body: 'Inter', sans-serif;
}

body {
  font-family: var(--font-body);
  color: var(--color-text);
  background-color: var(--color-bg);
  overflow-x: hidden;
  scroll-behavior: smooth;
}

h1, h2, h3, h4, h5, h6, .font-heading {
  font-family: var(--font-heading);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #042546;
}
::-webkit-scrollbar-thumb {
  background: #00A3FF;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #0084FF;
}

/* Sticky Header Styling */
header#main-header {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

header#main-header.header-scrolled {
  box-shadow: 0 10px 30px -10px rgba(4, 37, 70, 0.2);
}

/* Glassmorphism Styles */
.glass-card {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.8);
  box-shadow: 0 20px 40px -15px rgba(4, 37, 70, 0.08);
}

.glass-card-dark {
  background: rgba(4, 37, 70, 0.88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.12);
}

.glass-floating-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.9);
  box-shadow: 0 15px 35px rgba(4, 37, 70, 0.15);
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
}

.glass-floating-card:hover {
  transform: translateY(-6px) scale(1.02);
  box-shadow: 0 22px 45px rgba(4, 37, 70, 0.25);
}

/* Keyframe Animations */
@keyframes float {
  0%, 100% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-12px) rotate(1deg); }
}

@keyframes floatSlow {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-18px); }
}

@keyframes pulseGlow {
  0%, 100% { transform: scale(1); opacity: 0.4; }
  50% { transform: scale(1.12); opacity: 0.7; }
}

@keyframes spinSlow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.animate-float {
  animation: float 5s ease-in-out infinite;
}

.animate-float-slow {
  animation: floatSlow 7s ease-in-out infinite;
}

.animate-pulse-glow {
  animation: pulseGlow 4s ease-in-out infinite;
}

.animate-spin-slow {
  animation: spinSlow 25s linear infinite;
}

/* Background Grid Pattern */
.bg-grid-pattern {
  background-image: radial-gradient(rgba(4, 37, 70, 0.12) 1px, transparent 1px);
  background-size: 32px 32px;
}

/* Custom Buttons */
.btn-primary {
  background-color: #00A3FF;
  color: #FFFFFF;
  font-weight: 600;
  border-radius: 9999px;
  padding: 0.875rem 2rem;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 10px 25px -5px rgba(0, 163, 255, 0.4);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-primary:hover {
  background-color: #0084FF;
  transform: translateY(-2px);
  box-shadow: 0 15px 30px -5px rgba(0, 163, 255, 0.55);
}

.btn-secondary {
  background-color: #042546;
  color: #FFFFFF;
  font-weight: 600;
  border-radius: 9999px;
  padding: 0.875rem 2rem;
  transition: all 0.3s ease;
  box-shadow: 0 10px 20px -5px rgba(4, 37, 70, 0.35);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.btn-secondary:hover {
  background-color: #00A3FF;
  transform: translateY(-2px);
  box-shadow: 0 12px 25px -5px rgba(4, 37, 70, 0.5);
}

.btn-outline {
  background-color: #FFFFFF;
  color: #042546;
  border: 2px solid #042546;
  font-weight: 600;
  border-radius: 9999px;
  padding: 0.875rem 2rem;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 15px rgba(4, 37, 70, 0.08);
}

.btn-outline:hover {
  background-color: #042546;
  color: #FFFFFF;
  transform: translateY(-2px);
  box-shadow: 0 10px 25px -5px rgba(4, 37, 70, 0.3);
}

/* Hover Lift Effect */
.hover-lift {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
}
.hover-lift:hover {
  transform: translateY(-8px);
  box-shadow: 0 20px 35px -10px rgba(15, 76, 129, 0.15);
}

/* Swiper Custom Pagination & Navigation */
.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: #0F4C81;
  opacity: 0.3;
  transition: all 0.3s ease;
}

.swiper-pagination-bullet-active {
  width: 28px;
  border-radius: 5px;
  background: #00A3FF !important;
  opacity: 1;
}

.swiper-pagination-hero .swiper-pagination-bullet {
  background: #FFFFFF !important;
  opacity: 0.4;
}

.swiper-pagination-hero .swiper-pagination-bullet-active {
  width: 36px;
  background: #00A3FF !important;
  opacity: 1;
}


/* Gradient Borders */
.gradient-border {
  position: relative;
  border-radius: 1.5rem;
  background: linear-gradient(135deg, #FFFFFF, #F8FBFF);
}
.gradient-border::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: 1.6rem;
  padding: 2px;
  background: linear-gradient(135deg, rgba(15, 76, 129, 0.3), rgba(0, 163, 255, 0.3), rgba(255, 193, 7, 0.3));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

/* FAQ Accordion Styling (Single Open Item Pattern) */
.faq-item {
  transition: all 0.3s ease;
}

.faq-accordion-header {
  cursor: pointer;
  user-select: none;
}

.faq-accordion-body {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-item.active {
  border-color: #00A3FF !important;
  box-shadow: 0 10px 25px -5px rgba(0, 163, 255, 0.15) !important;
  background-color: #FFFFFF !important;
}

.faq-item.active .faq-accordion-body {
  max-height: 400px;
  opacity: 1;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.faq-item.active .faq-icon {
  transform: rotate(180deg);
  color: #00A3FF;
  background-color: rgba(0, 163, 255, 0.12);
}

/* Custom Keyframe Micro-Animations for Sections */
@keyframes floatSlow {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-8px); }
}

@keyframes pulseGlow {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 0.9; transform: scale(1.05); }
}

@keyframes shimmerEffect {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.animate-float {
  animation: floatSlow 4s ease-in-out infinite;
}

.animate-pulse-glow {
  animation: pulseGlow 3s ease-in-out infinite;
}

/* Section Card Hover Micro-Animations */
.hover-lift-lg {
  transition: transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1), box-shadow 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.hover-lift-lg:hover {
  transform: translateY(-10px) scale(1.01);
  box-shadow: 0 25px 50px -12px rgba(4, 37, 70, 0.15);
}