.hero-gallery{position:relative;height:420px;overflow:hidden;isolation:isolate;border-radius:35% 35% 16px 16px;box-shadow:var(--shadow);background:#dcebf3}
.hero-media .hero-gallery img{position:absolute;inset:0;width:100%;height:100%;border-radius:0;box-shadow:none;object-fit:cover;opacity:0;transform:scale(calc(1.045 + var(--hero-scroll,0)*.035)) translateY(calc(var(--hero-scroll,0)*-12px));transition:opacity 1.2s ease,transform 1.3s ease}
.hero-media .hero-gallery img:first-child,.hero-media .hero-gallery img.is-active{opacity:1}
.hero-media .hero-gallery img:first-child:not(.is-active){opacity:0}
.hero-media .hero-gallery img:nth-child(2){object-position:center 42%}
.hero-media .hero-gallery img:nth-child(3){object-position:center 54%}
.hero-gallery:after{content:"";position:absolute;bottom:0;left:0;width:calc(18% + var(--hero-scroll,0)*82%);height:4px;background:#1494e9;box-shadow:0 0 20px #59c7ff;transition:width .12s linear;pointer-events:none}
.hero-dots{position:absolute;right:18px;bottom:22px;display:flex;gap:8px;z-index:3}
.hero-dots button{width:32px;height:32px;padding:0;border:0;border-radius:50%;background:rgba(5,25,42,.65);display:grid;place-items:center;cursor:pointer}
.hero-dots button:after{content:"";width:7px;height:7px;border-radius:50%;background:#fff;opacity:.6}
.hero-dots button[aria-current="true"]{background:#0068bd}
.hero-dots button[aria-current="true"]:after{opacity:1}
.hero-dots button:focus-visible{outline:3px solid #fff;outline-offset:2px}
@media(max-width:900px){.hero-gallery{height:340px}}
@media(max-width:620px){.hero-gallery{height:270px;border-radius:100px 100px 14px 14px}.hero-dots{right:10px;bottom:12px}}
@media(prefers-reduced-motion:reduce){.hero-media .hero-gallery img,.hero-gallery:after{transition:none}.hero-gallery:after{width:18%}}
