.cc_ygsyvcoo_fZkUvANkgw .hira-us__inner {
  padding-top: 40px;
  padding-bottom: 40px;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 32px;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__title {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--us-title-weight, 800);
  font-size: var(--us-title-size, 48px);
  color: var(--us-title-color, inherit);
  line-height: 0.95;
  letter-spacing: -0.04em;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__tools {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  font-weight: 600;
  font-size: 15px;
  text-decoration: none;
  background: linear-gradient(currentColor, currentColor) left bottom / 0% 1px no-repeat;
  transition: background-size 0.3s ease;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__all:hover {
  background-size: 100% 1px;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__body {
  display: flex;
  gap: 24px;
  align-items: stretch;
}

/* Banner (optional): fixed share of the row, full height of the slider. */
.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner {
  position: relative;
  display: flex;
  align-items: flex-end;
  flex: 0 0 var(--us-banner-w, 28%);
  min-height: 420px;
  overflow: hidden;
  color: var(--us-banner-fg, #fff);
  background: var(--color-accent);
  text-decoration: none;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
}

.cc_ygsyvcoo_fZkUvANkgw a.hira-us__banner:hover .hira-us__banner-img {
  transform: scale(1.03);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(0, 0, 0, var(--us-overlay, 0.3)) 100%);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-copy {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 24px;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-title {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-sub {
  font-size: 15px;
  line-height: 1.4;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  margin-top: 6px;
  padding-bottom: 2px;
  border-bottom: 2px solid currentColor;
  font-weight: 700;
  font-size: 15px;
}

/* Slider: native scroll-snap; the card width follows the visible column count. */
.cc_ygsyvcoo_fZkUvANkgw .hira-us__slider {
  position: relative;
  flex: 1;
  min-width: 0;
}

/* Arrows sit on the product image (top is measured from the first image), only when there
   is more to scroll in that direction. */
.cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow {
  position: absolute;
  top: var(--us-arrow-top, 50%);
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin-top: -22px;
  border: 2px solid var(--color-text);
  border-radius: 50%;
  background: var(--color-bg);
  color: var(--color-text);
  cursor: pointer;
  box-shadow: var(--shadow-lg);
  transition: background-color 0.2s ease, color 0.2s ease;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow.is-prev {
  left: 12px;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow.is-prev .hira-icon {
  transform: rotate(180deg);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow.is-next {
  right: 12px;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow:hover {
  background: var(--color-text);
  color: var(--color-bg);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__track {
  --us-gap: 24px;
  --us-cols-eff: var(--us-cols, 3);
  display: flex;
  min-width: 0;
  gap: var(--us-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__track::-webkit-scrollbar {
  display: none;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__slide {
  flex: 0 0 calc((100% - var(--us-gap) * (var(--us-cols-eff) - 1)) / var(--us-cols-eff));
  min-width: 0;
  scroll-snap-align: start;
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us__empty {
  margin: 0;
  padding: 48px 0;
}

/* Scroll hint: the cards nudge left once and settle back, so the row reads as scrollable. */
.cc_ygsyvcoo_fZkUvANkgw .hira-us__track.is-hinting .hira-us__slide {
  animation: cc_ygsyvcoo_fZkUvANkgw_hiraUsHint 1.2s cubic-bezier(0.45, 0, 0.55, 1) both;
}

@keyframes cc_ygsyvcoo_fZkUvANkgw_hiraUsHint {
  0%,
  100% {
    transform: translateX(0);
  }
  35%,
  55% {
    transform: translateX(-44px);
  }
}

/* Product card overrides, scoped to this section. */
.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__media {
  aspect-ratio: var(--us-img-ar, 1 / 1);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__media img {
  object-fit: var(--us-img-fit, cover);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__name {
  font-size: var(--us-name-size, 17px);
  font-weight: var(--us-name-weight, 600);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__name a:not(:hover), .cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__name-link:not(:hover) {
  color: var(--us-name-color, var(--color-text));
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__chip {
  font-size: var(--us-var-size, 13px);
  font-weight: var(--us-var-weight, 600);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__variant {
  font-size: var(--us-var-size, 14px);
  font-weight: var(--us-var-weight, 400);
  color: var(--us-var-color, var(--color-neutral-700));
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__price {
  font-size: var(--us-price-size, 18px);
  font-weight: var(--us-price-weight, 800);
  color: var(--us-price-color, inherit);
}

.cc_ygsyvcoo_fZkUvANkgw .hira-us .hira-card__old {
  font-size: var(--us-old-size, 13px);
  font-weight: var(--us-old-weight, 400);
  color: var(--us-old-color, var(--color-neutral-700));
}

@media (max-width: 1023px) {
  /* Cards are near full width here: with mandatory snapping any swipe shorter than half a card
     springs back, so short drags never advance. Proximity snaps only when a swipe lands near a card. */
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__track {
    --us-cols-eff: min(var(--us-cols, 3), 3);
    scroll-snap-type: x proximity;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__title {
    font-size: calc(var(--us-title-size, 48px) * 0.8);
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__body {
    flex-direction: column;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__banner {
    flex-basis: auto;
    min-height: 320px;
  }
}

@media (max-width: 767px) {
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__inner {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__title {
    font-size: calc(var(--us-title-size, 48px) * 0.65);
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__track {
    --us-gap: 16px;
    --us-cols-eff: var(--us-cols-m, 1.5);
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow {
    width: 36px;
    height: 36px;
    margin-top: -18px;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow.is-prev {
    left: 6px;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__arrow.is-next {
    right: 6px;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__banner {
    min-height: 260px;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-title {
    font-size: 26px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__track.is-hinting .hira-us__slide {
    animation: none;
  }
  .cc_ygsyvcoo_fZkUvANkgw .hira-us__banner-img {
    transition: none;
  }
}
