.trsa-highlights-slider {
  width: 100%;
  background: var(--trsa-slider-section-bg, #f5f5f7);
  padding: var(--trsa-slider-section-padding, 54px 0 38px);
  overflow: hidden;
}

.trsa-highlights-slider-inner {
  width: 100%;
}

.trsa-highlights-slider-title {
  width: min(100% - 46px, var(--trsa-slider-title-max, 1440px));
  margin: 0 auto var(--trsa-slider-title-gap, 58px);
  color: var(--trsa-slider-section-title-color, #1d1d1f);
  font-size: var(--trsa-slider-title-size, clamp(34px, 4.4vw, 56px));
  line-height: 1.05;
  font-weight: var(--trsa-slider-title-weight, 760);
  letter-spacing: 0;
  text-align: center;
}

.trsa-slider-shell {
  width: 100%;
}

.trsa-slider-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: var(--trsa-slider-card-width, clamp(500px, 39vw, 760px));
  gap: var(--trsa-slider-gap, 32px);
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: var(--trsa-slider-side-pad, 56px);
  padding: 0 var(--trsa-slider-side-pad, 56px) 4px;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.trsa-slider-track::-webkit-scrollbar {
  display: none;
}

.trsa-highlight-card {
  position: relative;
  height: var(--trsa-slide-height, 640px);
  min-height: var(--trsa-slide-min-height, 520px);
  overflow: hidden;
  border-radius: var(--trsa-slide-radius, 40px);
  background: #ffffff;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  transform: translateZ(0);
  cursor: pointer;
}

.trsa-highlight-image {
  --slide-image-x: var(--slide-image-x-desktop, 50%);
  --slide-image-y: var(--slide-image-y-desktop, 50%);
  --slide-image-scale: var(--slide-image-scale-desktop, 1);
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--slide-image-x) var(--slide-image-y);
  opacity: 0.78;
  transform-origin: var(--slide-image-x) var(--slide-image-y);
  transform: scale(calc(var(--slide-image-scale) + 0.018));
  transition: opacity 420ms ease, transform 560ms cubic-bezier(0.2, 0.8, 0.2, 1);
  will-change: opacity, transform;
}

.trsa-highlight-card.is-active .trsa-highlight-image {
  opacity: 1;
  transform: scale(var(--slide-image-scale));
}

.trsa-highlight-gradient {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.32) 0%, rgba(0, 0, 0, 0.08) 38%, rgba(0, 0, 0, 0) 70%);
  pointer-events: none;
}

