*{margin:0;padding:0;box-sizing:border-box}

body{
  height:100vh;
  overflow:hidden;
  background:#000;
  font-family:'Playfair Display',serif;
}

/* BUTTON */
#startBtn{
  position:absolute;
  inset:0;
  margin:auto;
  width:260px;
  height:75px;
  font-size:20px;
  letter-spacing:3px;
  background:linear-gradient(135deg,#e6c77a,#8a5a00);
  color:#000;
  border:none;
  border-radius:50px;
  cursor:pointer;
  box-shadow:0 0 60px rgba(212,175,55,1);
  z-index:10;
}

/* SCENE */
.scene{
  position:absolute;
  inset:0;
  opacity:0;
}

/* LUXURY BACKGROUND */
.lux-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top, rgba(255,215,0,.22), transparent 60%),
    radial-gradient(circle at bottom, rgba(120,0,40,.35), transparent 65%),
    linear-gradient(#020002,#14000a,#000);
}

/* CONTENT */
.content{
  position:relative;
  z-index:5;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
}

/* TITLE (JAYA) */
#title{
  font-family:'Great Vibes',cursive;
  font-size:100px;
  color:#d4af37;
  text-shadow:0 0 90px rgba(212,175,55,1);
  opacity:0;
  transition:2.5s ease;
}

/* TEXT */
#text{
  margin-top:30px;
  font-size:28px;
  line-height:1.8;
  color:#fff;
  max-width:85%;
  opacity:0;
  transition:2s ease;
}

/* ROSE RAIN */
.rose{
  position:absolute;
  top:-50px;
  font-size:28px;
  opacity:.85;
  animation:fall linear infinite;
  filter:drop-shadow(0 0 8px rgba(255,0,70,.4));
}

.deep{
  font-size:18px;
  opacity:.4;
  filter:blur(1.3px);
}

@keyframes fall{
  to{
    transform:translateY(120vh) rotate(360deg);
    opacity:0;
  }
}

