/* JJ adaptive layout: presentation only; preserve billing, member state and hero artwork. */
:root { --jj-fluid-max:1560px; --jj-fluid-gutter:clamp(12px,2.4vw,36px); }
html body > .wrap.wrap {
  box-sizing:border-box !important;
  width:100% !important;
  max-width:var(--jj-fluid-max) !important;
  margin-inline:auto !important;
  padding-inline:var(--jj-fluid-gutter) !important;
}
html body > .shell.shell {
  box-sizing:border-box !important;
  width:calc(100% - clamp(24px,4.8vw,72px)) !important;
  max-width:var(--jj-fluid-max) !important;
  margin-inline:auto !important;
}
html body > .wrap.wrap :where(.grid,.cards,.fields,.benefits,.quick,.facts) > *,
html body > .shell.shell :where(.grid,.cards,.fields,.benefits,.quick,.facts) > * {
  min-width:0;
}
html body > .wrap.wrap :where(img,video,iframe),
html body > .shell.shell :where(img,video,iframe) {
  max-width:100%;
}
html body > .wrap.wrap :where(input,textarea,select),
html body > .shell.shell :where(input,textarea,select) {
  min-width:0;
  max-width:100%;
}
@media (min-width:721px) and (max-width:1160px) {
  html body > .wrap.wrap > header,
  html body > .shell.shell > header {
    flex-wrap:wrap;
  }
  html body > .wrap.wrap > header :where(.nav,nav),
  html body > .shell.shell > header :where(.nav,nav) {
    max-width:100%;
    flex-wrap:wrap;
  }
}
@media (max-width:720px) {
  html body > .wrap.wrap {
    width:100% !important;
    max-width:100% !important;
    padding-inline:clamp(12px,3.2vw,18px) !important;
  }
  html body > .shell.shell {
    width:calc(100% - 24px) !important;
    max-width:100% !important;
  }
  html body > .wrap.wrap > header,
  html body > .shell.shell > header {
    min-width:0;
    max-width:100%;
    flex-wrap:wrap;
  }
  html body > .wrap.wrap > header :where(.nav,nav),
  html body > .shell.shell > header :where(.nav,nav) {
    display:flex;
    max-width:100%;
    flex-wrap:wrap;
    gap:6px;
  }
  html body > .wrap.wrap :where(.grid,.cards,.fields),
  html body > .shell.shell :where(.grid,.cards,.fields) {
    grid-template-columns:minmax(0,1fr);
  }
  html body > .wrap.wrap :where(.hero,.section,.card,.term-card),
  html body > .shell.shell :where(.hero,.section,.card,.term-card) {
    min-width:0;
    max-width:100%;
  }
  html body > .wrap.wrap :where(table),
  html body > .shell.shell :where(table) {
    display:block;
    max-width:100%;
    overflow-x:auto;
  }
}
@media (max-width:360px) {
  html body > .wrap.wrap > header :where(.nav,nav) a {
    white-space:normal;
    overflow-wrap:anywhere;
  }
}