*{
  margin:0;
  padding:0;
  font-family:Segoe UI, Arial;
  color:white;
}

body{
  overflow-x:hidden;
}

/* Animated gradient background */
.bg{
  position:fixed;
  inset:0;
  background:linear-gradient(120deg,#ff2e2e,#630000,#ff4d4d);
  background-size:300% 300%;
  
  z-index:-1;
}

@keyframes flow{
  0%{background-position:left;}
  100%{background-position:right;}
}

/* Glass effect */
.glass{
  background:rgba(255,255,255,0.1);
  backdrop-filter:blur(10px);
  padding:15px 25px;
  border-radius:20px;
  margin:15px;
  box-shadow:0 0 20px #00000040;
}

/* Navbar */
header{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

nav a{
  margin:0 10px;
  text-decoration:none;
  transition:.4s;
}

nav a:hover{
  color:#ffdf6b;
}

/* Hero */
.hero{
  text-align:center;
  margin-top:80px;
}

button{
  padding:10px 25px;
  border-radius:25px;
  border:none;
  cursor:pointer;
  color:#800000;
  font-weight:bold;
}

/* Cards */
.cards{
  display:flex;
  justify-content:center;
  gap:20px;
  margin-top:40px;
}

.card{
  width:250px;
  text-align:center;
  padding:20px;
  background:#ffffff10;
  border-radius:20px;
  transition:.4s;
}

.card:hover{
  transform:translateY(-10px) scale(1.05);
}

/* Forms */
.form{
  width:320px;
  margin:80px auto;
  text-align:center;
}

input,textarea{
  width:90%;
  padding:10px;
  border-radius:10px;
  border:none;
  margin:8px 0;
  color:#000;
}
body.party .bg{
  animation:flow 1s infinite alternate;
}

