/* TravelAddon hero slider — unmistakable carousel, mobile-first, no 100vw */
.sr-slider {
  --sr-orange: #e77600;
  --sr-orange-deep: #b85a00; /* WCAG AA white text */
  --sr-cta: #36d2d3;
  --sr-ink: #0f1114;
  --sr-h: clamp(520px, 92vh, 920px); /* PC hero closer to full viewport */
  position: relative;
  isolation: isolate;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0;
  min-height: var(--sr-h);
  overflow: hidden;
  background: var(--sr-ink);
  color: #fff;
  z-index: 1;
}

.sr-slider *,
.sr-slider *::before,
.sr-slider *::after { box-sizing: border-box; }

.sr-slider:focus-visible {
  outline: 3px solid var(--sr-cta);
  outline-offset: 2px;
}

.sr-slider__track {
  position: relative;
  width: 100%;
  min-height: var(--sr-h);
}

.sr-slider__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  min-height: var(--sr-h);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  display: grid;
  /* SR-106: bottom-align title/CTA so more of the image stays visible */
  place-items: end center;
  align-content: end;
  padding: 4rem 1.25rem 5.75rem;
}

.sr-slider[data-animation="1"] .sr-slider__slide {
  transition: opacity 0.6s ease, visibility 0.6s ease;
}
.sr-slider[data-animation="0"] .sr-slider__slide {
  transition: none;
}

/* Active slide is relative so height never collapses (even without JS) */
.sr-slider__slide.is-active {
  position: relative;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 1;
}

.sr-slider__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: 0;
  transform: none;
}

/* ken-burns disabled for LCP/INP (Stitch/Pro Max: avoid costly scroll/parallax effects) */

.sr-slider__slide::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(15,17,20,.35) 0%, rgba(15,17,20,.55) 45%, rgba(15,17,20,.78) 100%);
  pointer-events: none;
}

.sr-slider__inner {
  position: relative;
  z-index: 2;
  width: min(860px, 100%);
  margin: 0 auto;
  text-align: center;
  overflow-wrap: anywhere;
}

.sr-slider__kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 0.85rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  backdrop-filter: blur(6px);
}

.sr-slider__title {
  margin: 0 0 0.8rem;
  color: #fff !important;
  font-size: clamp(1.45rem, 5vw, 3rem);
  line-height: 1.15;
  font-weight: 700;
  text-shadow: 0 2px 16px rgba(0,0,0,.4);
}

.sr-slider__text {
  margin: 0 auto 1.5rem;
  max-width: min(38rem, 100%);
  width: 100%;
  color: rgba(247,247,247,.95) !important;
  font-size: clamp(0.92rem, 3.2vw, 1.15rem);
  line-height: 1.55;
  text-shadow: 0 1px 6px rgba(0,0,0,.35);
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* SR-104: hide supporting copy by default (CSF sr_slider_show_description) */
.sr-slider[data-show-desc="0"] .sr-slider__text {
  display: none !important;
}

.sr-slider[data-show-desc="0"] .sr-slider__title {
  margin-bottom: 1.25rem;
}

.sr-slider__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  justify-content: center;
}

/* SR-148/149: one left column + live-like inset (~18.5%) */
.sr-slider[data-align="left"] .sr-slider__slide {
  place-items: end start;
  justify-items: start;
  padding-left: clamp(1.25rem, 18.5%, 17rem);
  padding-right: 1.5rem;
}
.sr-slider[data-align="left"] .sr-slider__inner {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  margin: 0;
  padding: 0;
  width: min(52rem, 100%);
}
.sr-slider[data-align="left"] .sr-slider__kicker {
  display: flex;
  margin: 0 0 0.85rem;
  align-self: flex-start;
}
.sr-slider[data-align="left"] .sr-slider__title,
.sr-slider[data-align="left"] .sr-slider__text,
.sr-slider[data-align="left"] .sr-slider__actions {
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  text-align: left;
  align-self: flex-start;
  max-width: 100%;
  width: auto;
}
.sr-slider[data-align="left"] .sr-slider__title {
  margin-bottom: 0.8rem;
}
.sr-slider[data-align="left"] .sr-slider__text {
  margin-bottom: 1.5rem;
}
.sr-slider[data-align="left"] .sr-slider__actions {
  justify-content: flex-start;
}

.sr-slider__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0.85rem 1.45rem;
  border-radius: 10px;
  font-weight: 700;
  text-decoration: none !important;
  border: none;
  cursor: pointer;
  font-size: 1rem;
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.sr-slider__btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
}

.sr-slider__btn--primary {
  background: var(--sr-orange-deep);
  color: #fff;
}
.sr-slider__btn--primary:hover {
  background: #9a4c00;
  color: #fff;
}
.sr-slider__btn--secondary {
  background: var(--sr-cta);
  color: var(--sr-ink);
}
.sr-slider__btn--secondary:hover {
  background: #2bb8b9;
  color: var(--sr-ink);
}

