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

@media (max-width: 1024px) {
  .section,
  .wrap,
  .footer-inner,
  .footer-bottom,
  .contact-shell {
    width: min(100% - 32px, 1180px);
  }

  .hero h1,
  h1 {
    overflow-wrap: anywhere;
  }

  .grid,
  .deliverables,
  .service-nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .signal-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .signal:nth-child(2) {
    border-right: 0;
  }
}

@media (max-width: 640px) {
  .section,
  .wrap,
  .footer-inner,
  .footer-bottom,
  .contact-shell,
  .hero-inner {
    width: min(100% - 24px, 1180px);
  }

  .grid,
  .deliverables,
  .service-nav,
  .signal-row {
    grid-template-columns: 1fr;
  }

  .signal {
    min-height: 148px;
    border-right: 0;
  }

  .signal strong {
    font-size: clamp(48px, 18vw, 72px);
  }

  .hero-actions {
    display: grid;
  }

  .button,
  .button.light,
  .button.secondary {
    width: 100%;
  }

  input,
  select,
  textarea,
  button {
    font-size: 16px;
  }
}