/* Fullscreen loader */
#loader {
  position: fixed;
  inset: 0;
  /* shorthand for top:0; left:0; right:0; bottom:0 */
  background: #fff;
  /* use #111 or #000 for luxury */
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;

  /* Start fully visible */
  opacity: 1;
  visibility: visible;

  /* Smooth fade-out */
  transition: opacity 0.6s ease, visibility 0.6s ease;
}

/* When hidden */
#loader.hidden {
  opacity: 0;
  visibility: hidden;
}

.welcome-text {
  text-align: center;
  margin-top: 20px;
  /* pushes below animation */
}

.welcome-text h1 {
  font-size: 3rem;
  /* slightly large */
  font-weight: 700;
  /* bold */
  color: #111;
  /* deep black for luxury feel */
  letter-spacing: 2px;
}

.welcome-text h1 span {
  color: #b8860b;
  /* golden shade */
  font-weight: 800;
  /* even stronger emphasis */
}

/* 1000px and below */
@media (max-width: 1000px) {
  .welcome-text h1 {
    font-size: 2.5rem;
    letter-spacing: 1.5px;
  }
}

/* 800px and below */
@media (max-width: 800px) {
  .welcome-text h1 {
    font-size: 2.2rem;
    letter-spacing: 1.2px;
  }
}

/* 600px and below */
@media (max-width: 600px) {
  .welcome-text h1 {
    font-size: 1.8rem;
    letter-spacing: 1px;
  }
}

/* 400px and below */
@media (max-width: 400px) {
  .welcome-text h1 {
    font-size: 1.5rem;
    letter-spacing: 0.8px;
  }
}

/* 320px and below (very small phones) */
@media (max-width: 320px) {
  .welcome-text h1 {
    font-size: 1.2rem;
    letter-spacing: 0.5px;
  }
}