* {
box-sizing: border-box;
}

body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
background: #000;
color: #fff;
overflow: hidden;
}

/* VIDEO */
#bg-video {
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
transform: translate(-50%, -50%);
object-fit: cover;
z-index: -3;
}

/* OVERLAY */
.video-overlay {
position: fixed;
inset: 0;
background:
radial-gradient(circle at center, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.75) 70%),
linear-gradient(to bottom, rgba(0,0,0,0.25), rgba(0,0,0,0.85));
z-index: -2;
}

/* PARTICLES */
#particles {
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
}

/* CONTENT */
.wrapper {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}

.panel {
max-width: 820px;
width: 100%;
padding: 64px 48px;
background: rgba(255,255,255,0.04);
border: 1px solid rgba(255,255,255,0.08);
border-radius: 28px;
text-align: center;
backdrop-filter: blur(12px);
box-shadow: 0 40px 100px rgba(0,0,0,0.7);
}

.badge {
display: inline-block;
margin-bottom: 24px;
padding: 6px 18px;
font-size: 11px;
letter-spacing: 2px;
border: 1px solid rgba(255,255,255,0.2);
border-radius: 999px;
color: #bdbdbd;
}

h1 {
font-size: 46px;
letter-spacing: 2px;
margin-bottom: 20px;
}

p {
font-size: 18px;
line-height: 1.6;
color: #d0d0d0;
margin-bottom: 48px;
}

.actions {
display: flex;
gap: 16px;
justify-content: center;
flex-wrap: wrap;
}

.btn {
padding: 18px 42px;
border-radius: 999px;
font-size: 16px;
font-weight: 600;
text-decoration: none;
transition: all 0.3s ease;
}

.btn.primary {
background: linear-gradient(135deg, #ffffff, #dcdcdc);
color: #0b0b0b;
}

.btn.secondary {
border: 1px solid rgba(255,255,255,0.35);
color: #ffffff;
}

.btn:hover {
transform: translateY(-3px);
box-shadow: 0 12px 30px rgba(255,255,255,0.15);
}

.note {
margin-top: 40px;
font-size: 14px;
color: #9a9a9a;
}

@media (max-width: 600px) {
h1 {
font-size: 32px;
}

.panel {
padding: 48px 28px;
}
}