/* Basic Reset */
*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:Poppins,sans-serif;overflow-x:hidden;scroll-behavior:smooth;}
section{height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;}
#mainPage{display:none;opacity:0;transition:opacity 1s;}

/* Cover */
#cover{background:linear-gradient(135deg,#ffe6f0,#ffc0cb);cursor:default;overflow:hidden;position:relative;}
.cover-background{position:absolute;top:0;left:0;width:100%;height:100%;background-image:url('https://source.unsplash.com/1600x900/?flowers,pink');background-size:cover;background-position:center;z-index:1;transition:transform 0.1s;}
.cover-border{position:absolute;top:10px;left:10px;right:10px;bottom:10px;border:5px solid #fff;border-radius:25px;box-shadow:0 0 30px rgba(255,255,255,0.6);z-index:2;}
.cover-content{position:relative;text-align:center;z-index:3;color:#fff;}
.cover-content h1{font-family:'Great Vibes',cursive;font-size:4em;text-shadow:2px 2px 6px rgba(0,0,0,0.3);}
.cover-content p{font-size:1.5em;margin:15px 0;}
.cover-content button{padding:12px 30px;font-size:1.2em;border:none;border-radius:10px;background:#ff80ab;color:#fff;cursor:pointer;box-shadow:0 4px 10px rgba(0,0,0,0.2);transition:0.3s;}
.cover-content button:hover{transform:scale(1.05);}



/* Sections */
.section{width:100%;height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;padding:20px;transition:transform 0.3s;}
.section:nth-child(even){background:#ffc0cb;}
.section:nth-child(odd){background:#ffb6c1;}

/* Countdown */
#countdown{font-size:2.5em;display:flex;gap:15px;margin-top:20px;justify-content:center;}
#countdown div{background:rgba(255,255,255,0.3);padding:20px 15px;border-radius:10px;transition:transform 0.3s;}

/* Gallery */
.gallery{display:flex;flex-wrap:wrap;justify-content:center;gap:15px;}
.gallery img{width:200px;height:150px;object-fit:cover;border-radius:10px;box-shadow:0 4px 10px rgba(0,0,0,0.3);transition:0.3s;}
.gallery img:hover{transform:scale(1.05) rotateY(5deg);}

/* Bank card */
.bank-card{width:300px;height:180px;background:#fff;border-radius:15px;color:#333;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 6px 15px rgba(0,0,0,0.3);padding:20px;}
.bank-card img{width:60px;margin-bottom:15px;}

/* Confetti */
.confetti{position:absolute;width:10px;height:10px;background:pink;opacity:0.7;border-radius:50%;animation:fall 3s linear forwards;}
@keyframes fall{0%{transform:translateY(-10px) rotate(0deg);}100%{transform:translateY(100vh) rotate(360deg);}}


/* Floating Music Control – diperbarui */
#musicControl {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 50px;
  box-shadow: 0 8px 16px rgba(0,0,0,0.2);
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s, opacity 0.3s;
}
#musicControl:hover {
  transform: scale(1.1);
  opacity: 0.9;
}
#musicControl button {
  background: none;
  border: none;
  font-size: 24px;
  color: #ff80ab;
  cursor: pointer;
  outline: none;
}