.hero__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.hero__track::-webkit-scrollbar{display:none}
.hero__panel{position:relative;flex:0 0 100%;scroll-snap-align:start;min-height:400px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:32px var(--gutter) 48px}
.hero__arc{left:-70px;bottom:-70px;width:200px;height:200px;border-width:28px}
.hero__img{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);width:40%;height:260px;border-radius:var(--r-card);overflow:hidden}
.hero__img img{width:100%;height:100%;object-fit:contain}
a.hero__img{display:block}
a.hero__img img{transition:transform .2s var(--ease)}
a.hero__img:hover img{transform:scale(1.03)}
.hero__copy{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;max-width:58%}
.hero__eyebrow{border:1px solid currentColor;border-radius:var(--r-pill);padding:5px 10px;font-size:11px}
.hero__title{font-size:26px;line-height:1.1;overflow-wrap:break-word}
.hero__text{font-size:13px;max-width:30ch}
.hero__dots{position:absolute;left:0;right:0;bottom:6px;color:var(--cream)}
.hero{position:relative}
@media(min-width:990px){
  .hero__track{display:grid;grid-template-columns:repeat(2,1fr);overflow:visible;height:470px}
  .hero__panel{min-height:0;justify-content:center;padding:0 var(--gutter);flex:none}
  .hero__arc{width:260px;height:260px;left:-90px;bottom:-90px;border-width:34px}
  .hero__copy{max-width:none;gap:12px}
  .hero__img{width:300px;height:340px}
  .hero__eyebrow{padding:6px 12px;font-size:inherit}
  .hero__title{font-size:44px;max-width:8ch}
  .hero__text{font-size:16px;max-width:26ch}
  .hero__dots{display:none}
}