/* @keyframes rotate45 {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(90deg);
  }
}

.ht--preloader img {
  transform-origin: center center;
  animation: rotate45 300ms ease-in-out forwards;
} */

.ht--done {
  opacity: 0;
}
.ht--hidden {
  display: none !important;
}
.ht--preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100vh;
  z-index: 9999;
  background: #372f26;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: opacity 0.6s ease;
}

.ht--preloader::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 40%, #faf5ef, transparent 50%),
    radial-gradient(circle at 70% 60%, #d2b48c, transparent 50%),
    radial-gradient(circle at 50% 20%, #9a7739, transparent 50%),
    radial-gradient(circle at 20% 80%, #6f5a3d, transparent 50%);
  background-size: 200% 200%;
  animation: blob 18s ease-in-out infinite;
  filter: blur(90px);
  opacity: 0.95;
  pointer-events: none;
}

@keyframes blob {
  0%,
  100% {
    background-position: 0% 0%, 100% 100%, 50% 50%, 0% 100%;
  }
  25% {
    background-position: 100% 0%, 0% 100%, 100% 0%, 100% 0%;
  }
  50% {
    background-position: 100% 100%, 50% 0%, 0% 100%, 50% 50%;
  }
  75% {
    background-position: 0% 100%, 100% 50%, 50% 0%, 0% 0%;
  }
}
@keyframes blob {
  0% {
    background-position: 0% 0%, 100% 100%, 50% 50%, 0% 100%;
  }
  25% {
    background-position: 100% 0%, 0% 100%, 100% 0%, 100% 0%;
  }
  50% {
    background-position: 100% 100%, 50% 0%, 0% 100%, 50% 50%;
  }
  75% {
    background-position: 0% 100%, 100% 50%, 50% 0%, 0% 0%;
  }
  100% {
    background-position: 0% 0%, 100% 100%, 50% 50%, 0% 100%;
  }
}
/* ________________ */
.ht--preloader p.w-text {
  color: #fff;
  text-align: center;
  font-family: aviano-royale !important;
  font-size: 32px !important;
  font-weight: 300 !important;
  line-height: 75% !important;
  max-width: 652px !important;
  margin-inline: auto !important;
  letter-spacing: -0.64px !important;
}
.ht--preloader h1.w-text {
  font-family: aviano-royale !important;
  color: #fff !important;
  line-height: 65% !important;
  letter-spacing: -0.96px !important;
  max-width: 652px !important;
  margin-inline: auto;
  text-align: center;
}

.ht--preloader .w-html {
  width: fit-content;
  margin-inline: auto;
}
/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/* Rimuovi il translate dal contenitore */
.ht--first-step,
.ht--second-step h1,
.ht--second-step p,
.ht--second-step .w-btn-wrapper {
  opacity: 0;
}

/* Applica il translateY solo ai singoli elementi */
.ht--second-step h1,
.ht--second-step p,
.ht--second-step .w-btn-wrapper {
  transform: translateY(40px);
}

/* Animazioni (invariate) */
.ht--first-step {
  animation: fadeIn 1s ease-out 0.5s forwards,
    fadeOut 0.6s ease-out 3.5s forwards;
}

.ht--second-step h1 {
  animation: slideUp 1s ease-out 4.1s forwards;
}
.ht--second-step p {
  animation: slideUp 1s ease-out 4.3s forwards;
}
.ht--second-step .w-btn-wrapper {
  animation: slideUp 1s ease-out 4.5s forwards;
}

@keyframes fadeIn {
  to {
    opacity: 1;
  }
}
@keyframes fadeOut {
  to {
    opacity: 0;
  }
}
@keyframes slideUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}