main-hero{background-color:var(--background-color, var(--colour-navy));border-radius:var(--border-radius-lg)}main-hero.bg-blue{background:var(--colour-blue-gradient)}main-hero{position:relative;overflow:hidden;display:block}main-hero .background-graphic{transition:opacity .5s ease}main-hero .background-graphic img{aspect-ratio:1!important}main-hero .background-graphic.bg-left{position:absolute;max-width:24rem;opacity:.5;bottom:4rem;left:-8rem;transform:translateY(var(--hero-scroll, 0px)) rotate(-45deg);filter:saturate(0) blur(12px)}main-hero .background-gradient{height:100%;width:100%;position:absolute;top:0;right:0;z-index:1}main-hero .hero-grid{display:grid;grid-template-columns:100%;gap:2rem;align-items:flex-end;position:relative;z-index:2;padding:2rem}main-hero .hero-grid>.content{color:var(--text-colour, var(--colour-white));display:flex;flex-direction:column;align-items:flex-start;gap:1rem;padding:2rem;max-width:80ch}main-hero .hero-grid>.content .u-kicker{color:inherit;border-color:currentColor}main-hero .hero-grid>.content .section-heading h1,main-hero .hero-grid>.content .section-heading h2,main-hero .hero-grid>.content .section-heading h3,main-hero .hero-grid>.content .section-heading h4,main-hero .hero-grid>.content .section-heading h5{margin-bottom:0}main-hero .hero-grid>.content .u-btn{width:-webkit-fit-content;width:fit-content}main-hero .hero-grid .media{position:relative}main-hero .hero-grid .media video,main-hero .hero-grid .media img{aspect-ratio:5/4;width:100%;object-fit:cover;border-radius:var(--border-radius-md)}main-hero .hero-grid .media .hero-product-btn{height:3rem;width:3rem;padding:1rem}main-hero .hero-grid .media .snippet-card-product-alt{position:absolute;left:1rem;bottom:1rem}main-hero .hero-grid .media .hero-product-btn{display:none;position:absolute;bottom:1rem;right:1rem;gap:.5rem;align-items:center}main-hero .hero-grid .media .hero-product-btn svg{width:1.25rem;height:1.25rem;flex-shrink:0}main-hero .hero-grid .media .background-graphic{position:absolute}main-hero .hero-grid .media .background-graphic.image-left{max-width:7rem;left:-4rem;bottom:20rem;transform:translateY(var(--hero-scroll, 0px)) rotate(-25deg)}main-hero .hero-grid .media .background-graphic.image-right{max-width:9rem;right:-1.5rem;bottom:2rem;transform:translateY(var(--hero-scroll, 0px)) rotate(30deg)}@media(min-width:992px){main-hero .hero-grid{grid-template-columns:1fr 1fr;gap:5rem}}@media(max-width:991.98px){main-hero .background-graphic.bg-left{max-width:18rem}main-hero .hero-grid .hero-text{display:none}main-hero .hero-grid>.content{padding:1rem}main-hero .hero-grid>.content .section-heading h1,main-hero .hero-grid>.content .section-heading h2,main-hero .hero-grid>.content .section-heading h3,main-hero .hero-grid>.content .section-heading h4,main-hero .hero-grid>.content .section-heading h5{font-size:1.5rem}main-hero .hero-grid .media .snippet-card-product-alt{display:none}main-hero .hero-grid .media .hero-product-btn{display:flex}main-hero .hero-grid .media .background-graphic.image-left{transform:translateY(var(--hero-scroll, 0px)) scale(.5);left:-3rem;bottom:0}main-hero .hero-grid .media .background-graphic.image-right{transform:translateY(var(--hero-scroll, 0px)) scale(.5);right:-4rem}}
