.oceana-slider { position: relative; inline-size: 100%; overflow: hidden; min-block-size: 500px; background: #e6eded; }
.oceana-slider__slides { position: relative; inline-size: 100%; min-block-size: inherit; }
.oceana-slide { position: relative; inline-size: 100%; min-block-size: 500px; block-size: calc(100vh - 114px); }
.oceana-slide[hidden] { display: none !important; }
.oceana-slide__image { display: block; position: absolute; inset: 0; inline-size: 100%; block-size: 100%; object-fit: cover; }
.oceana-slide__caption { position: absolute; inset: 0; display: flex; align-items: center; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.4); }
.oceana-slide__caption > .oceana-container { inline-size: 100%; text-align: center; }
.oceana-slide__caption h2 { font-size: clamp(1.6rem, 2.8vw, 2.5rem); font-weight: 400; line-height: 1.2; color: #fff; max-inline-size: 1000px; margin-inline: auto; overflow-wrap: anywhere; }
.oceana-slider__arrow { position: absolute; top: 50%; transform: translateY(-50%); inline-size: 54px; block-size: 54px; border: 0; background: rgba(0,0,0,.12); color: #fff; font-size: 2.5rem; cursor: pointer; z-index: 2; }
.oceana-slider__prev { left: 20px; }.oceana-slider__next { right: 20px; }
.oceana-slider__dots { position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); display: flex; gap: 9px; z-index: 2; }
.oceana-slider__dot { inline-size: 10px; block-size: 10px; padding: 0; border: 1px solid #fff; border-radius: 50%; background: transparent; cursor: pointer; }
.oceana-slider__dot.is-active { background: #fff; }
.oceana-slider__pause { position: absolute; right: 20px; bottom: 12px; border: 1px solid rgba(255,255,255,.5); color: #fff; background: rgba(0,0,0,.25); font-size: .8rem; z-index: 2; cursor: pointer; }
.oceana-slider button:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
@media (max-width: 900px) { .oceana-slide { block-size: auto; aspect-ratio: 480 / 510; min-block-size: 450px; } }
@media (max-width: 600px) { .oceana-slider,.oceana-slider__slides,.oceana-slide { min-block-size: 420px; } .oceana-slide { aspect-ratio: 390 / 450; } .oceana-slider__arrow { display: none; } .oceana-slide__caption h2 { font-size: clamp(1.3rem,5vw,2rem); } }
@media (prefers-reduced-motion: reduce) { .oceana-slider * { animation: none !important; transition: none !important; } }