/* The supplied dossier composition, in the site's existing 1240px frame. */
.home-page .dossier-reference {
  --dossier-ink: #321126;
  --dossier-columns: 3;
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: var(--dossier-ink);
  box-shadow: none;
}
.home-page .dossier-reference::before {
  content: "";
  position: absolute;
  inset: -65px 0 -65px;
  z-index: -2;
  background: url("../img/dossier-reference-scene.svg") center / 100% 100% no-repeat;
  -webkit-mask-image: linear-gradient(transparent, #000 80px, #000 calc(100% - 80px), transparent);
  mask-image: linear-gradient(transparent, #000 80px, #000 calc(100% - 80px), transparent);
  pointer-events: none;
}
.home-page .dossier-reference::after {
  content: "";
  position: absolute;
  inset: 14px max(18px, calc((100% - 1440px) / 2));
  z-index: -1;
  border: 2px solid rgba(255,255,255,.94);
  border-radius: 10px;
  background: linear-gradient(115deg,rgba(235,198,254,.58),rgba(255,247,248,.58) 58%,rgba(255,218,233,.52));
  box-shadow: 0 28px 44px -34px rgba(153,50,122,.3);
  pointer-events: none;
}
.home-page .dossier-reference .dossier-inner {
  position: relative;
  width: 100%;
  max-width: var(--max);
  margin-inline: auto;
  padding: 54px 28px 64px;
}
.home-page .dossier-reference .section-heading {
  position: relative;
  z-index: 2;
  margin-bottom: 32px;
}
.home-page .dossier-reference .section-kicker {
  display: flex;
  align-items: center;
  gap: 9px;
  width: fit-content;
  margin: 0;
  padding: 5px 17px;
  border-radius: 10px;
  background: #f6ddf0;
  color: #842578;
  font-size: 15px;
  line-height: 1.5;
}
.home-page .dossier-reference .section-kicker .section-icon { display: block; width: 18px; height: 18px; object-fit: contain; flex-shrink: 0; }
.home-page .dossier-reference .dossier-art {
  position: absolute;
  top: 150px;
  left: 28px;
  z-index: 0;
  width: 49%;
  height: 460px;
  overflow: clip;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(#000 70%,transparent);
  mask-image: linear-gradient(#000 70%,transparent);
}
.home-page .dossier-reference .dossier-art span {
  position: absolute;
  width: 78%;
  height: 76%;
  border: 2px solid rgba(255,255,255,.6);
  border-radius: 10px;
  background: linear-gradient(120deg,rgba(255,255,255,.14),rgba(255,233,246,.08));
  transform: rotate(-14deg);
}
.home-page .dossier-reference .dossier-art span:nth-child(1) { left: 35px; top: 65px; }
.home-page .dossier-reference .dossier-art span:nth-child(2) { left: 90px; top: 112px; }
.home-page .dossier-reference .dossier-art span:nth-child(3) { left: 145px; top: 160px; }
.home-page .dossier-reference .dossier-carousel-track { gap: 22px; padding: 6px 2px 30px; }
.home-page .dossier-reference .dossier-carousel-track > .dossier-card {
  flex: 0 0 calc((100% - 44px) / 3);
  min-height: 300px;
  aspect-ratio: 1.2;
}
.home-page .dossier-reference .dossier-card {
  isolation: isolate;
  justify-content: flex-end;
  padding: 22px;
  border: 0;
  border-radius: 10px;
  background: #57334c;
  color: #fff;
  box-shadow: 0 25px 38px -23px rgba(145,40,104,.42);
}
.home-page .dossier-reference .dossier-card img { z-index: 0; }
.home-page .dossier-reference .dossier-card::after {
  z-index: 1;
  background: linear-gradient(180deg,rgba(53,16,43,0) 25%,rgba(65,27,52,.34) 54%,rgba(61,28,52,.94));
}
.home-page .dossier-reference .dossier-card h3,
.home-page .dossier-reference .dossier-card p { position: relative; z-index: 2; }
.home-page .dossier-reference .dossier-card h3 { margin: 0 0 10px; color: #fff; font-size: 22px; line-height: 1.55; }
.home-page .dossier-reference .dossier-card p { margin: 0; color: #fff; font-size: 14px; line-height: 1.85; }
.home-page .dossier-reference .dossier-card:focus-visible { outline: 3px solid #a70244; outline-offset: -5px; }

@media (max-width:1024px) {
  .home-page .dossier-reference { --dossier-columns: 2; }
  .home-page .dossier-reference .dossier-carousel-track > .dossier-card { flex-basis: calc((100% - 22px) / 2); }
  .home-page .dossier-reference .dossier-art { width: 60%; opacity: .8; }
  .home-page .dossier-reference .dossier-card h3 { font-size: 20px; }
  .home-page .dossier-reference .dossier-card p { font-size: 13px; }
}
@media (max-width:720px) {
  .home-page .dossier-reference { --dossier-columns: 1; }
  .home-page .dossier-reference::before { inset-block: -30px -40px; background-size: auto 100%; }
  .home-page .dossier-reference::after { inset: 10px 9px; border-radius: 10px; }
  .home-page .dossier-reference .dossier-inner { padding: 38px 18px 30px; }
  .home-page .dossier-reference .section-heading { margin-bottom: 24px; }
  .home-page .dossier-reference .section-kicker { font-size: 14px; padding: 5px 14px; }
  .home-page .dossier-reference .dossier-art { left: 0; top: 160px; width: 80%; height: 310px; opacity: .4; }
  .home-page .dossier-reference .dossier-carousel-track > .dossier-card { flex-basis: 100%; min-height: 290px; aspect-ratio: 1.1; }
  .home-page .dossier-reference .dossier-card { padding: 22px 28px; border-radius: 10px; }
  .home-page .dossier-reference .dossier-card h3 { font-size: 24px; }
  .home-page .dossier-reference .dossier-card p { font-size: 15px; line-height: 1.85; }
}
@media (prefers-reduced-motion:reduce) {
  .home-page .dossier-reference .dossier-card { transition: none; }
}