/* Art-directed CSS
 * Some of this from an old implementation with the css from glider.js
*/
figure {
  transition: transform 0.3s ease-out;
}
figure:hover {
  transform: translateY(-5px);
  z-index: 10;
}

.embla {
  grid-column: 1/-1 !important;
  overflow-x: hidden;
  padding: 2em;
  position: relative;
}

.embla__prev,
.embla__next {
  width: 1.2em;
  height: 1.2em;
  user-select: none;
  position: absolute;
  outline: none;
  background: none;
  padding: 0;
  z-index: 2;
  font-size: 40px;
  text-decoration: none;
  left: 23px;
  border: 0;
  top: 20vh;
  cursor: pointer;
  color: #666;
  opacity: 1;
  line-height: 1;
  transition: opacity 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67), color 0.5s cubic-bezier(0.17, 0.67, 0.83, 0.67);
}
.embla__prev svg,
.embla__next svg {
  width: 100%;
  height: 100%;
}

.embla__next {
  right: 23px;
  left: auto;
}

.embla__prev:hover,
.embla__next:hover {
  color: var(--color-accent);
}

.embla__next[disabled],
.embla__prev[disabled] {
  opacity: 0.25;
  color: #666;
  cursor: default;
}

.embla__container {
  display: flex;
  align-items: flex-end;
  gap: 1em;
}

.embla__slide {
  flex: 0 0 auto;
  min-width: 0;
}
.embla__slide figure {
  display: flex;
  justify-items: center;
}
.embla__slide img {
  height: calc(70vh * var(--original-height) / var(--max-original-height));
  object-fit: content;
}

.figcaption {
  height: 2rem;
  margin: 2rem auto;
  position: relative;
}
.figcaption::after {
  content: "";
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  height: 1px;
  width: 36ch;
  background-color: black;
}
.figcaption > p {
  text-align: center;
  transform: translateY(2rem);
  opacity: 0;
  transition: transform 0.4s ease 0.1s, opacity 0.2s ease 0.2s;
}
.figcaption.enter > p {
  transform: translateY(0);
  opacity: 1;
}

/*# sourceMappingURL=le-peuple-immobile.css.map */