@media (max-width: 820px) {
  .page-hero h1 { font-size: clamp(2.6rem, 10vw, 4rem); }
  .section { padding: 86px 0; }
  .site-nav,
  .main-nav {
    left: 24px;
    right: 24px;
    top: 92px;
  }
}

@media (max-width: 560px) {
  .container { width: min(100% - 28px, 1180px); }
  .site-nav,
  .main-nav {
    left: 14px;
    right: 14px;
    top: 82px;
  }
  .site-nav a,
  .main-nav a {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    font-size: 0.7rem;
  }
  .page-hero { padding-top: 92px; }
  .nav-cta { width: 100%; }
  .cta-inner { padding: 54px 0; }
}