/* Home — animated product marquee */
.home-showcase {
  padding: clamp(2.5rem, 6vw, 4rem) 0;
  background: linear-gradient(180deg, var(--bg-warm) 0%, var(--bg) 100%);
  overflow: hidden;
}

.home-showcase__header {
  text-align: center;
  max-width: 36rem;
  margin: 0 auto clamp(1.75rem, 4vw, 2.5rem);
  padding-inline: 1rem;
}

.home-showcase__eyebrow {
  margin: 0 0 0.5rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent-gold);
}

.home-showcase__header .home-showcase__title {
  margin: 0;
  font-family: var(--font-serif);
  font-size: clamp(1.85rem, 4.5vw, 2.65rem);
  font-weight: 600;
  color: var(--ink);
}

.home-showcase__viewport {
  position: relative;
  width: 100%;
  overflow: hidden;
  mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 6%,
    #000 94%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0%,
    #000 6%,
    #000 94%,
    transparent 100%
  );
}

.home-showcase__viewport--empty {
  min-height: 8rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.home-showcase__status {
  text-align: center;
  color: var(--ink-muted);
  font-size: 0.95rem;
  padding: 2rem 1rem;
}

.home-showcase__track {
  display: flex;
  width: max-content;
  animation: homeShowcaseScroll var(--showcase-duration, 40s) linear infinite;
  will-change: transform;
}

.home-showcase__viewport:hover .home-showcase__track {
  animation-play-state: paused;
}

.home-showcase__row {
  display: flex;
  gap: 1rem;
  padding: 0.25rem 0.5rem;
}

.home-showcase__card {
  flex: 0 0 auto;
  width: clamp(9.5rem, 22vw, 12.5rem);
}

.home-showcase__link {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
  background: var(--bg-elevated);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition:
    transform 0.3s var(--ease-out),
    box-shadow 0.3s var(--ease-out),
    border-color 0.25s;
}

.home-showcase__link:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
  border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--line));
}

.home-showcase__media {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: var(--bg-warm);
}

.home-showcase__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.55s var(--ease-out);
}

.home-showcase__link:hover .home-showcase__img {
  transform: scale(1.05);
}

.home-showcase__body {
  padding: 0.75rem 0.85rem 0.9rem;
  text-align: center;
}

.home-showcase__meta {
  margin: 0 0 0.25rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-muted);
}

.home-showcase__card-title {
  margin: 0;
  font-family: var(--font-serif);
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.home-showcase__cta {
  text-align: center;
  margin-top: clamp(1.75rem, 4vw, 2.5rem);
  padding-inline: 1rem;
}

.home-showcase__cta .btn {
  min-width: 11rem;
}

@keyframes homeShowcaseScroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-showcase__track {
    animation: none;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
    gap: 1rem;
    padding: 0 1rem;
  }

  .home-showcase__row--clone {
    display: none;
  }

  .home-showcase__viewport {
    mask-image: none;
    -webkit-mask-image: none;
  }
}
