.fclp {
  --fclp-accent: #b76b25;
  --fclp-wine: #812026;
  --fclp-ink: #17120e;
  --fclp-cream: #f7efe2;
  direction: ltr;
  width: 100%;
  overflow: hidden;
  padding: 24px;
  background: var(--fclp-cream);
  color: var(--fclp-ink);
  box-sizing: border-box;
}

.fclp *, .fclp *::before, .fclp *::after { box-sizing: border-box; }
.fclp__header { position: relative; padding-bottom: 24px; }
.fclp__eyebrow { display: flex; align-items: center; gap: 9px; color: #b86d2b; font: 600 9px/1.2 Arial, sans-serif; letter-spacing: 3.1px; }
.fclp__eyebrow span { width: 18px; height: 1px; background: currentColor; }
.fclp__title { margin: 5px 0 3px; color: var(--fclp-ink); font: 500 25px/1.05 Georgia, 'Times New Roman', serif; letter-spacing: -1px; }
.fclp__title em { color: var(--fclp-accent); font-weight: 500; }
.fclp__subtitle { margin: 0; color: #5b5149; font: 400 11px/1.4 Arial, sans-serif; letter-spacing: .4px; }
.fclp__ornament { position: absolute; right: 0; bottom: 6px; left: 0; display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--fclp-accent); }
.fclp__ornament::before, .fclp__ornament::after { content: ''; flex: 1; height: 1px; background: #e9d8c3; }
.fclp__ornament span, .fclp__ornament i { display: block; width: 4px; height: 4px; background: currentColor; transform: rotate(45deg); }
.fclp__ornament i { width: 3px; height: 3px; opacity: .75; }

.fclp__viewport { width: 100%; overflow: hidden; }
.fclp__track { display: flex; gap: 9px; overflow-x: auto; overscroll-behavior-x: contain; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
.fclp__track::-webkit-scrollbar { display: none; }
.fclp-card { position: relative; flex: 0 0 calc((100% - 36px) / 5); min-width: 0; overflow: hidden; scroll-snap-align: start; background: #fff; border-radius: 9px; box-shadow: 0 2px 12px rgba(77, 51, 27, .055); }
.fclp-card__media { position: relative; width: 100%; overflow: hidden; aspect-ratio: 1 / .96; background: #f4f3f1; }
.fclp-card__media > a:not(.fclp-card__wish) { display: block; width: 100%; height: 100%; }
.fclp-card__media img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; transition: transform .35s ease; }
.fclp-card:hover .fclp-card__media img { transform: scale(1.025); }
.fclp-card__sale { position: absolute; z-index: 3; top: 8px; left: 8px; padding: 4px 9px; background: var(--fclp-wine); border-radius: 4px; color: #fff; font: 700 11px/1 Arial, sans-serif; }
.fclp-card__wish { position: absolute; z-index: 3; top: 7px; right: 7px; display: grid; width: 29px; height: 29px; place-items: center; background: rgba(255,255,255,.94); border: 1px solid #dedbd6; border-radius: 50%; color: #aaa7a2; }
.fclp-card__wish svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.fclp-card__body { position: relative; min-height: 112px; padding: 8px 9px 13px; text-align: left; }
.fclp-card__brand { overflow: hidden; margin-bottom: 1px; color: #8f8a84; font: 500 8px/1.2 Arial, sans-serif; letter-spacing: 1.4px; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.fclp-card__rating { margin: 0 0 1px; color: #3d3833; font: 600 11px/1.2 Arial, sans-serif; }
.fclp-card__rating span { color: #e78d14; font-size: 13px; }
.fclp-card__title { display: -webkit-box; min-height: 29px; margin: 0 28px 2px 0; overflow: hidden; color: #1a1714; font: 700 11px/1.28 Arial, sans-serif; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.fclp-card__title a { color: inherit; text-decoration: none; }
.fclp-card__price { padding-right: 30px; color: #15120f; font: 700 13px/1.25 Arial, sans-serif; }
.fclp-card__price .amount { color: inherit; font: inherit; }
.fclp-card__price ins { display: block; color: inherit; text-decoration: none; }
.fclp-card__price del { display: block; margin-top: 3px; color: #bbb8b3; font-size: 9px; font-weight: 400; opacity: 1; }
.fclp-card__price del .amount { font-size: inherit; font-weight: inherit; }
.fclp-card__plus { position: absolute; right: 7px; bottom: 7px; display: grid; width: 25px; height: 25px; place-items: center; background: var(--fclp-accent); border-radius: 50%; color: #fff !important; font: 400 21px/1 Arial, sans-serif; text-decoration: none !important; box-shadow: 0 2px 5px rgba(133, 73, 20, .22); }
.fclp__dots { display: flex; min-height: 14px; align-items: center; justify-content: center; gap: 12px; margin-top: 13px; }
.fclp__dot { width: 5px; height: 5px; padding: 0; background: #d5aa7d; border: 0; transform: rotate(45deg); cursor: pointer; }
.fclp__dot.is-active { background: var(--fclp-accent); transform: rotate(45deg) scale(1.35); }

@media (max-width: 1024px) {
  .fclp-card { flex-basis: calc((100% - 18px) / 3); }
}

@media (max-width: 767px) {
  .fclp { padding: 21px 24px 20px; }
  .fclp__header { padding-bottom: 25px; }
  .fclp__title { font-size: 21px; }
  .fclp__subtitle { font-size: 10px; }
  .fclp__track { gap: 8px; }
  .fclp-card { flex-basis: calc((100% - 16px) / 3); }
  .fclp-card__media { aspect-ratio: 1 / 1.02; }
  .fclp-card__body { min-height: 100px; padding: 7px 7px 11px; }
  .fclp-card__sale { top: 7px; left: 7px; padding: 4px 7px; font-size: 10px; }
  .fclp-card__wish { top: 6px; right: 6px; width: 27px; height: 27px; }
  .fclp-card__brand { font-size: 7px; letter-spacing: 1.1px; }
  .fclp-card__rating { font-size: 10px; }
  .fclp-card__rating span { font-size: 12px; }
  .fclp-card__title { min-height: 26px; margin-right: 23px; font-size: 10px; }
  .fclp-card__price { padding-right: 24px; font-size: 11px; }
  .fclp-card__price del { font-size: 8px; }
  .fclp-card__plus { right: 6px; bottom: 6px; width: 24px; height: 24px; font-size: 20px; }
}

@media (max-width: 360px) {
  .fclp { padding-right: 14px; padding-left: 14px; }
}

/* v1.0.1: navigation is drag-only, matching the reference. */
.fclp .fclp__dots { display: none !important; }
.fclp .fclp__track { cursor: grab; }
.fclp .fclp__track.is-dragging {
  cursor: grabbing;
  scroll-behavior: auto;
  scroll-snap-type: none;
  user-select: none;
}
.fclp .fclp__track.is-dragging img,
.fclp .fclp__track.is-dragging a { pointer-events: none; }