/* Responsive Styles */

/* Extra Small Devices (< 576px) */
@media (max-width: 576px) {
    html {
      font-size: 56.25%; /* 9px = 1rem */
    }
  
    .section-header h2 {
      font-size: 2.8rem;
    }
  
    .hero-content h1 {
      font-size: 3.6rem;
    }
  
    .hero-content h2 {
      font-size: 2rem;
    }
  
    .contact-card {
      flex-direction: column;
    }
  
    .contact-icon {
      margin-right: 0;
      margin-bottom: var(--spacing-sm);
    }
  
    .services-grid {
      grid-template-columns: 1fr;
    }
  }
  
  /* Small Devices (576px - 768px) */
  @media (min-width: 576px) and (max-width: 768px) {
    html {
      font-size: 58.75%; /* 9.4px = 1rem */
    }
  
    .services-grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }
  
  /* Medium Devices (768px - 992px) */
  @media (min-width: 768px) and (max-width: 992px) {
    .services-grid {
      grid-template-columns: repeat(3, 1fr);
    }
  }
  
  /* Large Devices (992px - 1200px) */
  @media (min-width: 992px) and (max-width: 1200px) {
    .services-grid {
      grid-template-columns: repeat(4, 1fr);
    }
  }
  
  /* Global Mobile-First Styles */
  @media (max-width: 768px) {
    .section-padding {
      padding: var(--spacing-lg) 0;
    }
  
    .vision-mission-container, 
    .team-grid, 
    .about-content, 
    .contact-container {
      gap: var(--spacing-md);
    }
  
    .about-content {
      flex-direction: column;
    }
  
    .benefits-list li {
      align-items: flex-start;
    }
  
    .benefits-list li svg {
      margin-top: 0.3rem;
    }
  
    .footer-content {
      flex-direction: column;
      gap: var(--spacing-md);
    }
  }
  
  /* Tablet Styles */
  @media (min-width: 768px) and (max-width: 992px) {
    .hero-content h1 {
      font-size: 4.2rem;
    }
  
    .team-img-container {
      height: 20rem;
    }
  }
  
  /* Landscape Phone Styles */
  @media (max-width: 768px) and (orientation: landscape) {
    .hero-section {
      height: auto;
      min-height: 100vh;
      padding: 12rem 0 var(--spacing-lg);
    }
  
    .team-img-container {
      height: 18rem;
    }
  }
  
  /* High Resolution Displays */
  @media (min-width: 1400px) {
    html {
      font-size: 68.75%; /* 11px = 1rem */
    }
  
    .container {
      max-width: 140rem;
    }
  
    .services-grid {
      grid-template-columns: repeat(4, 1fr);
    }
  
    .team-img-container {
      height: 28rem;
    }
  }
  
  /* Print Styles */
  @media print {
    .hero-section,
    .footer,
    .contact-form-container {
      display: none;
    }
  
    .container {
      width: 100%;
      max-width: 100%;
      padding: 0;
    }
  
    body {
      font-size: 12pt;
      line-height: 1.4;
      color: #000;
    }
  
    a {
      text-decoration: none;
      color: #000;
    }
  
    .section-padding {
      padding: 1cm 0;
    }
  
    .section-header h2 {
      font-size: 18pt;
      color: #000;
    }
  }