/* Shared responsive guardrails for all public pages. */
html {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

body {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: hidden;
}

main,
section,
article,
aside,
header,
footer,
nav,
div,
form,
fieldset {
  min-width: 0;
}

img,
video,
canvas,
svg,
iframe {
  max-width: 100%;
}

iframe {
  width: 100%;
}

input,
select,
textarea,
button {
  max-width: 100%;
}

p,
li,
h1,
h2,
h3,
h4,
h5,
h6,
a,
button,
label,
span {
  overflow-wrap: anywhere;
}

pre,
code {
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

table {
  max-width: 100%;
}

/* The shared mega-menu has desktop-sized panels; keep them inside a phone. */
#ab-nav,
#ab-bar,
#ab-links {
  max-width: 100%;
}

#ab-bar {
  min-width: 0;
}

#ab-logo {
  min-width: 0;
  max-width: 100%;
}

#ab-logo img {
  max-width: 100%;
  height: auto;
}

.ab-panel,
.ab-panel .ab-grid,
.ab-panel .ab-g1,
.ab-panel .ab-g2 {
  max-width: calc(100vw - 24px);
  min-width: 0;
}

.ab-row .rt {
  min-width: 0;
}

/* Flexible inline forms should wrap before their controls become clipped. */
[style*="grid-template-columns:1fr 1fr"],
[style*="grid-template-columns: 1fr 1fr"],
[style*="grid-template-columns:repeat(2,1fr)"],
[style*="grid-template-columns: repeat(2, 1fr)"] {
  min-width: 0;
}

@media (max-width: 760px) {
  [style*="grid-template-columns:1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:repeat(2,1fr)"],
  [style*="grid-template-columns: repeat(2, 1fr)"] {
    grid-template-columns: 1fr !important;
  }

  [style*="min-width:240px"],
  [style*="min-width: 240px"] {
    min-width: 0 !important;
    width: 100%;
  }

  .ab-foot-news,
  .ab-foot-news form {
    width: 100%;
  }

  .ab-foot-news input {
    min-width: 0 !important;
    flex: 1 1 160px;
  }

  .ab-foot-news button {
    flex: 0 1 auto;
  }

  .mline {
    align-items: flex-start;
    flex-wrap: wrap;
  }

  .mline .nm {
    min-width: 0;
    flex: 1 1 140px;
  }

  .mline .leader {
    display: none;
  }

  .mline .pr {
    margin-left: auto;
  }

  .cat-head {
    align-items: flex-start;
    flex-wrap: wrap;
  }
}

@media (max-width: 480px) {
  #ab-bar {
    gap: 6px;
  }

  #ab-logo {
    max-width: calc(100vw - 106px);
  }

  #ab-cta {
    max-width: 100%;
    margin-left: 0;
  }

  .ab-panel {
    width: calc(100vw - 24px);
  }
}