/* Desktop: full-circle arrows (equal w/h, radius 50%) — SR-108 */
.sr-slider__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 6;
  box-sizing: border-box;
  width: var(--sr-arrow-size, 56px);
  height: var(--sr-arrow-size, 56px);
  min-width: var(--sr-arrow-size, 56px);
  min-height: var(--sr-arrow-size, 56px);
  aspect-ratio: 1 / 1;
  padding: 0;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.42);
  background: rgba(15,17,20,.55);
  color: #fff;
  cursor: pointer;
  backdrop-filter: blur(8px);
  font-size: 1.4rem;
  line-height: 1;
  display: grid;
  place-items: center;
  pointer-events: auto;
  flex-shrink: 0;
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
}

/* Beat theme/Astra button padding + 999px radius — true equal circles on desktop */
html body.home .sr-slider__nav,
html body.home .sr-slider .sr-slider__arrow,
html body .sr-slider__nav {
  box-sizing: border-box !important;
  width: var(--sr-arrow-size, 56px) !important;
  height: var(--sr-arrow-size, 56px) !important;
  min-width: var(--sr-arrow-size, 56px) !important;
  min-height: var(--sr-arrow-size, 56px) !important;
  max-width: var(--sr-arrow-size, 56px) !important;
  max-height: var(--sr-arrow-size, 56px) !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  border-radius: 50% !important;
}

.sr-slider__nav:hover,
.sr-slider__nav:focus-visible {
  background: rgba(54,210,211,.95);
  color: #0f1114;
  outline: none;
  transform: translateY(-50%) scale(1.05);
}

.sr-slider__btn--prev { left: var(--sr-arrow-offset, 24px); }
.sr-slider__btn--next { right: var(--sr-arrow-offset, 24px); }

.sr-slider[data-arrows="inside"] .sr-slider__btn--prev { left: max(1.5rem, calc(50% - 26rem)); }
.sr-slider[data-arrows="inside"] .sr-slider__btn--next { right: max(1.5rem, calc(50% - 26rem)); }
.sr-slider[data-arrows="bottom"] .sr-slider__nav {
  top: auto;
  bottom: 1.35rem;
  transform: none;
}
.sr-slider[data-arrows="bottom"] .sr-slider__nav:hover,
.sr-slider[data-arrows="bottom"] .sr-slider__nav:focus-visible {
  transform: scale(1.05);
}

.sr-slider__footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.65rem;
  padding: 0 1rem 1.1rem;
  pointer-events: none;
}

.sr-slider__chrome {
  display: contents;
}

.sr-slider__pager {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.55rem;
  pointer-events: none;
}

.sr-slider__dots {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  pointer-events: auto;
}

.sr-slider__dot {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  border: 0;
  padding: 0;
  background: rgba(255,255,255,.4);
  cursor: pointer;
}

.sr-slider__dot.is-active {
  background: var(--sr-cta);
  transform: scale(1.2);
  box-shadow: 0 0 0 3px rgba(54,210,211,.25);
}

.sr-slider__count {
  pointer-events: none;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #fff;
  background: rgba(15,17,20,.5);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: 0.25rem 0.7rem;
  backdrop-filter: blur(6px);
}

.sr-slider__progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: rgba(255,255,255,.15);
  z-index: 5;
  overflow: hidden;
  pointer-events: none;
}

.sr-slider__progress > span {
  display: block;
  height: 100%;
  width: 0%;
  background: linear-gradient(90deg, var(--sr-orange), var(--sr-cta));
  transition: width .1s linear;
}

.sr-slider[data-sr-playing="1"] .sr-slider__progress > span {
  animation: srProgress var(--sr-interval, 5s) linear forwards;
}

/* Hover/focus: freeze progress (and Ken Burns) in place — do not restart */
.sr-slider[data-sr-paused="1"] .sr-slider__progress > span,
.sr-slider[data-sr-paused="1"] .sr-slider__slide.is-active .sr-slider__bg {
  animation-play-state: paused !important;
}

@keyframes srProgress {
  from { width: 0%; }
  to { width: 100%; }
}

/* —— Desktop tall hero —— */
@media (min-width: 921px) {
  .sr-slider { --sr-h: min(100vh, 960px); min-height: min(100vh, 960px); }
  .sr-slider__track,
  .sr-slider__slide { min-height: inherit; }
  .sr-slider__slide { padding: 4.5rem 1.5rem 6.25rem; }
  .sr-slider[data-align="left"] .sr-slider__slide {
    padding-top: 4.5rem;
    padding-right: 1.5rem;
    padding-bottom: 6.25rem;
  }
}

/* SR-106: hide prev/next on mobile — swipe + autoplay remain */
@media (max-width: 767px) {
  .sr-slider__nav {
    display: none !important;
  }
}

