/*
One-page specific overrides.
Since there's no hero photo, the hero content uses its own wide
wrapper (not the site's standard 1180px container) so it can
genuinely stretch across the full width of the section. Sizing uses
plain fixed values with breakpoints (not clamp()/vw) for guaranteed
support everywhere.
*/
.hero{
  padding: 140px 0;
}
.hero-wide{
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  padding: 0 60px;
  margin: 0 auto;
}
.hero-no-photo{
  grid-template-columns: 1fr;
  text-align: center;
}
.hero-no-photo .eyebrow{
  font-size: 1.4rem;
}
.hero-no-photo h1{
  font-size: 6.4rem;
  white-space: nowrap;
  margin-bottom: .25em;
}
.hero-no-photo h1 .accent{
  display: inline;
}
.hero-no-photo .lede{
  font-size: 2rem;
}
.hero-no-photo .desc{
  font-size: 1.4rem;
  line-height: 1.6;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.hero-no-photo .hero-actions{
  justify-content: center;
  margin-top: 2.8rem;
  gap: 26px;
}
.hero-no-photo .btn{
  padding: 24px 52px;
  font-size: 1.15rem;
}
.hero-no-photo .btn svg{
  width: 22px;
  height: 22px;
}

/* Scale down for smaller screens so the one-line heading still fits */
@media (max-width: 1200px){
  .hero-no-photo h1{ font-size: 4.8rem; }
  .hero-no-photo .lede{ font-size: 1.6rem; }
  .hero-no-photo .desc{ font-size: 1.2rem; }
}
@media (max-width: 800px){
  .hero-wide{ padding: 0 24px; }
  .hero-no-photo h1{ font-size: 3rem; white-space: normal; }
  .hero-no-photo .lede{ font-size: 1.3rem; }
  .hero-no-photo .desc{ font-size: 1.05rem; }
  .hero-no-photo .btn{ padding: 18px 32px; font-size: 1rem; }
}