/* Match the existing page container; scale the hero UI independently of wide monitors. */
.hero-reference-v36{
  --ref-u:clamp(.65px,calc(100vw / 2172),.86px);
  height:calc(724 * var(--ref-u));
}
/* Keep the entire decorative frame visible when the hero stops growing. */
.hero-reference-v36 .hero-leaves{object-fit:fill}
.hero-reference-v36 .header,
.hero-reference-v36 .hero-content{
  width:calc(100% - 64px);
  max-width:1660px;
  left:0;
  right:0;
  margin-inline:auto;
}
.hero-reference-v36 .hero-copy{left:16px;right:auto}
.hero-reference-v36 .hero-motto{left:auto;right:32px}
@media(max-width:1390px){
  .hero-reference-v36 .header,
  .hero-reference-v36 .hero-content{width:calc(100% - 48px)}
}
@media(max-width:900px) and (min-width:701px){
  .hero-reference-v36{height:430px}
  .hero-reference-v36 .hero-copy{left:16px}
}
@media(max-width:760px){
  .hero-reference-v36 .header,
  .hero-reference-v36 .hero-content{width:calc(100% - 32px)}
}
@media(max-width:700px){
  .hero-reference-v36{--ref-u:1px;height:570px}
  .hero-reference-v36 .hero-copy{left:12px;right:12px}
  .hero-reference-v36 .hero-motto{right:25px}
}
@media(max-width:360px){
  .hero-reference-v36 .header,
  .hero-reference-v36 .hero-content{width:calc(100% - 24px)}
}