.trsa-highlight-copy {
  position: absolute;
  z-index: 1;
  left: clamp(26px, 3vw, 42px);
  right: clamp(26px, 3vw, 42px);
  display: grid;
  gap: 12px;
  min-width: 0;
  color: var(--slide-title-color, #000000);
  text-align: var(--slide-text-align, center);
  pointer-events: none;
  opacity: 1;
  --copy-y: 0;
  transform: translate3d(0, var(--copy-y), 0);
  transition: opacity 360ms ease 180ms, transform 460ms cubic-bezier(0.2, 0.8, 0.2, 1) 180ms;
  will-change: opacity, transform;
}

.trsa-slider-track.is-ready .trsa-highlight-copy {
  opacity: 1;
  transform: translate3d(-10px, var(--copy-y), 0);
}

.trsa-highlight-card.is-active.is-revealed .trsa-highlight-copy {
  opacity: 1;
  transform: translate3d(0, var(--copy-y), 0);
}

.trsa-highlight-copy--top-center,
.trsa-highlight-copy--top-left,
.trsa-highlight-copy--top-right {
  top: 72px;
}

.trsa-highlight-copy--center,
.trsa-highlight-copy--center-center {
  top: 50%;
  --copy-y: -50%;
}

.trsa-highlight-copy--bottom-center,
.trsa-highlight-copy--bottom-left,
.trsa-highlight-copy--bottom-right {
  bottom: 72px;
}

.trsa-highlight-copy--top-left,
.trsa-highlight-copy--center-left,
.trsa-highlight-copy--bottom-left {
  text-align: left;
}

.trsa-highlight-copy--top-right,
.trsa-highlight-copy--center-right,
.trsa-highlight-copy--bottom-right {
  text-align: right;
}

.trsa-highlight-copy h2 {
  margin: 0;
  max-width: 100%;
  color: var(--slide-title-color, #000000);
  font-size: var(--slide-title-size, clamp(38px, 4vw, 58px));
  line-height: 1.05;
  font-weight: var(--slide-title-weight, 750);
  letter-spacing: 0;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.trsa-highlight-copy p {
  margin: 0;
  max-width: 100%;
  color: var(--slide-subtitle-color, var(--slide-title-color, #000000));
  font-size: var(--slide-subtitle-size, clamp(20px, 2vw, 26px));
  line-height: 1.2;
  font-weight: var(--slide-subtitle-weight, 650);
  letter-spacing: 0;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.trsa-slider-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  width: max-content;
  min-height: 78px;
  margin: 64px auto 0;
  padding: 18px 28px;
  border-radius: 999px;
  background: rgba(232, 232, 237, 0.92);
}

.trsa-slider-dot {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #727276;
  cursor: pointer;
  transition: width 180ms ease, background-color 180ms ease, opacity 180ms ease, transform 180ms ease;
}

.trsa-slider-dot.is-active {
  width: 44px;
  background: #727276;
  transform: translateZ(0);
}

.trsa-slider-dot:focus-visible {
  outline: 3px solid rgba(0, 113, 227, 0.45);
  outline-offset: 5px;
}

@media (max-width: 700px) {
  .trsa-highlights-slider {
    padding: 38px 0 30px;
  }

  .trsa-highlight-image {
    --slide-image-x: var(--slide-image-x-mobile, var(--slide-image-x-desktop, 50%));
    --slide-image-y: var(--slide-image-y-mobile, var(--slide-image-y-desktop, 50%));
    --slide-image-scale: var(--slide-image-scale-mobile, var(--slide-image-scale-desktop, 1));
  }

  .trsa-highlights-slider-title {
    width: calc(100% - 46px);
    margin-bottom: 34px;
    font-size: var(--trsa-slider-title-size-phone, 40px);
  }

  .trsa-slider-track {
    grid-auto-columns: var(--trsa-slider-card-width-phone, 85vw);
    gap: 24px;
    scroll-padding-inline: 23px;
    padding-inline: 23px;
  }

  .trsa-highlight-card {
    height: var(--trsa-slide-height-phone, min(64vh, 640px));
    min-height: var(--trsa-slide-min-height-phone, 490px);
    border-radius: 34px;
  }

  .trsa-highlight-copy {
    left: 36px;
    right: 36px;
    gap: 10px;
  }

  .trsa-highlight-copy--top-center,
  .trsa-highlight-copy--top-left,
  .trsa-highlight-copy--top-right {
    top: 50px;
  }

  .trsa-highlight-copy--bottom-center,
  .trsa-highlight-copy--bottom-left,
  .trsa-highlight-copy--bottom-right {
    bottom: 44px;
  }

  .trsa-highlight-copy h2 {
    font-size: var(--slide-title-size-phone, clamp(34px, 10vw, 46px));
  }

  .trsa-highlight-copy p {
    max-width: 86%;
    justify-self: center;
    font-size: var(--slide-subtitle-size-phone, clamp(17px, 4.8vw, 21px));
  }

  .trsa-highlight-copy--top-left p,
  .trsa-highlight-copy--center-left p,
  .trsa-highlight-copy--bottom-left p,
  .trsa-highlight-copy--top-right p,
  .trsa-highlight-copy--center-right p,
  .trsa-highlight-copy--bottom-right p {
    justify-self: auto;
  }

  .trsa-slider-indicator {
    min-height: 56px;
    margin-top: 22px;
    padding: 12px 22px;
    gap: 16px;
  }
}

@media (max-width: 390px) {
  .trsa-slider-track {
    grid-auto-columns: var(--trsa-slider-card-width-phone, 85vw);
    gap: 20px;
    padding-inline: 20px;
    scroll-padding-inline: 20px;
  }

  .trsa-slider-indicator {
    gap: 18px;
  }
}

.preview-viewport.mode-phone .trsa-highlights-slider {
  padding: 38px 0 30px;
}

.preview-viewport.mode-phone .trsa-highlight-image {
  --slide-image-x: var(--slide-image-x-mobile, var(--slide-image-x-desktop, 50%));
  --slide-image-y: var(--slide-image-y-mobile, var(--slide-image-y-desktop, 50%));
  --slide-image-scale: var(--slide-image-scale-mobile, var(--slide-image-scale-desktop, 1));
}

.preview-viewport.mode-phone .trsa-highlights-slider-title {
  width: calc(100% - 46px);
  margin-bottom: 34px;
  font-size: var(--trsa-slider-title-size-phone, 40px);
}

.preview-viewport.mode-phone .trsa-slider-track {
  grid-auto-columns: min(85%, 320px);
  gap: 24px;
  scroll-padding-inline: 23px;
  padding-inline: 23px;
}

.preview-viewport.mode-phone .trsa-highlight-card {
  height: var(--trsa-slide-height-phone, min(64vh, 640px));
  min-height: var(--trsa-slide-min-height-phone, 490px);
  border-radius: 34px;
}

.preview-viewport.mode-phone .trsa-highlight-copy {
  left: 36px;
  right: 36px;
  gap: 10px;
}

.preview-viewport.mode-phone .trsa-highlight-copy--top-center,
.preview-viewport.mode-phone .trsa-highlight-copy--top-left,
.preview-viewport.mode-phone .trsa-highlight-copy--top-right {
  top: 50px;
}

.preview-viewport.mode-phone .trsa-highlight-copy--bottom-center,
.preview-viewport.mode-phone .trsa-highlight-copy--bottom-left,
.preview-viewport.mode-phone .trsa-highlight-copy--bottom-right {
  bottom: 44px;
}

.preview-viewport.mode-phone .trsa-highlight-copy h2 {
  font-size: var(--slide-title-size-phone, clamp(34px, 10vw, 46px));
}

.preview-viewport.mode-phone .trsa-highlight-copy p {
  max-width: 86%;
  justify-self: center;
  font-size: var(--slide-subtitle-size-phone, clamp(17px, 4.8vw, 21px));
}

.preview-viewport.mode-phone .trsa-highlight-copy--top-left p,
.preview-viewport.mode-phone .trsa-highlight-copy--center-left p,
.preview-viewport.mode-phone .trsa-highlight-copy--bottom-left p,
.preview-viewport.mode-phone .trsa-highlight-copy--top-right p,
.preview-viewport.mode-phone .trsa-highlight-copy--center-right p,
.preview-viewport.mode-phone .trsa-highlight-copy--bottom-right p {
  justify-self: auto;
}

.preview-viewport.mode-phone .trsa-slider-indicator {
  min-height: 56px;
  margin-top: 22px;
  padding: 12px 22px;
  gap: 16px;
}

@media (prefers-reduced-motion: reduce) {
  .trsa-highlight-image,
  .trsa-highlight-copy,
  .trsa-slider-dot {
    transition: none;
  }

  .trsa-highlight-image,
  .trsa-highlight-card.is-active .trsa-highlight-image {
    transform: scale(var(--slide-image-scale));
  }
}
