.cc_kbd4ii47_xNBnTELo6R .spot {
  display: grid;
  grid-template-columns: minmax(0, 900fr) minmax(0, 444fr);
  gap: var(--space-panel);
  width: 100%;
  padding: var(--space-section) var(--space-page) 0;
  box-sizing: border-box;
  background: var(--c-bg);
  color: var(--c-text);
}

.cc_kbd4ii47_xNBnTELo6R .spot--right .spot__media {
  order: 2;
}

.cc_kbd4ii47_xNBnTELo6R .spot__media {
  aspect-ratio: 900 / 560;
  overflow: hidden;
  border-radius: var(--radius-card);
  background: var(--c-surface);
}

.cc_kbd4ii47_xNBnTELo6R .spot__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* column pinned to both ends: intro on top, offer at the bottom (bottoms aligned with the image) */
.cc_kbd4ii47_xNBnTELo6R .spot__content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 40px;
  min-width: 0;
}

.cc_kbd4ii47_xNBnTELo6R .spot__intro {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cc_kbd4ii47_xNBnTELo6R .spot__title, .cc_kbd4ii47_xNBnTELo6R .spot__text, .cc_kbd4ii47_xNBnTELo6R .spot__label, .cc_kbd4ii47_xNBnTELo6R .spot__note {
  margin: 0;
}

.cc_kbd4ii47_xNBnTELo6R .spot__title {
  color: var(--c-text);
  text-wrap: balance;
}

.cc_kbd4ii47_xNBnTELo6R .spot__text, .cc_kbd4ii47_xNBnTELo6R .spot__note {
  color: var(--c-muted);
}

.cc_kbd4ii47_xNBnTELo6R .spot__offer {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.cc_kbd4ii47_xNBnTELo6R .spot__label {
  color: var(--c-text);
}

.cc_kbd4ii47_xNBnTELo6R .spot__value {
  color: var(--c-text);
}

/* offer-value: display line-height 1 (Counter masks default to 1.2em) */
.cc_kbd4ii47_xNBnTELo6R .spot__value .counter {
  line-height: 1;
}

.cc_kbd4ii47_xNBnTELo6R .spot__value .counter__mask, .cc_kbd4ii47_xNBnTELo6R .spot__value .counter__digit {
  height: 1em;
  line-height: 1em;
}

/* I-SPOT-02 · I-M-01: 1.1s reels, 0.06s stagger left to right */
.cc_kbd4ii47_xNBnTELo6R .spot__value .counter__reel {
  transition-duration: 1.1s;
}

.cc_kbd4ii47_xNBnTELo6R .spot__value .counter__mask + .counter__mask .counter__reel {
  transition-delay: 0.06s;
}

.cc_kbd4ii47_xNBnTELo6R .spot__value .counter__mask + .counter__mask + .counter__mask .counter__reel {
  transition-delay: 0.12s;
}

.cc_kbd4ii47_xNBnTELo6R .spot__value .counter__mask + .counter__mask + .counter__mask + .counter__mask .counter__reel {
  transition-delay: 0.18s;
}

.cc_kbd4ii47_xNBnTELo6R .spot__value.is-zero .counter__reel {
  transition: none;
}

.cc_kbd4ii47_xNBnTELo6R .spot__actions {
  padding-top: 12px;
}

/* I-SPOT-01 · M-01: title, then paragraph fade up */
.cc_kbd4ii47_xNBnTELo6R .spot__intro.is-pending > * {
  opacity: 0;
  transform: translateY(40px);
}

.cc_kbd4ii47_xNBnTELo6R .spot__intro.is-inview > * {
  animation: _Jf61WQroI3 0.5s var(--ease-standard) 0.2s both;
}

.cc_kbd4ii47_xNBnTELo6R .spot__intro.is-inview > :nth-child(2) {
  animation-delay: 0.32s;
}

/* Laptop: 50/50 (display 80 comes from the token) */
@media (max-width: 1199px) {
  .cc_kbd4ii47_xNBnTELo6R .spot {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .cc_kbd4ii47_xNBnTELo6R .spot__media {
    aspect-ratio: 4 / 3;
  }
}

/* Tablet: stacked, image 16:9 on top */
@media (max-width: 991px) {
  .cc_kbd4ii47_xNBnTELo6R .spot {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .cc_kbd4ii47_xNBnTELo6R .spot--right .spot__media {
    order: 0;
  }

  .cc_kbd4ii47_xNBnTELo6R .spot__media {
    aspect-ratio: 16 / 9;
  }
}

/* Mobile: image full-bleed 4:3 without radius, text column padded */
@media (max-width: 767px) {
  .cc_kbd4ii47_xNBnTELo6R .spot {
    gap: 24px;
    padding: var(--space-section) 0 0;
  }

  .cc_kbd4ii47_xNBnTELo6R .spot__media {
    aspect-ratio: 4 / 3;
    border-radius: 0;
  }

  .cc_kbd4ii47_xNBnTELo6R .spot__content {
    padding: 0 var(--space-page);
  }
}

@media (prefers-reduced-motion: reduce) {
  .cc_kbd4ii47_xNBnTELo6R .spot__intro.is-inview > * {
    animation: none;
  }

  .cc_kbd4ii47_xNBnTELo6R .spot__value .counter__reel {
    transition: none;
  }
}