/* Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Outfit:wght@400;500;600;700&display=swap');

/* Base Typography */
body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 400;
}

/* Headings Typography */
h1, h2, h3, h4, h5, h6,
.logo-text,
.nav-link,
.cta-button {
    font-family: 'Outfit', system-ui, -apple-system, sans-serif;
}

/* Specific Typography Adjustments */
h1 {
    font-weight: 700;
    letter-spacing: -0.025em;
}

h2 {
    font-weight: 600;
    letter-spacing: -0.025em;
}

h3 {
    font-weight: 600;
}

/* Enhanced Readability for Body Text */
p {
    line-height: 1.7;
}

/* Navigation and Buttons */
.nav-link,
.cta-button {
    font-weight: 500;
}

/* Service Cards */
.service-title {
    font-family: 'Outfit', system-ui, -apple-system, sans-serif;
    font-weight: 600;
}

/* Stats and Numbers */
.stat-number {
    font-family: 'Outfit', system-ui, -apple-system, sans-serif;
    font-weight: 700;
}

/* Form Labels and Inputs */
label {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 500;
}

input, 
textarea {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

/* Footer */
.footer-heading {
    font-family: 'Outfit', system-ui, -apple-system, sans-serif;
    font-weight: 600;
}

#main-header.sticky {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(8px);
    box-shadow: 0 1px 15px rgba(0, 0, 0, 0.04);
}
/* Mobile-first responsive styles */
@media (max-width: 768px) {
    .hero-content {
        padding-top: 5rem;
    }
}

/* Ensure text is visible on dark backgrounds */
.text-white {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

#menu-backdrop {
    background-color: rgba(0, 0, 0, 0.5);
}

/* Scroll to Top Button */
#scrollToTop {
    opacity: 0;
    visibility: hidden;
    transform: scale(0);
    transition: all 0.3s ease-in-out;
}

#scrollToTop.visible {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
}

#scrollToTop:hover {
    transform: scale(1.1);
}

#scrollToTop:active {
    transform: scale(0.9);
}

.swiper-pagination {
  position: relative;
  bottom: 0;
}

.swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background-color: #CBD5E0;
  opacity: 1;
  margin: 0 4px;
}

.swiper-pagination-bullet-active {
  background-color: #2563EB;
}