/* omaggi */
p > .visually-hidden:focus {
  position: static;
}

.offers__footnote :any-link {
  color: var(--color-darkblue);
  font-weight: bolder;
}

.cnt:has(.offers) {
  --left: auto;
  --right: 0;
  --rotation: 13deg;
  --offset: -50%;
  /* background: linear-gradient(135deg, var(--color-paleorange), var(--color-paleblue)); */
  --x-0: 13%;
  --c-0: hsla(100.00000000000013, 27%, 77%, 0.4);
  --y-0: 82%;
  --x-1: 85%;
  --c-1: hsla(195.00000000000043, 27%, 85%, 1);
  --y-1: 80%;
  --c-2: hsla(40, 53%, 92%, 1);
  --x-2: 60%;
  --y-2: 24%;
  background-color: hsl(358, 0%, 100%);
  background-image:
    radial-gradient(
      circle at var(--x-0) var(--y-0),
      var(--c-0) var(--s-start-0),
      transparent var(--s-end-0)
    ),
    radial-gradient(
      circle at var(--x-1) var(--y-1),
      var(--c-1) var(--s-start-1),
      transparent var(--s-end-1)
    ),
    radial-gradient(
      circle at var(--x-2) var(--y-2),
      var(--c-2) var(--s-start-2),
      transparent var(--s-end-2)
    );
  animation: hero-gradient-animation2 10s linear infinite alternate-reverse;
  background-blend-mode: normal, normal, normal;
  background: var(--color-promo);
}
.cnt:has(.offers:is(.offers--inverted)) {
  --left: 0;
  --right: auto;
  --rotation: -13deg;
  background: linear-gradient(
    315deg,
    var(--color-palegreen),
    var(--color-paleblue)
  );
}
.cnt:has(.offers:is(.offers--inverted)) h2 {
  left: auto;
  right: var(--padding);
}
.cnt:has(.offers:is(.offers--inverted)) .offers__intro {
  justify-content: flex-end;
  text-align: right;
}
.offers .offers__intro {
  display: flex;
  flex-direction: column;
}
@media (width >= 48rem) {
  .offers .offers__intro p {
    padding-block: 0 3rem;
  }
  .offers .offers__intro p:has(+ ul) {
    padding-block: 0 1.5rem;
  }
}
.offers .offers__intro p + ul {
  padding: 0;
  margin: 0;
  list-style-type: none;
  list-style-position: inside;
}
.offers .offers__intro p + ul li {
  color: var(--color-text);
}
.offers .offers__intro p + ul li::marker {
  content: "";
}
.offers .offers__intro em {
  display: block;
  font-style: normal;
  font-weight: 500;
  /*font-size: 1.5rem;*/
  color: var(--color-lightblue);
}
@media (width < 48rem) {
  .offers .offers__intro {
    justify-content: center !important;
    text-align: center !important;
  }
}
.offers h3 {
  background: none;
  padding-inline: 0;
  inline-size: 100%;
}
.offers .offers__gift {
  inline-size: max(20rem, 40%);
  aspect-ratio: 1;
  border-radius: 50%;
  overflow: hidden;
  overflow: visible;
  transform: rotateZ(var(--rotation));
  display: flex;
  justify-content: center;
  align-items: center;
  transition: scale 0.33s 0s;
}
.offers .offers__gift:hover {
  scale: 1.1;
}
.offers .offers__gift img {
  max-block-size: 100%;
}
@media (width < 48rem) {
  .offers .offers__gift {
    margin: 0 auto 1rem auto;
  }
}
.offers .offers__gift img {
  margin: 0 auto;
  display: block;
  aspect-ratio: 1;
  max-inline-size: 100%;
  filter: drop-shadow(0px 0px 5px #333);
}
@media (width >= 48rem) {
  .offers .offers__gift {
    margin: 0 auto;
    inline-size: min(20rem, 20vw);
    position: absolute;
    z-index: 1;
    top: -2rem;
    left: var(--left);
    right: 1rem;
    border: unset;
    background: none;
    border-radius: 0;
    overflow: visible;
    transform: translate(0, -25%) rotateZ(var(--rotation));
    animation: shake 10s linear 0s infinite;
  }
}
.offers .offers__cta {
  display: flex;
  margin-block-start: var(--padding);
  justify-content: flex-end;
}
.offers.offers--list {
  --right: 2rem;
  --left: auto;
}
.offers.offers--list.offers--inverted {
  --right: auto;
  --left: 2rem;
}
@media (width >= 48rem) {
  .offers.offers--list .offers__intro {
    margin-block-start: 4rem;
  }
}
.offers h2 {
  border: 1px var(--color-border) solid;
  border-radius: 5px;
  /* font-size: 1rem;*/
  background: var(--color-white);
}
@media (width < 48rem) {
  .offers h2 {
    position: static !important;
    margin-inline: auto !important;
    text-align: center;
    text-wrap: balance;
    transform: none !important;
  }
}

@media (width >= 48rem) {
  section:has(.offers--list):hover .offers__gift {
    animation-play-state: paused;
  }
}
@media (width >= 64rem) {
  .allpromo .cnt:target {
    scroll-margin-block-start: 12rem !important;
  }
}

@keyframes shake {
  1%,
  3% {
    transform: translate(-3px, -25%) rotateZ(var(--rotation));
  }
  2%,
  4% {
    transform: translate(3px, -25%) rotateZ(var(--rotation));
  }
  5%,
  100% {
    transform: translate(0, -25%) rotateZ(var(--rotation));
  }
}
