*{

margin:0;
padding:0;
box-sizing:border-box;

font-family:Poppins,sans-serif;

}

body{

height:100vh;

overflow:hidden;

background:#0f0f0f;

display:flex;

justify-content:center;

align-items:center;

color:white;

position:relative;

}

/* Background */

.background-overlay{

position:absolute;

inset:0;

background:

radial-gradient(circle at top,#2b2b2b,#0d0d0d);

}

/* Container */

.container{

position:relative;

z-index:10;

text-align:center;

}

/* Chains */

.chains{

position:relative;

height:120px;

}

.chain{

position:absolute;

top:0;

width:8px;

height:120px;

background:

repeating-linear-gradient(

180deg,

#999 0 10px,

#666 10px 20px

);

}

.left{

left:35%;

}

.right{

right:35%;

}

/* Board */

.board{

width:600px;

max-width:90vw;

background:#2b2b2b;

border:6px solid #555;

border-radius:18px;

padding:45px;

box-shadow:

0 20px 40px rgba(0,0,0,.7);

animation:swing 4s ease-in-out infinite;

position:relative;

}

.warning-strip{

position:absolute;

top:0;

left:0;

right:0;

height:20px;

background:

repeating-linear-gradient(

45deg,

#f5b301,

#f5b301 15px,

#222 15px,

#222 30px

);

border-radius:12px 12px 0 0;

}

.board h1{

font-size:55px;

letter-spacing:2px;

color:white;

}

.board h2{

font-size:70px;

color:#ffbf00;

margin-top:10px;

}

/* Helmet */

.helmet{

font-size:70px;

color:#ffc107;

margin-top:-20px;

margin-bottom:25px;

}

/* Content */

.content h3{

font-size:32px;

margin-bottom:20px;

}

.content p{

font-size:22px;

color:#ddd;

line-height:1.8;

max-width:800px;

margin:auto;

}

.content span{

color:#ffc107;

font-weight:700;

}

.coming{

margin-top:40px;

font-size:50px;

font-weight:800;

color:#ffbf00;

animation:pulse 1.3s infinite;

}

/* Button */

.back-btn{

margin-top:45px;

display:inline-flex;

gap:12px;

align-items:center;

padding:18px 45px;

background:#ffbf00;

color:#111;

text-decoration:none;

border-radius:60px;

font-size:22px;

font-weight:700;

transition:.3s;

}

.back-btn:hover{

transform:translateY(-6px);

box-shadow:0 15px 40px rgba(255,191,0,.4);

}

/* Swing */

@keyframes swing{

0%{

transform:rotate(-2deg);

}

50%{

transform:rotate(2deg);

}

100%{

transform:rotate(-2deg);

}

}

/* Pulse */

@keyframes pulse{

50%{

opacity:.4;

transform:scale(1.08);

}

}

/* Sparks */

.spark{

position:absolute;

width:6px;

height:6px;

background:#ffbf00;

border-radius:50%;

animation:float 6s linear infinite;

opacity:.8;

}

.s1{

left:12%;

bottom:5%;

animation-delay:0s;

}

.s2{

left:30%;

bottom:15%;

animation-delay:2s;

}

.s3{

left:60%;

bottom:10%;

animation-delay:1s;

}

.s4{

left:75%;

bottom:20%;

animation-delay:3s;

}

.s5{

left:90%;

bottom:8%;

animation-delay:4s;

}

@keyframes float{

0%{

transform:translateY(0);

opacity:1;

}

100%{

transform:translateY(-800px);

opacity:0;

}

}

/* Mobile */

@media(max-width:768px){

.board{

padding:30px;

}

.board h1{

font-size:34px;

}

.board h2{

font-size:48px;

}

.content h3{

font-size:22px;

}

.content p{

font-size:17px;

}

.coming{

font-size:34px;

}

.back-btn{

font-size:18px;

padding:15px 30px;

}

}