.hero{grid-template-columns:minmax(0,630px) minmax(0,1fr);background:linear-gradient(90deg,rgba(3,13,26,.98) 0%,rgba(3,13,26,.91) 27%,rgba(3,13,26,.57) 55%,rgba(3,13,26,.16) 100%),url('/assets/harness-hero-desktop.webp') 65% center/cover no-repeat}
.hero-grid{opacity:.06}
.hero-art-space{min-height:300px}
.hero-copy{position:relative;z-index:1}
@media(max-width:900px){.hero{grid-template-columns:1fr;background:linear-gradient(90deg,rgba(3,13,26,.95),rgba(3,13,26,.48)),url('/assets/harness-hero-desktop.webp') 70% center/cover no-repeat}.hero-art-space{display:none}}
@media(max-width:700px){.hero{display:block;min-height:660px;padding-bottom:5rem;background:linear-gradient(180deg,rgba(3,13,26,.94) 0%,rgba(3,13,26,.82) 45%,rgba(3,13,26,.42) 100%),url('/assets/harness-hero-desktop.webp') 69% center/cover no-repeat}.hero-copy{display:block}.hero-actions{margin-top:2.3rem}}

.hero h1 em{color:#bddbf0;-webkit-text-stroke:0}
@media(min-width:901px){.hero{background-size:cover,100% auto;background-position:center,center center;background-color:#061426}}
@media(max-width:700px){
  .hero{min-height:0;padding-bottom:2rem;background:#061426}
  .hero-art-space{display:block;min-height:0;width:100%;aspect-ratio:3 / 2;margin:2rem auto 0;background:url('/assets/harness-hero-mobile.webp') center / contain no-repeat}
}
@media(max-width:700px){
  .hero-art-space{
    width:calc(100% + 2.5rem);
    margin:1rem -1.25rem -1rem;
    -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 14%,#000 78%,transparent 100%);
    mask-image:linear-gradient(to bottom,transparent 0%,#000 14%,#000 78%,transparent 100%);
  }
}