/** Shopify CDN: Minification failed

Line 49:0 Unexpected "/"
Line 72:0 Unexpected "/"
Line 151:0 Unexpected "/"
Line 202:0 Unexpected "/"

**/
.collage-wrapper {
  margin-bottom: 0;
}
.collage-wrapper-title {
  margin: 3 0 3rem;
  text-align: center;
  font-size: 3rem;
  color: #0000000;
}
.collage-wrapper-subtitle {
  font-size: 1.5rem; /* Dimensione del testo */
  color: #000000; /* Colore grigio medio */
  text-align: center; /* Centra il testo */
  margin-bottom: 6rem; /* Spazio sopra il sottotitolo */
  font-style: italic; /* Corsivo per un effetto sottotitolo */
}

@media screen and (max-width: 749px) {
  .collage-wrapper-title {
    margin-bottom: 2rem;
  }
}
.collageitem > * {
  height: 100%;
}
.collage {
  display: flex;
  flex-direction: column;
  gap: var(--grid-mobile-vertical-spacing);
}

.collage-wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--grid-mobile-vertical-spacing);
}
.collage-row {
  display: flex;
  gap: var(--grid-mobile-horizontal-spacing);
}
/ Card styling / .collage .card-wrapper {
  width: 100%;
}
.collage-card {
  background-color: rgb(var(--color-background));
  border-radius: var(--card-corner-radius);
  border: var(--card-border-width) solid
    rgba(var(--color-foreground), var(--card-border-opacity));
  height: 100%;
  overflow: hidden;
  position: relative;
  width: 100%;
}
.collage-card.color-background-1 {
  background-color: rgb(var(--color-background));
}
.collage-card .media {
  height: 100%;
  transition: transform var(--duration-long) ease;
}
.collage-card .deferred-media {
  overflow: hidden;
}
/ Media aspect ratios */ .collage .ratio {
  display: block;
  position: relative;
  width: 100%;
}
.collage .ratio::before {
  content: "";
  display: block;
  padding-bottom: var(--ratio-percent);
}
.collage .ratio > * {
  height: 80%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
/* Video controls */
.collage-card .deferred-mediaposter-button {
  align-items: center;
  background-color: rgb(var(--color-background));
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
  border-radius: 50%;
  color: rgb(var(--color-foreground));
  display: flex;
  height: 6.4rem;
  justify-content: center;
  left: 50%;
  padding: 1.2rem;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  transition: transform var(--duration-short) ease;
  width: 6.4rem;
}
.collage-card .deferred-mediaposter-button:hover {
  transform: translate(-50%, -50%) scale(1.1);
}
.collage-card .deferred-mediaposter-button .icon {
  height: auto;
  margin-left: 0.2rem;
  width: 2rem;
}

@media screen and (min-width: 750px) {
  .collage {
    gap: var(--grid-desktop-vertical-spacing);
  }
  .collage-wrapper {
    gap: var(--grid-desktop-vertical-spacing);
  }
  .collage-row {
    gap: var(--grid-desktop-horizontal-spacing);
  }
  /* Prima riga con 2 elementi */
  .collage-row--2 {
    display: flex;
    justify-content: space-between;
  }

  .collage-row--2 .collage__item {
    width: calc(50% - var(--grid-desktop-horizontal-spacing) / 2);
  }

  /* Seconda riga con 3 elementi */
  .collage-row--3 {
    display: flex;
    justify-content: space-between;
  }

  .collage-row--3 .collage__item {
    width: calc(33.333% - var(--grid-desktop-horizontal-spacing) / 1.5);
  }

  /* Terza riga con 1 elemento */
  .collage-row--1 .collage__item {
    width: 100%;
  }
}
/ Modal styles */ .modal-videotoggle {
  background-color: rgb(var(--color-background));
  border: 0.1rem solid rgba(var(--color-foreground), 0.1);
  border-radius: 50%;
  color: rgb(var(--color-foreground));
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 1.2rem;
  position: absolute;
  right: 2rem;
  top: 2rem;
  width: 4rem;
  height: 4rem;
  z-index: 2;
}
.modal-videocontent {
  background-color: rgb(var(--color-background));
  border-radius: var(--popup-corner-radius);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  position: relative;
}
.modal-videocontent-info {
  padding-top: 56.25%;
  position: relative;
  width: 100%;
}
.modal-videocontent-info > * {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgb(var(--color-background));
}

.collage img.placeholder,
.collage-card .placeholder-svg {
  object-fit: cover;
  object-position: center;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
}
/ Supporto per tema scuro */ .collage-card.gradient {
  background: rgb(var(--gradient-background));
}
