/* Extra breathing room from the browser edge on desktop */

@media only screen and (min-width: 1200px) {
  .large-container {
    padding-left: 40px;
    padding-right: 40px;
  }
}

/* Extra breathing room from the browser edge on mobile */

@media only screen and (max-width: 767px) {
  .large-container {
    padding-left: 20px;
    padding-right: 20px;
  }

  .main-footer .footer-logo img {
    width: auto;
    height: clamp(32px, 6vw, 44px);
  }
}

/* Logo: unconstrained natively (2103x748px), so it renders oversized on
   desktop where no other rule caps it. Scale it fluidly instead of a
   single fixed size, scoped to desktop only. */

@media only screen and (min-width: 1200px) {
  .main-header .logo-box img,
  .sticky-header .logo-box img {
    width: auto;
    height: clamp(40px, 3vw, 58px);
  }

  .main-footer .footer-logo img {
    width: auto;
    height: clamp(36px, 2.6vw, 50px);
  }
}