/* ========================================
   FULLSCREEN SECTIONS ENHANCEMENT
   Additional styles for 100vh sections
   ======================================== */

/* Ensure all section content is properly contained */
.section > *:not(.section__heading) {
  max-width: var(--max-width);
  width: 100%;
}

/* Content wrapper for better control */
.section__content {
  width: 100%;
  max-width: var(--max-width);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* Hero content optimization for 100vh */
.hero__content {
  width: 100%;
  max-width: 900px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* Ensure content doesn't overflow */
  max-height: calc(100vh - 140px); /* Account for header and padding */
  overflow: visible;
}

/* Hero metrics - ensure they fit */
.hero__metrics {
  /* Ensure metrics don't get cut off */
  flex-shrink: 0;
}

/* Ensure grids don't overflow */
.intro__grid,
.services__grid,
.technologies__grid,
.testimonials__grid,
.clients__grid {
  width: 100%;
}

/* Contact section adjustments */
.contact__container {
  width: 100%;
  max-width: 1200px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

/* Prevent content overflow on small screens */
@media (max-height: 700px) {
  .section {
    /* Allow scrolling on short screens */
    min-height: 100vh;
    height: auto;
  }

  .hero {
    min-height: 100vh;
    height: auto;
  }
}

/* Landscape mobile optimization */
@media (max-width: 768px) and (max-height: 500px) {
  .section,
  .hero {
    height: auto;
    min-height: 100vh;
    padding: 40px 20px;
  }

  .section__heading {
    margin-bottom: 20px;
  }

  .hero__content {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}

/* Ensure footer doesn't interfere with fullscreen layout */
.footer {
  height: auto;
  min-height: auto;
  scroll-snap-align: none; /* Disabled - JS controls snap */
}