/* Responsive overrides for main.css */
@media (max-width: 768px) {
  /* Fix header on mobile */
  header {
    height: 70px;
    padding: 0 20px;
    position: fixed;
    width: 100vw;
    box-sizing: border-box;
  }
  
  .logo-nav {
    height: 40px;
  }

  /* Fix hamburger menu width and overflow */
  .mobile-menu {
    top: 70px;
    width: 100vw;
    right: -20px; /* Offset parent padding */
    box-sizing: border-box;
  }
  
  /* Container padding */
  .container {
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
  }

  /* Prevent horizontal scroll */
  body {
    overflow-x: hidden;
    width: 100%;
    position: relative;
  }

  /* Typography tweaks */
  h1 { font-size: 2.2rem; }
  h2 { font-size: 1.8rem; }
  p { font-size: 1rem; }

  /* Footer layout */
  .social {
    gap: 16px;
  }
  
  .social a {
    width: 48px;
    height: 48px;
    font-size: 20px;
  }

  /* Buttons full width on mobile */
  .btn-primary, .btn-secondary {
    width: 100%;
    justify-content: center;
  }
}