/* Mobile-first responsive design improvements */
@media (max-width: 768px) {
  /* Improve tap targets for mobile */
  .button, .link, [role="button"] {
    min-height: 44px;
    min-width: 44px;
  }
  
  /* Optimize font sizes for mobile */
  h1 {
    font-size: 1.8rem !important;
  }
  
  h2 {
    font-size: 1.5rem !important;
  }
  
  h3 {
    font-size: 1.3rem !important;
  }
  
  /* Improve spacing on mobile */
  .container {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  
  /* Ensure content doesn't overflow viewport */
  img, video, iframe {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* Performance optimizations */
.lazy-load {
  transition: opacity 0.3s;
}

/* Print styles for better accessibility */
@media print {
  body {
    font-size: 12pt;
    color: #000;
    background: #fff;
  }
  
  a {
    color: #000;
    text-decoration: underline;
  }
  
  .no-print {
    display: none !important;
  }
}

/* High contrast mode for accessibility */
@media (prefers-contrast: high) {
  body {
    color: #000;
    background: #fff;
  }
  
  a, button {
    color: #00f;
    text-decoration: underline;
  }
}

/* Reduced motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}