.brand{position:relative;display:block;width:145px;height:48px;overflow:hidden;flex:0 0 auto;mix-blend-mode:normal;background:#f3e3d2;border:1px solid #515b4126;border-radius:6px;isolation:isolate}
.brand>img{position:absolute;width:113%;height:auto;max-width:none;left:50%;top:50%;transform:translate(-50%,-50%);display:block}
footer .brand{width:132px;height:44px}
@media(max-width:600px){header .brand{width:114px;height:39px}footer .brand{width:114px;height:39px}}

.hero>picture{display:contents}.hero>picture>img{transform:none}
/* Keep the navigation above the scene so cameras never sit behind its CTA. */
header{position:relative;background:#f3e3d2}
.hero{height:calc(100svh - 98px);min-height:710px;max-height:900px}
.hero>picture>img{object-position:center top}
.hero-copy{top:22%}
@media(max-width:600px){.hero{height:calc(100svh - 76px);min-height:670px;max-height:764px}.hero-copy{top:27px}.hero>picture>img{height:55%;object-position:right bottom}}
@media(max-width:360px){.hero-copy{top:19px}.hero>picture>img{height:53%}}

/* A shared hero canvas, with clear space for navigation above the equipment. */
header:not(.sub-header){position:absolute;background:transparent;border-bottom:0}
.hero{height:100svh;min-height:808px;max-height:998px}
.hero>picture>img{position:absolute;top:80px;left:0;width:100%;height:calc(100% - 80px);object-position:center top;mask-image:linear-gradient(to bottom,transparent,#000 3%,#000 90%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 3%,#000 90%,transparent)}
.hero-copy{top:calc(22% + 50px)}
@media(max-width:600px){.hero{height:100svh;min-height:746px;max-height:840px}.hero-copy{top:103px}.hero>picture>img{top:auto;bottom:22px;height:50%;object-position:right bottom}html[lang=en] .hero{min-height:776px}}
@media(max-width:360px){.hero-copy{top:95px}.hero>picture>img{height:48%}}