.avril-hero__media { position: relative; overflow: hidden; }
.avril-hero-slider { position: absolute; inset: 0; }
.avril-hero-slider__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 620ms cubic-bezier(0.23, 1, 0.32, 1); }
.avril-hero-slider__slide.is-active { opacity: 1; }
.avril-hero-slider__slide img { width: 100%; height: 100%; object-fit: cover; }
.avril-hero-slider__controls { position: absolute; z-index: 2; right: 24px; bottom: 22px; display: flex; align-items: center; gap: 8px; }
.avril-hero-slider__arrow { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; background: rgba(77,68,62,.16); color: #fff; cursor: pointer; font-size: 17px; transition: background-color 180ms cubic-bezier(0.23, 1, 0.32, 1); }
.avril-hero-slider__arrow:hover { background: rgba(77,68,62,.58); }
.avril-hero-slider__dots { display: flex; gap: 6px; margin: 0 5px; }
.avril-hero-slider__dot { width: 6px; height: 6px; padding: 0; border: 1px solid rgba(255,255,255,.88); border-radius: 50%; background: transparent; cursor: pointer; }
.avril-hero-slider__dot.is-active { background: #fff; }
.avril-hero-slider__arrow:focus-visible,.avril-hero-slider__dot:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
@media (max-width: 850px) { .avril-hero-slider__controls { right: 17px; bottom: 16px; } }
@media (prefers-reduced-motion: reduce) { .avril-hero-slider__slide { transition: none; } }