/* One viewport for every page introduction, including the site header. */
:root{--banner-chrome-height:158px}
body :is(.hero,.services-intro,.about-hero,.contact-hero,.project-hero,.shop-hero,.subservice-hero){box-sizing:border-box;min-height:calc(100vh - var(--banner-chrome-height));min-height:calc(100svh - var(--banner-chrome-height));display:flex;align-items:center;padding-block:40px}
body :is(.services-intro,.about-hero,.contact-hero,.project-hero,.shop-hero,.subservice-hero)>.wrap{width:min(1280px,88%)}
@media(max-width:760px){
:root{--banner-chrome-height:145px}
body :is(.hero,.services-intro,.about-hero,.contact-hero,.project-hero,.shop-hero,.subservice-hero){padding-block:28px}
body .hero{align-items:flex-start;padding-bottom:180px}
body .hero-copy>h1{margin-block:16px}
body .hero-copy>p{margin-block:18px;font-size:16px;line-height:1.6}
body .hero-note{margin-top:16px}
body .shop-hero{padding-bottom:180px}
}