html,
body {
  max-width: 100%;
  overflow-x: clip;
}

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

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

pre,
table {
  max-width: 100%;
  overflow: auto;
}

@media (max-width: 600px) {
  .shell {
    width: min(calc(100% - 28px), 1160px);
  }

  p,
  a,
  button,
  label,
  span {
    overflow-wrap: anywhere;
  }

  .hero h1,
  .section-title {
    max-width: 100%;
    font-size: clamp(28px, 9vw, 42px);
    letter-spacing: -0.055em;
    overflow-wrap: normal;
    word-break: normal;
  }

  .result-band {
    padding: 24px;
  }

  .result-band strong {
    max-width: 100%;
    font-size: clamp(24px, 8vw, 34px);
    overflow-wrap: normal;
    word-break: normal;
  }
}

@media (max-width: 380px) {
  .hero h1,
  .section-title {
    font-size: 29px;
  }

  .result-band strong {
    font-size: 25px;
  }
}