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


body {

    background:#09090f;
    color:white;

}


.navbar {

    height:70px;
    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 40px;

    background:#11111b;

    border-bottom:1px solid #242438;

}


.logo {

    font-size:26px;
    font-weight:bold;

    color:#9147ff;

}


.navbar a {

    color:white;
    text-decoration:none;
    margin-left:25px;

}



.hero {

    height:450px;

    display:flex;

    align-items:center;

    padding:60px;


    background:
    linear-gradient(
    90deg,
    #09090f 10%,
    transparent
    );

}



.hero h1 {

    font-size:60px;

}



.hero span {

    color:#9147ff;

}



.hero p {

    margin-top:20px;

    font-size:20px;

    color:#bbb;

}




.container {

    padding:40px;

}



.section-title {

    font-size:30px;

    margin-bottom:25px;

}



.games {

    display:grid;

    grid-template-columns:
    repeat(auto-fill,minmax(220px,1fr));

    gap:25px;

}



.game-card {


    background:#151521;

    border-radius:15px;

    overflow:hidden;

    transition:.3s;

}



.game-card:hover {


    transform:translateY(-10px);

}



.game-card img {


    width:100%;

    height:300px;

    object-fit:cover;

}



.game-info {


    padding:15px;

}



.status {


    color:#9147ff;

    margin-top:8px;

}