/** Shopify CDN: Minification failed

Line 192:0 Unexpected "@media"

**/
/* LR model gallery (Leur Rêve): snippets/lr-model-gallery.liquid, the product media of the PDP views
   templates/product.<model>.json. One photo at a time, contained head to toe, arrows and counter. */

/* The box hugs the photo (width = height x 1116/2000): the studio backgrounds are vignetted, so any fill
   colour beside a contained picture shows as a band. Photos, film and renders share that ratio. */
.lr-mg {
  --lr-mg-ratio: 0.558;
  --lr-mg-bg: #d6d9dd; /* median edge colour of the photos, shown only while a slide loads */
  --lr-mg-ink: #0b0b0b;
  --lr-mg-height: min(calc(100svh - var(--header-group-height, 64px) - 2rem), 62rem);

  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0.75rem;
  width: 100%;
  color: var(--lr-mg-ink);
}

.lr-mg__stage {
  position: relative;
  flex: 0 1 auto;
  min-width: 0;
  width: min(100%, calc(var(--lr-mg-height) * var(--lr-mg-ratio)));
  background: var(--lr-mg-bg);
}

/* Thumbnails: a vertical strip on the left, as in the stock slideshow (64px wide) */
.lr-mg__thumbs {
  position: relative;
  display: flex;
  flex: none;
  flex-direction: column;
  gap: 0.5rem;
  width: 4rem;
  max-height: var(--lr-mg-height);
  margin: 0;
  padding: 0;
  overflow-y: auto;
  list-style: none;
  scrollbar-width: none;
}

.lr-mg__thumbs::-webkit-scrollbar {
  display: none;
}

.lr-mg__thumb {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: var(--lr-mg-bg);
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 0.2s;
}

.lr-mg__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1116 / 2000;
  object-fit: cover;
}

.lr-mg__thumb:hover,
.lr-mg__thumb[aria-current='true'] {
  opacity: 1;
}

.lr-mg__thumb[aria-current='true'] {
  outline: 1px solid currentcolor;
  outline-offset: 2px;
}

.lr-mg__thumb:focus-visible {
  outline: 1px solid currentcolor;
  outline-offset: 2px;
}

/* The film's thumbnail carries a small play mark */
.lr-mg__thumb--video::after {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.5rem;
  height: 1.5rem;
  border: 1px solid #fff;
  border-radius: 50%;
  background: rgb(0 0 0 / 0.35)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M9 7l9 5-9 5z'/%3E%3C/svg%3E")
    center / 70% no-repeat;
  content: '';
}

.lr-mg__track {
  display: flex;
  height: var(--lr-mg-height);
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.lr-mg__track::-webkit-scrollbar {
  display: none;
}

.lr-mg__track:focus-visible {
  outline: 1px solid currentcolor;
  outline-offset: -1px;
}

.lr-mg__slide {
  display: flex;
  flex: 0 0 100%;
  justify-content: center;
  min-width: 0;
  height: 100%;
  scroll-snap-align: center;
  scroll-snap-stop: always;
}

.lr-mg__slide img,
.lr-mg__slide video {
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
}

.lr-mg__slide video {
  aspect-ratio: 1074 / 1926;
}

.lr-mg__arrow {
  position: absolute;
  top: 50%;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  translate: 0 -50%;
  transition: opacity 0.2s;
}

.lr-mg__arrow--prev {
  left: 0.25rem;
}

.lr-mg__arrow--next {
  right: 0.25rem;
}

.lr-mg__arrow[aria-disabled='true'] {
  opacity: 0.25;
  cursor: default;
}

.lr-mg__arrow:focus-visible {
  outline: 1px solid currentcolor;
  outline-offset: -4px;
}

.lr-mg__foot {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.875rem clamp(0.875rem, 2vw, 1.25rem);
  pointer-events: none;
}

.lr-mg__count,

@media (max-width: 749px) {
  .lr-mg {
    --lr-mg-height: min(calc(100vw / var(--lr-mg-ratio)), 72svh);
  }
}

@media (max-width: 749px) {
  .lr-mg__thumbs {
    display: none;
  }
}

@media (max-width: 749px), (hover: none) {
  .lr-mg__arrow {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lr-mg__arrow,
  .lr-mg__thumb {
    transition: none;
  }
}
