.page-hero {
  border-bottom: 1px solid var(--line);
  padding: 36px 0 26px;
  background: var(--surface-subtle);
}

.page-hero h1 {
  margin: 7px 0;
  color: var(--navy);
  font-size: clamp(31px, 4.2vw, 46px);
  line-height: 1.14;
  letter-spacing: -0.04em;
  overflow-wrap: anywhere;
}

.page-hero p {
  max-width: 760px;
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.65;
}

@media (max-width: 540px) {
  .page-hero {
    padding: 26px 0 22px;
  }

  .page-hero h1 {
    font-size: clamp(29px, 9vw, 38px);
    line-height: 1.15;
  }

  .page-hero p {
    font-size: 16px;
  }
}