/*
* VivaOrganique design tokens
*/
/*
* Transitions
*/
/*
* Fonts
*/
.viva-product-slider {
  --viva-product-slide-width: 340px;
  --viva-product-slide-gap: 24px;
  width: 100%;
  max-width: 100%;
  padding: 0;
  overflow: hidden;
  color: var(--viva-color-heading, #413C35);
}
.viva-product-slider *,
.viva-product-slider *::before,
.viva-product-slider *::after {
  box-sizing: border-box;
}
.viva-product-slider__navigation {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  width: 100%;
  padding: 0 0 24px;
}
.viva-product-slider__nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 43.987px;
  height: 43.987px;
  padding: 0;
  border: 1.49px solid color-mix(in srgb, var(--viva-color-heading, #413C35) 20%, transparent);
  border-radius: 50%;
  background: transparent;
  color: var(--viva-color-heading, #413C35);
  font-family: "Inter", Arial, sans-serif;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  transition: border-color 180ms ease, color 180ms ease, opacity 180ms ease;
}
.viva-product-slider__nav:hover:not(:disabled), .viva-product-slider__nav:focus-visible:not(:disabled) {
  border-color: color-mix(in srgb, var(--viva-color-heading, #413C35) 60%, transparent);
  color: var(--viva-color-heading, #413C35);
}
.viva-product-slider__nav:focus-visible {
  outline: 1px solid var(--viva-color-highlight, #C09473);
  outline-offset: 3px;
}
.viva-product-slider__nav:disabled {
  cursor: default;
  border-color: color-mix(in srgb, var(--viva-color-heading, #413C35) 15%, transparent);
  color: color-mix(in srgb, var(--viva-color-heading, #413C35) 25%, transparent);
  opacity: 1;
}
.viva-product-slider__viewport {
  width: 100%;
  overflow: hidden;
  padding: 0;
}
.viva-product-slider__wrapper {
  align-items: stretch;
  padding: 0;
  margin: 0;
}
.viva-product-slider__slide {
  display: flex;
  flex: 0 0 var(--viva-product-slide-width);
  flex-direction: column;
  min-width: 0;
  height: auto;
}
.viva-product-slider__media {
  position: relative;
  width: 100%;
  aspect-ratio: 340/400;
  overflow: hidden;
  background: var(--viva-color-product-dark, #2A1A11);
}
.viva-product-slider__image, .viva-product-slider__image-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.viva-product-slider__image-placeholder {
  background: linear-gradient(135deg, var(--viva-color-image-surface, #E8D8C8), var(--viva-color-product-dark, #2A1A11));
}
.viva-product-slider__content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 22.4px 0 16px;
}
.viva-product-slider__eyebrow {
  margin: 0;
  color: var(--viva-color-heading, #413C35);
  font-family: "Inter", Arial, sans-serif;
  font-size: 9.28px;
  font-weight: 500;
  letter-spacing: 2.0416px;
  line-height: 13.92px;
  text-transform: uppercase;
}
.viva-product-slider__title {
  margin: 8.8px 0 0;
  color: var(--viva-color-heading, #413C35);
  font-family: "Stellar", Arial, sans-serif;
  font-size: 20.8px;
  font-weight: 400;
  letter-spacing: 0.01em;
  line-height: 23.92px;
}
.viva-product-slider__description {
  margin: 11.2px 0 0;
  color: color-mix(in srgb, var(--viva-color-body-text, #3D2013) 72%, transparent);
  font-family: "Inter", Arial, sans-serif;
  font-size: 14px;
  font-weight: 300;
  letter-spacing: 0.01em;
  line-height: 22.464px;
}
.viva-product-slider__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  align-self: flex-start;
  margin-top: 19.2px;
  color: color-mix(in srgb, var(--viva-color-heading, #413C35) 55%, transparent);
  font-family: "Inter", Arial, sans-serif;
  font-size: 9.92px;
  font-weight: 400;
  letter-spacing: 1.5872px;
  line-height: 14.88px;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 180ms ease;
}
.viva-product-slider__cta:hover, .viva-product-slider__cta:focus-visible {
  color: var(--viva-color-heading, #413C35);
}
.viva-product-slider__cta:focus-visible {
  outline: 1px solid var(--viva-color-highlight, #C09473);
  outline-offset: 4px;
}

@media (max-width: 767px) {
  .viva-product-slider {
    --viva-product-slide-width: 84vw;
    --viva-product-slide-gap: 12px;
  }
  .viva-product-slider__navigation {
    padding-bottom: 16px;
  }
  .viva-product-slider__nav {
    width: 40px;
    height: 40px;
  }
  .viva-product-slider__content {
    padding-top: 14px;
    padding-bottom: 24px;
  }
  .viva-product-slider__title {
    font-size: 19px;
  }
  .viva-product-slider__description {
    font-size: 12px;
  }
}
