/* NA Slider — vanilla CSS, no dependencies. */

.na-slider{position:relative;width:100%;overflow:hidden;background:#000;color:#fff}
.na-slider__viewport{position:relative;width:100%;height:100%}
.na-slider--fullscreen,.na-slider--auto{height:100vh;min-height:400px}
.na-slider--with-offset{height:calc(100vh - var(--na-offset,0px))}
.na-slider--image:not(.na-slider--fullscreen){aspect-ratio:16/9}

.na-slider__slides{list-style:none;margin:0;padding:0;position:relative;width:100%;height:100%}
.na-slider__slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .8s ease;pointer-events:none;display:flex;align-items:center;justify-content:center}
.na-slider__slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:1}

.na-slider__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:0}

.na-slider__overlay{position:relative;z-index:2;text-align:center;max-width:90%;padding:0 1rem;text-shadow:0 2px 6px rgba(0,0,0,.5)}
.na-slider__heading{font-family:Raleway,"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:300;font-size:clamp(28px,5.5vw,64px);line-height:1.15;letter-spacing:0;color:#fff;margin:0 0 1.5rem}
.na-slider__cta{margin-top:1.5rem}

/* --- Navigation --- */
.na-slider__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:40px;height:40px;border:0;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;font-size:24px;line-height:1;cursor:pointer;opacity:0;transition:opacity .3s,background .3s;display:flex;align-items:center;justify-content:center}
.na-slider:hover .na-slider__nav,.na-slider__nav:focus-visible{opacity:1}
.na-slider__nav:hover{background:#000}
.na-slider__nav--prev{left:20px}
.na-slider__nav--next{right:20px}

.na-slider__dots{position:absolute;left:0;right:0;bottom:20px;z-index:5;display:flex;justify-content:center;gap:8px}
.na-slider__dot{width:12px;height:12px;border-radius:50%;border:3px solid #e5e5e5;background:linear-gradient(#999,#e1e1e1);padding:0;cursor:pointer;transition:background .2s,transform .2s}
.na-slider__dot.is-active,.na-slider__dot:hover{background:#666}
.na-slider__dot:focus-visible{outline:2px solid #fff;outline-offset:2px}

/* --- Reduced motion --- */
@media (prefers-reduced-motion:reduce){
    .na-slider__slide{transition:none}
    .na-slider__media[autoplay]{/* let browser honour user preference */}
}

/* --- Small screens --- */
@media (max-width:768px){
    .na-slider__heading{font-size:clamp(22px,7vw,42px)}
    .na-slider__nav{width:32px;height:32px;font-size:20px}
    .na-slider__nav--prev{left:8px}
    .na-slider__nav--next{right:8px}
    .na-slider__dots{bottom:12px}
}