/* aspect-ratio/object-fit come from CategoryShowcase's aspectRatio/
   objectFit props via inherited CSS custom properties (set on the
   section root, see CategoryShowcase/index.tsx) — inheritance crosses
   the IkasComponentRenderer display:contents wrappers reliably, so
   every item in the grid stays in sync with the section-level setting. */
.cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: var(--nisa-showcase-aspect-ratio, 4 / 5);
  overflow: hidden;
  text-decoration: none;
}

.cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: var(--nisa-showcase-object-fit, cover);
  display: block;
}

/* Underline grows left-to-right on hover/focus and shrinks back the same
   way on leave — matches FooterCategoryItem's link exactly (same
   transform-transition recipe, see FooterCategoryItem/styles.css). */
.cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item__label {
  position: absolute;
  right: clamp(24px, 3vw, 45px);
  bottom: clamp(24px, 3vw, 45px);
  color: #fff;
  font-size: clamp(22px, 2vw, 35px);
  line-height: 1.1;
  letter-spacing: -0.01em;
}

.cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item__label::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 100%;
  height: 2px;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item:hover .nisa-category-showcase-item__label::after, .cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item:focus-visible .nisa-category-showcase-item__label::after {
  transform: scaleX(1);
}

.cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -4px;
}

@media (prefers-reduced-motion: reduce) {
  .cc_llcvgyda_l0ms6alYQP .nisa-category-showcase-item__label::after {
    transition: none;
  }
}
