.hero{width:100%;min-width:0;height:320px;max-width:none;max-height:none;min-height:0;background:#050505}
.hero-picture{position:absolute;inset:0;z-index:-2}
.hero .hero-photo{position:absolute;inset:50% 0 auto auto;transform:translateY(-50%);width:960px;height:auto;aspect-ratio:3/1;max-width:100%;object-fit:contain;object-position:right center;filter:none;mask-image:linear-gradient(90deg,transparent,rgba(0,0,0,.08) 5%,rgba(0,0,0,.28) 11%,rgba(0,0,0,.58) 18%,rgba(0,0,0,.88) 25%,#000 32%),linear-gradient(180deg,transparent,#000 5%,#000 96%,transparent);mask-composite:intersect}
.hero:after{display:none}
.hero .hero-content{position:relative;margin-left:max(30px,calc((100% - 1740px)/2));padding:0;max-width:32%;height:100%;justify-content:center}
.hero .hero-content h1{width:280px;max-width:100%;margin:0 0 18px;line-height:1;font-size:0}
.hero .hero-logo{width:100%;height:auto;aspect-ratio:640/374;object-fit:contain}
.hero .hero-content>p{max-width:100%;font-size:21px;line-height:1.4;margin:0}
@media(min-width:1600px){.hero{height:360px}.hero .hero-photo{width:1080px}.hero .hero-content h1{width:320px}}
@media(min-width:761px) and (max-width:1100px){.hero{height:280px}.hero .hero-photo{width:840px}.hero .hero-content{max-width:29%;margin-left:24px}.hero .hero-content h1{width:220px}.hero .hero-content>p{font-size:18px}}
@media(max-width:760px){
  .hero{height:auto;aspect-ratio:4/3;min-height:280px;max-height:420px}
  .hero .hero-photo{inset:auto auto 0 50%;transform:translateX(-50%);width:100%;height:auto;max-width:630px;aspect-ratio:3/2;object-position:center bottom;mask-image:linear-gradient(180deg,transparent,rgba(0,0,0,.18) 6%,rgba(0,0,0,.55) 14%,rgba(0,0,0,.88) 22%,#000 29%,#000 96%,transparent)}
  .hero:after{display:none}
  .hero .hero-content{position:absolute;top:12px;left:16px;right:16px;margin:0;padding:0;max-width:none;height:auto;flex-direction:row;align-items:center;justify-content:flex-start;gap:18px}
  .hero .hero-content h1{width:120px;flex:0 0 120px;margin:0}
  .hero .hero-content>p{max-width:156px;font-size:16px;line-height:1.4}
}
@media(min-width:491px) and (max-width:760px){.hero .hero-content h1{width:144px;flex-basis:144px}.hero .hero-content>p{max-width:none;font-size:18px}}
@media(max-width:360px){.hero .hero-content{left:12px;right:12px;gap:14px}.hero .hero-content h1{width:108px;flex-basis:108px}.hero .hero-content>p{font-size:15px}}