/* Mobile-specific overrides for screens up to 767.98px */
@media (max-width: 767.98px) {
  /* Adjust base font-size for readability */
  html {
    font-size: 14px;
  }

  /* Full-width containers with side padding */
  .container,
  .container--xl,
  .container--lg,
  .container--md {
    max-width: 100%;
    padding: 0 16px;
  }

  /* Simplify header layout */
  .header__content {
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 0;
  }
  .header__logo-currency {
    margin-bottom: 10px;
  }
  .header__select {
    margin-right: 0;
  }
  .header__right-bar {
    margin-top: 10px;
    width: 100%;
    justify-content: space-between;
  }

  /* Collapse secondary navigation */
  .menu__tabs--md { display: none; }
  .menu__links-label a {
    font-size: 16px;
    padding: 10px 0;
  }

  /* Banner adjustments */
  .home-banner__inner {
    padding: 0;
  }

  /* Buttons become full-width */
  .mx-btn {
    display: block;
    width: 100%;
    padding: 12px;
  }

  /* Datepicker & forms
     stretch to full width */
  .mx-datepicker,
  .mx-input {
    width: 100%;
  }

  /* Footer spacing */
  .footer {
    padding: 20px 0;
  }

  /* Reduce extra margins globally */
  .extra-margin,
  .extra-margin-top,
  .extra-margin-bottom {
    margin: 20px 0;
  }
}