/* SuperStampaSprint – Hero Home Slider 1.1.1 PROJECT MATCH HD */
.sss-hhs,
.sss-hhs * {
  box-sizing: border-box;
}

/*
 * Il contenitore usa esattamente il rapporto delle grafiche approvate (1916 × 821).
 * Non ricostruisce più logo, claim e fotografia in elementi separati: ogni slide è
 * la composizione completa, quindi nessun ritaglio o disallineamento.
 */
.sss-hhs {
  --sss-hhs-duration: 760ms;
  position: relative;
  width: 100%;
  aspect-ratio: 1916 / 821;
  margin: 0 0 22px;
  overflow: hidden;
  border: 0;
  border-radius: 20px;
  background: #064a9d;
  box-shadow: 0 18px 48px rgba(9, 40, 86, .13);
  isolation: isolate;
}

.sss-hhs__stage,
.sss-hhs__slide {
  position: absolute;
  inset: 0;
  margin: 0;
}

.sss-hhs__slide {
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transform: scale(1.008);
  transition:
    opacity var(--sss-hhs-duration) ease,
    transform 1600ms cubic-bezier(.22,.61,.36,1),
    visibility 0s linear var(--sss-hhs-duration);
}

.sss-hhs__slide.is-active {
  z-index: 2;
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition-delay: 0s, 0s, 0s;
}

.sss-hhs__slide.is-leaving {
  z-index: 1;
  opacity: 0;
  visibility: visible;
  transform: scale(1.005);
}

.sss-hhs__slide img {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
  object-position: center;
  user-select: none;
  -webkit-user-drag: none;
}

.sss-hhs__arrow {
  position: absolute;
  z-index: 8;
  top: 50%;
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: rgba(255, 255, 255, .92);
  color: #082f72;
  box-shadow: 0 8px 24px rgba(8, 31, 75, .2);
  cursor: pointer;
  transform: translateY(-50%);
  transition: transform .2s ease, background .2s ease, opacity .2s ease;
  opacity: .9;
}

.sss-hhs__arrow:hover,
.sss-hhs__arrow:focus-visible {
  background: #fff;
  opacity: 1;
  transform: translateY(-50%) scale(1.06);
}

.sss-hhs__arrow svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.sss-hhs__arrow--prev { left: 20px; }
.sss-hhs__arrow--next { right: 20px; }

.sss-hhs__dots {
  position: absolute;
  z-index: 9;
  left: 50%;
  bottom: 17px;
  display: flex;
  gap: 8px;
  transform: translateX(-50%);
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(4, 32, 76, .24);
  backdrop-filter: blur(5px);
}

.sss-hhs__dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .5);
  cursor: pointer;
  transition: width .25s ease, border-radius .25s ease, background .25s ease;
}

.sss-hhs__dot.is-active {
  width: 28px;
  border-radius: 999px;
  background: #fff;
}

.sss-hhs button:focus-visible {
  outline: 3px solid #ffdc1c;
  outline-offset: 3px;
}

.sss-home--hero-plugin .sss-home-catalog {
  margin-top: 0 !important;
}

@media (max-width: 900px) {
  .sss-hhs {
    border-radius: 15px;
    margin-bottom: 16px;
  }
  .sss-hhs__arrow {
    width: 40px;
    height: 40px;
  }
  .sss-hhs__arrow--prev { left: 10px; }
  .sss-hhs__arrow--next { right: 10px; }
  .sss-hhs__dots {
    bottom: 9px;
    gap: 6px;
    padding: 5px 8px;
  }
  .sss-hhs__dot {
    width: 7px;
    height: 7px;
  }
  .sss-hhs__dot.is-active {
    width: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sss-hhs__slide,
  .sss-hhs__arrow,
  .sss-hhs__dot {
    transition: none !important;
  }
}


/* HD rendering: keep the approved composition and logo perfectly aligned. */
.sss-hhs__slide img {
  image-rendering: auto;
  backface-visibility: hidden;
  transform: translateZ(0);
}
