/* Full-width five-slide banner. Reference proportions: desktop 2125×740,
   mobile 1122×1402, with the layout switching at 749px. */
.hero-carousel{position:relative;isolation:isolate;width:100%;aspect-ratio:2125/740;overflow:hidden;background:#100507;color:#fff;touch-action:pan-y}
.hero-panel{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .5s ease,visibility 0s .5s;z-index:0}
.hero-panel.is-active{opacity:1;visibility:visible;transition:opacity .5s ease,visibility 0s;z-index:1}
.hero-panel-link{display:block;position:relative;width:100%;height:100%;overflow:hidden;color:#fff}
.hero-panel-link picture{display:block;width:100%;height:100%}
.hero-image{display:block;width:100%;height:100%;object-fit:contain}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:44px;height:44px;border-radius:50%;background:#0005;backdrop-filter:blur(8px);color:white;display:grid;place-items:center;opacity:0;transition:opacity .2s,background .2s;padding:0}
.hero-arrow .icon{width:18px;height:18px;stroke-width:2.5}
.hero-prev{left:16px}.hero-next{right:16px}
.hero-carousel:hover .hero-arrow,.hero-carousel:focus-within .hero-arrow{opacity:1}
.hero-arrow:hover{background:#0008}
.hero-dots{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:10px;padding:8px 16px;background:#0005;backdrop-filter:blur(8px);border-radius:999px}
.hero-dot{position:relative;width:10px;height:10px;padding:0;border-radius:50%;background:#ffffff73;transition:background .25s,transform .25s}
.hero-dot::before{content:'';position:absolute;inset:-8px -5px}
.hero-dot[aria-pressed=true]{background:#fff;transform:scale(1.25)}
.hero-dot:hover{background:#ffffffb3}
.hero-progress{position:absolute;bottom:0;left:0;width:100%;height:3px;z-index:3;background:#ffffff26}
.hero-progress-bar{display:block;width:100%;height:100%;transform:scaleX(0);transform-origin:left;background:#ffffffb3}
.hero-pause{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);z-index:4}
.hero-pause:focus-visible{clip-path:none;width:auto;height:auto;top:12px;left:12px;padding:10px 16px;border-radius:8px;background:#100507;color:#fff}
@media(max-width:749px){
  .hero-carousel{aspect-ratio:1122/1402}
  .hero-dots{bottom:14px;gap:8px;padding:6px 14px}
  .hero-dot{width:8px;height:8px}
  .hero-dot::before{inset:-8px -4px}
  .hero-arrow{width:36px;height:36px;opacity:1}
  .hero-prev{left:10px}.hero-next{right:10px}
}
@media(prefers-reduced-motion:reduce){.hero-panel,.hero-dot,.hero-arrow{transition:none}.hero-progress{display:none}}