/* Page shells grow on wide/zoomed-out viewports; text and controls retain browser zoom. */
@media (min-width: 1440px) {
  #root section > div.mx-auto[class*="max-w-"],
  #root main > div.mx-auto[class*="max-w-"],
  #root .ifcs-application-stepper,
  #root .ifcs-memberships-footer > div.mx-auto,
  #ifcs-translations .tr-wrap,
  .ifcs-standards .standards-width,
  .ifcs-standards .standards-hero-copy,
  .dup-page .dup-layout,
  .dup-page .dup-hero > div {
    box-sizing: border-box;
    width: 90%;
    max-width: 1800px;
    margin-inline: auto;
  }
  #root section:has(.ifcs-application-panel) > div.mx-auto,
  #root .ifcs-application-stepper {
    max-width: 1440px;
  }
  .dup-page .dup-layout {
    max-width: 1200px;
  }
  #root section > div.mx-auto:has(> article),
  #root section > div.mx-auto:has(> details) {
    max-width: 1200px;
  }
}

/* Background banners must not remain enormous while their text zooms down. */
#root section.relative[class*="vh]"]:not(.tesla-section) {
  box-sizing: border-box;
  height: auto !important;
  min-height: min(60svh, 600px) !important;
  padding-top: calc(var(--ifcs-header-offset, 112px) + 40px);
  padding-bottom: 64px;
}

/* Let content determine height at increased zoom instead of clipping it. */
#ifcs-translations .tr-hero {
  height: auto;
  min-height: min(70svh, 620px);
  padding-top: var(--ifcs-header-offset, 112px);
  padding-bottom: 32px;
}
.dup-page .dup-hero {
  height: auto;
  min-height: min(70svh, 620px);
}
#root section > div.mx-auto,
.dup-page .dup-grid > *,
#ifcs-translations .tr-services > *,
.ifcs-standards .standards-columns > * {
  min-width: 0;
}
#root .ifcs-application-panel :is(input, select, textarea),
.dup-page :is(input, select, textarea) {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
}
#root .ifcs-application-panel :is(button, label),
.dup-page :is(button, label) {
  overflow-wrap: anywhere;
}
@media (max-width: 600px) {
  #root section.relative[class*="vh]"]:not(.tesla-section) {
    padding-bottom: 40px;
  }
}