:root {
  --ita-alu-gold: #d2ad57;
  --ita-alu-gold-light: #f3dc8c;
  --ita-alu-black: #050505;
  --ita-alu-cream: #f7f2e8;
}

.ita-alu {
  background: linear-gradient(180deg, #111 0%, var(--ita-alu-black) 36%, #000 100%) !important;
  border: 1px solid rgba(210, 173, 87, .72) !important;
  border-radius: 28px !important;
  bottom: auto;
  box-shadow: 0 22px 60px rgba(0, 0, 0, .58), 0 0 26px rgba(210, 173, 87, .12) !important;
  color: var(--ita-alu-cream) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  overflow: hidden;
  position: fixed;
  top: 50%;
  transform: translateY(-50%) scale(.5);
  width: min(300px, calc(100vw - 28px));
  z-index: 99990;
}

.ita-alu--left { left: 22px; transform-origin: center left; }
.ita-alu--right { right: 22px; transform-origin: center right; }

.ita-alu__header {
  align-items: center;
  background: transparent !important;
  border: 0 !important;
  color: var(--ita-alu-gold-light) !important;
  display: flex;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px;
  justify-content: space-between;
  letter-spacing: 4px;
  min-height: 53px;
  padding: 0 17px;
  position: relative;
  text-shadow: 0 0 12px rgba(230, 192, 95, .45);
  z-index: 5;
}

.ita-alu__header::after {
  background: linear-gradient(90deg, transparent, rgba(210, 173, 87, .85), transparent);
  bottom: 0;
  content: "";
  height: 1px;
  left: 12%;
  position: absolute;
  width: 76%;
}

.ita-alu__close {
  appearance: none;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--ita-alu-gold-light) !important;
  cursor: pointer;
  font-family: Arial, sans-serif !important;
  font-size: 25px;
  line-height: 1;
  padding: 2px 0 3px 12px;
}

.ita-alu__slides { position: relative; }

.ita-alu__slide {
  background: transparent !important;
  border: 0 !important;
  display: none;
  padding: 5px 14px 10px;
  text-align: center;
}

.ita-alu__slide.is-active { animation: itaAluFade .35s ease; display: block; }

.ita-alu__slide a,
.ita-alu__slide a:hover {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: inherit !important;
  text-decoration: none !important;
}

.ita-alu__visual {
  height: 330px;
  margin: 0 auto 8px;
  overflow: hidden;
  position: relative;
  width: 100%;
}

.ita-alu__moon {
  background:
    radial-gradient(circle at 36% 31%, rgba(255, 240, 166, .8) 0 4%, transparent 5%),
    radial-gradient(circle at 63% 43%, rgba(163, 117, 35, .18) 0 9%, transparent 10%),
    radial-gradient(circle at 44% 65%, rgba(155, 109, 28, .15) 0 12%, transparent 13%),
    radial-gradient(circle at 38% 34%, #ffe997 0%, #e5bd56 59%, #b98025 100%);
  border-radius: 50%;
  box-shadow: 0 0 16px #d5a83d, 0 0 42px rgba(232, 185, 68, .68), 0 0 68px rgba(232, 185, 68, .28);
  height: 175px;
  left: 50%;
  position: absolute;
  top: 5px;
  transform: translateX(-50%);
  width: 175px;
  z-index: 1;
}

.ita-alu__slide img {
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(245, 220, 140, .82) !important;
  border-radius: 13px !important;
  bottom: 0;
  box-shadow: 0 -9px 25px rgba(0, 0, 0, .55), 0 8px 22px rgba(0, 0, 0, .72) !important;
  display: block;
  height: 140px !important;
  left: 50%;
  object-fit: cover;
  position: absolute;
  transform: translateX(-50%);
  width: 100% !important;
  z-index: 2;
}

.ita-alu__slide h3 {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--ita-alu-cream) !important;
  display: -webkit-box;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 25px !important;
  font-weight: 400 !important;
  letter-spacing: -.5px;
  line-height: 1.05 !important;
  margin: 4px 5px 13px !important;
  min-height: 53px;
  overflow: hidden;
  padding: 0 !important;
  text-shadow: 0 2px 9px #000;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.ita-alu__reference,
.ita-alu__price {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-family: Georgia, "Times New Roman", serif !important;
  padding: 0 !important;
}

.ita-alu__reference {
  color: #efe5cf !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  letter-spacing: 1.2px;
  margin: 0 0 4px !important;
}

.ita-alu__price {
  color: var(--ita-alu-gold-light) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  margin: 0 !important;
}

.ita-alu__dots {
  align-items: center;
  background: transparent !important;
  display: flex;
  gap: 6px;
  justify-content: center;
  min-height: 28px;
  padding: 0 10px 12px;
}

.ita-alu__dot {
  appearance: none;
  background: #574728 !important;
  border: 0 !important;
  border-radius: 50px !important;
  box-shadow: none !important;
  cursor: pointer;
  height: 7px;
  padding: 0 !important;
  transition: width .2s ease, background .2s ease;
  width: 7px;
}

.ita-alu__dot.is-active { background: var(--ita-alu-gold-light) !important; width: 22px; }

@keyframes itaAluFade {
  from { opacity: .25; transform: translateX(5px); }
  to { opacity: 1; transform: translateX(0); }
}

@media (max-width: 600px) {
  .ita-alu { bottom: auto; top: 50%; width: 270px; }
  .ita-alu--left { left: 12px; }
  .ita-alu--right { right: 12px; }
  .ita-alu__header { font-size: 16px; min-height: 47px; }
  .ita-alu__slide { padding: 5px 11px 8px; }
  .ita-alu__visual { height: 300px; }
  .ita-alu__moon { height: 160px; width: 160px; }
  .ita-alu__slide img { height: 125px !important; }
  .ita-alu__slide h3 { font-size: 22px !important; min-height: 47px; }
}

@media (prefers-reduced-motion: reduce) {
  .ita-alu__slide.is-active { animation: none; }
}