/* Skincare benefit ticker module */
.skincare-benefit-ticker {
  width: 100%;
  overflow: hidden;
  border-top: 1px solid rgba(195, 171, 131, 0.28);
  border-bottom: 1px solid rgba(195, 171, 131, 0.28);
  background: linear-gradient(180deg, #faf6ee 0%, #f4ede1 100%);
}

.skincare-benefit-ticker__track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: skincare-benefit-ticker-marquee 36s linear infinite;
}

.skincare-benefit-ticker__item {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 72px;
  padding: 0 34px;
  color: #2b2d31;
  flex: 0 0 auto;
}

.skincare-benefit-ticker__label {
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
}

.skincare-benefit-ticker__icon {
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.78);
  box-shadow: 0 8px 18px rgba(164, 142, 103, 0.12);
  overflow: hidden;
}

.skincare-benefit-ticker__icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.skincare-benefit-ticker:hover .skincare-benefit-ticker__track {
  animation-play-state: paused;
}

@keyframes skincare-benefit-ticker-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@media (max-width: 980px) {
  .skincare-benefit-ticker__item {
    min-height: 66px;
    padding: 0 24px;
    gap: 14px;
  }

  .skincare-benefit-ticker__label {
    font-size: 15px;
  }

  .skincare-benefit-ticker__icon {
    width: 40px;
    height: 40px;
  }

  .skincare-benefit-ticker__track {
    animation-duration: 32s;
  }
}

@media (max-width: 640px) {
  .skincare-benefit-ticker__item {
    min-height: 60px;
    padding: 0 18px;
    gap: 12px;
  }

  .skincare-benefit-ticker__label {
    font-size: 14px;
  }

  .skincare-benefit-ticker__icon {
    width: 36px;
    height: 36px;
  }

  .skincare-benefit-ticker__track {
    animation-duration: 28s;
  }
}