/* * { 
    box-sizing: border-box;
     margin: 0; 
     padding: 0; 
     box-sizing: border-box;
 }

header p {
max-width: 600px;
margin: 20px 0;
opacity: 0.9;
background-color: #000;
}
button {
padding: 15px 35px;
border: none;
border-radius: 30px;
background: crimson;
color: white;
font-size: 1rem;
cursor: pointer;
transition: 0.3s;
}
button:hover { background: darkred; }


section {
padding: 80px 10%;
background: #111;
}
.features {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 30px;
}
.card {
background: #1c1c1c;
padding: 25px;
border-radius: 15px;
box-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.card h3 { margin-bottom: 10px; }


.game {
text-align: center;
}
.stats {
margin: 20px 0;
font-size: 1.2rem;
}


footer {
background: #000;
padding: 20px;
text-align: center;
font-size: 0.9rem;
opacity: 0.7;
} */


 *{
            margin:0;
            padding:0;
            box-sizing:border-box;
            font-family: Arial, Helvetica, sans-serif;
        }

        body{
            background:#0b0f1a;
            color:white;
        }

        header{
            height:100vh;
            background:linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)),
            url("https://images.unsplash.com/photo-1606112219348-204d7d8b94ee");
            background-size:cover;
            background-position:center;
        }

        nav{
            display:flex;
            justify-content:space-between;
            align-items:center;
            padding:20px 60px;
            background:rgba(0,0,0,0.6);
        }

        nav h1{
            color:#ff4c29;
            font-size:28px;
            letter-spacing:2px;
        }

        nav ul{
            list-style:none;
            display:flex;
        }

        nav ul li{
            margin-left:25px;
        }

        nav ul li a{
            text-decoration:none;
            color:white;
            font-size:16px;
            transition:0.3s;
        }

        nav ul li a:hover{
            color:#ff4c29;
        }

        .hero{
            height:80vh;
            display:flex;
            flex-direction:column;
            justify-content:center;
            align-items:center;
            text-align:center;
        }

        .hero h2{
            font-size:50px;
            margin-bottom:20px;
        }

        .hero p{
            font-size:18px;
            max-width:600px;
            margin-bottom:30px;
        }

        .hero button{
            padding:15px 35px;
            font-size:16px;
            border:none;
            background:#ff4c29;
            color:white;
            cursor:pointer;
            transition:0.3s;
        }

        .hero button:hover{
            background:#ff2e00;
        }

        section{
            padding:60px;
            text-align:center;
        }

        section h2{
            font-size:36px;
            margin-bottom:40px;
            color:#ff4c29;
        }

        .cards{
            display:flex;
            justify-content:center;
            gap:30px;
            flex-wrap:wrap;
        }

        .card{
            background:#11162a;
            width:300px;
            padding:30px;
            border-radius:10px;
            transition:0.3s;
        }

        .card:hover{
            transform:translateY(-10px);
        }

        .card h3{
            margin-bottom:15px;
        }

        .card p{
            font-size:14px;
            line-height:1.6;
        }

        footer{
            background:#000;
            text-align:center;
            padding:20px;
            font-size:14px;
        }