/* Bright editorial photography: preserve the daylight in the images. */
.hero{background:#f3f5ee;color:var(--green)}
.hero-shade{background:linear-gradient(90deg,rgba(250,251,245,.35),transparent 38%)}
.hero-shade::after{height:165px;background:linear-gradient(180deg,rgba(13,31,23,.24),rgba(13,31,23,.05) 55%,transparent)}
.hero-content{width:30%;left:5%;top:48%;max-width:470px}
.hero h1,.layout-i .hero h1{font-size:clamp(54px,5.2vw,86px);color:var(--green);text-shadow:0 2px 18px #ffffff65}
.hero-content>p:not(.hero-kicker){color:#294939;font-size:clamp(15px,1.2vw,19px);max-width:270px;text-shadow:0 1px 10px #ffffff90}
.hero-kicker{color:var(--green);text-shadow:0 1px 10px #ffffff90}
.hero .button{background:#ffffff75;border-color:#214d35;color:var(--green);gap:20px}.hero .button:hover{background:var(--green);color:white}
.hero-bottom{color:var(--green);text-shadow:0 1px 10px #ffffffb0}
.layout-i .hero-content,.layout-l .hero-content{width:24%;left:4%}
.layout-i .hero h1,.layout-l .hero h1{font-size:clamp(50px,4.5vw,76px)}
@media(max-width:1100px) and (min-width:801px){.hero-content{left:4%;width:31%}.hero h1,.layout-i .hero h1,.layout-l .hero h1{font-size:58px}.hero-content>p:not(.hero-kicker){font-size:15px;max-width:220px}.hero-kicker{font-size:10px}}
@media(max-width:800px){.hero-content,.layout-i .hero-content,.layout-l .hero-content{left:var(--gutter);width:37%}.hero h1,.layout-i .hero h1,.layout-l .hero h1{font-size:56px}.hero-kicker{font-size:10px;letter-spacing:.1em}.hero-photo img{object-position:50% center}.hero-shade{background:linear-gradient(90deg,#fafbf59c,transparent 48%)}}
@media(max-width:520px){.hero,.layout-i .hero{height:740px}.hero-photo{bottom:auto;height:405px}.hero-photo img{object-position:54% center}.hero-shade{background:linear-gradient(0deg,#f3f5ee 0%,#f3f5ee 42%,#f3f5ee00 57%)}.hero-content,.layout-i .hero-content,.layout-l .hero-content{top:auto;bottom:70px;left:var(--gutter);width:calc(100% - var(--gutter)*2);transform:none}.hero h1,.layout-i .hero h1,.layout-l .hero h1{font-size:60px}.hero-content>p:not(.hero-kicker){max-width:280px;font-size:15px}.hero .button{margin-top:23px}.hero-bottom{bottom:22px}}
.site-header nav{color:#fff}
@media(max-width:800px){.site-header nav.open{color:var(--green)}}
/* Keep the whole family and bottle together in narrow-screen headers. */
@media(max-width:520px){.hero,.layout-i .hero{height:690px}.hero-photo{top:95px;height:270px;bottom:auto}.hero-photo img{object-fit:contain;object-position:center top}.hero-shade{background:linear-gradient(0deg,#f3f5ee 0%,#f3f5ee 43%,#f3f5ee00 57%)}.hero-shade::after{background:linear-gradient(180deg,#e7ede34d,transparent)}.hero-content,.layout-i .hero-content,.layout-l .hero-content{bottom:68px}}
@media(min-width:521px) and (max-width:800px){.hero,.layout-i .hero{height:770px;min-height:0}.hero-photo{top:98px;bottom:auto;height:350px}.hero-photo img{object-fit:contain;object-position:center top}.hero-shade{background:linear-gradient(0deg,#f3f5ee 0%,#f3f5ee 39%,#f3f5ee00 51%)}.hero-shade::after{background:linear-gradient(180deg,#e7ede34d,transparent)}.hero-content,.layout-i .hero-content,.layout-l .hero-content{top:auto;bottom:70px;left:var(--gutter);transform:none;width:calc(100% - var(--gutter)*2);max-width:none}.hero h1,.layout-i .hero h1,.layout-l .hero h1{font-size:60px;margin-bottom:16px}.hero-kicker{display:none}.hero .button{margin-top:20px}.hero-bottom{bottom:22px}}