/* —— Mobile: bottom-aligned copy, tap-friendly CTAs, dots only —— */
@media (max-width: 640px) {
  .sr-slider { --sr-h: min(82vh, 620px); }

  .sr-slider__slide {
    /* Bottom-aligned copy; pad clears dots/progress (arrows hidden) */
    padding: 3.5rem 1.15rem 5.5rem;
    place-items: end center;
    align-content: end;
  }
  .sr-slider[data-align="left"] .sr-slider__slide {
    place-items: end start;
    justify-items: start;
    padding-left: clamp(1.25rem, 18.5%, 17rem);
  }
  .sr-slider[data-align="left"] .sr-slider__actions {
    margin: 0;
    margin-right: auto;
    align-self: flex-start;
  }
  .sr-slider[data-align="left"] .sr-slider__inner {
    padding: 0;
  }

  .sr-slider__inner {
    width: 100%;
    padding: 0 0.15rem;
  }

  .sr-slider__kicker { margin-bottom: 0.75rem; }

  .sr-slider__title {
    margin-bottom: 0.7rem;
    font-size: clamp(1.35rem, 6.2vw, 1.85rem);
  }

  .sr-slider__text {
    margin: 0 auto 1.35rem;
    padding: 0 0.1rem;
    font-size: 0.98rem;
    line-height: 1.55;
  }

  .sr-slider__actions {
    flex-direction: column;
    align-items: stretch;
    gap: 1rem;
    width: 100%;
    max-width: 22rem;
    margin: 0 auto;
  }

  .sr-slider__btn {
    width: 100%;
    min-height: 52px;
    padding: 0.95rem 1.2rem;
    font-size: 1.02rem;
    border-radius: 12px;
  }

  /* Dots/count only — no side gutter for arrows */
  .sr-slider__footer {
    padding: 0 1rem max(0.85rem, env(safe-area-inset-bottom));
    gap: 0.45rem;
  }

  .sr-slider__chrome {
    display: contents;
  }

  .sr-slider__pager {
    width: 100%;
    gap: 0.45rem;
  }

  .sr-slider__dots { gap: 0.45rem; }
  .sr-slider__dot {
    width: 12px;
    height: 12px;
  }
}

@media (max-width: 380px) {
  .sr-slider__slide { padding-left: 0.9rem; padding-right: 0.9rem; padding-bottom: 5.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .sr-slider__slide,
  .sr-slider__bg,
  .sr-slider__btn { transition: none; }
  .sr-slider[data-sr-playing="1"] .sr-slider__progress > span { animation: none; width: 100%; }
}


/* Pro Max/Stitch speed pass */
.sr-slider__btn,
.sr-slider__nav,
.sr-slider__dot { cursor: pointer; }
.sr-slider__btn:focus-visible,
.sr-slider__nav:focus-visible,
.sr-slider__dot:focus-visible {
  outline: 3px solid #1ebbf0;
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .sr-slider__slide.is-active .sr-slider__bg { transform: none !important; }
}


/* Pro Max pressed feedback */
.sr-slider__btn:active {
  transform: translateY(1px) scale(0.98);
  box-shadow: none;
}
.sr-slider__nav:active {
  transform: translateY(-50%) scale(0.96);
  background: rgba(54,210,211,.95);
}
.sr-slider__dot:active { transform: scale(0.9); }
@media (prefers-reduced-motion: reduce) {
  .sr-slider__btn:active,
  .sr-slider__nav:active,
  .sr-slider__dot:active { transform: none; }
}

/* SR-112 / SR-148 Ken Burns: body.sr-hero-zoom or slider data-animation=1 */
body.sr-hero-zoom .sr-slider__slide.is-active .sr-slider__media img,
body.sr-hero-zoom .sr-slider__slide.is-active .sr-slider__bg,
body.sr-hero-zoom .sr-slider__slide.is-active [data-sr-slide-bg],
.sr-slider[data-animation="1"] .sr-slider__slide.is-active .sr-slider__bg {
  animation: sr-hero-kenburns 16s ease-out forwards;
  transform-origin: center center;
}
.sr-slider[data-animation="0"] .sr-slider__slide.is-active .sr-slider__bg {
  animation: none !important;
  transform: none !important;
}
@keyframes sr-hero-kenburns {
  from { transform: scale(1); }
  to { transform: scale(1.05); }
}
@media (prefers-reduced-motion: reduce) {
  body.sr-hero-zoom .sr-slider__slide.is-active .sr-slider__media img,
  body.sr-hero-zoom .sr-slider__slide.is-active .sr-slider__bg,
  body.sr-hero-zoom .sr-slider__slide.is-active [data-sr-slide-bg],
  .sr-slider[data-animation="1"] .sr-slider__slide.is-active .sr-slider__bg {
    animation: none;
  }
}
