/* ==========================
   TRENDING GAMES
========================== */

.trending{
    background:#070B12;
    padding:100px 8%;
}

.section-header{
    text-align:center;
    margin-bottom:60px;
}

.section-subtitle{
    color:#8B5CF6;
    letter-spacing:3px;
    font-size:14px;
    margin-bottom:12px;
}

.section-title{
    font-size:48px;
    font-family:'Orbitron',sans-serif;
}

.section-title span{
    color:#8B5CF6;
    text-shadow:0 0 20px #8B5CF6;
}

.games-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:35px;
}

.game-card{
    position:relative;
    border-radius:28px;
    overflow:hidden;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    backdrop-filter:blur(15px);
    box-shadow:0 20px 60px rgba(0,0,0,.35);
    transition:.45s;
}

.game-card::before{
    content:"";
    position:absolute;
    top:-50%;
    left:-50%;
    width:200%;
    height:200%;
    background:linear-gradient(
        120deg,
        transparent,
        rgba(139,92,246,.28),
        transparent
    );
    transform:rotate(25deg);
    opacity:0;
    transition:.5s;
}

.game-card:hover::before{
    opacity:1;
    animation:shine 1.2s linear;
}

.game-card:hover{
    transform:translateY(-15px) scale(1.03);
    box-shadow:0 0 45px rgba(139,92,246,.45);
}

.game-card img{
    width:100%;
    height:280px;
    object-fit:cover;
}

.game-info{
    padding:25px;
}

.game-info h3{
    font-size:24px;
    margin-bottom:8px;
}

.game-info p{
    color:#b6b6b6;
    margin-bottom:14px;
}

.rating{
    color:#FACC15;
    margin-bottom:18px;
    letter-spacing:2px;
}

.game-info a{
    color:#8B5CF6;
    font-weight:600;
}

@keyframes shine{
    from{
        transform:translateX(-100%) rotate(25deg);
    }

    to{
        transform:translateX(100%) rotate(25deg);
    }
}

@media(max-width:992px){
    .games-grid{
        grid-template-columns:1fr;
    }

    .section-title{
        font-size:36px;
    }
}
/* ================= NEWS ================= */

.news{

padding:100px 8%;

background:#0B0F18;

}

.news-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:35px;

}

.news-card{

background:#131926;

border-radius:25px;

overflow:hidden;

transition:.4s;

border:1px solid rgba(255,255,255,.08);

}

.news-card:hover{

transform:translateY(-12px);

box-shadow:0 0 35px rgba(139,92,246,.35);

}

.news-card img{

width:100%;

height:240px;

object-fit:cover;

}

.news-content{

padding:25px;

}

.news-content span{

color:#8B5CF6;

font-size:14px;

}

.news-content h3{

margin:15px 0;

font-size:24px;

}

.news-content p{

color:#B6B6B6;

line-height:1.7;

margin-bottom:18px;

}

.news-content a{

color:#8B5CF6;

font-weight:600;

}

@media(max-width:992px){

.news-grid{

grid-template-columns:1fr;

}

}
/* ================= FEATURED ================= */

.featured{

padding:120px 8%;

background:#070B12;

}

.featured-container{

display:flex;

align-items:center;

justify-content:space-between;

gap:70px;

}

.featured-left{

flex:1;

}

.featured-left img{

width:100%;

border-radius:30px;

box-shadow:0 0 40px rgba(139,92,246,.35);

transition:.4s;

}

.featured-left img:hover{

transform:scale(1.03);

}

.featured-right{

flex:1;

}

.featured-right h2{

font-size:50px;

margin-bottom:20px;

font-family:'Orbitron',sans-serif;

}

.featured-right p{

color:#BDBDBD;

line-height:2;

margin-bottom:35px;

}

@media(max-width:992px){

.featured-container{

flex-direction:column;

}

}
/* ================= CATEGORIES ================= */

.categories{
    padding:100px 8%;
    background:#0B0F18;
}

.category-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:25px;
}

.category-card{
    padding:45px 25px;
    border-radius:25px;
    text-align:center;
    background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.12);
    transition:.4s;
}

.category-card:hover{
    transform:translateY(-12px);
    box-shadow:0 0 35px rgba(139,92,246,.35);
}

.category-card h3{
    font-size:26px;
    margin-bottom:10px;
}

.category-card p{
    color:#BDBDBD;
}

@media(max-width:992px){
    .category-grid{
        grid-template-columns:1fr;
    }
}
/* ================= REVIEWS ================= */

.reviews{
    padding:100px 8%;
    background:#070B12;
}

.reviews-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.review-card{
    padding:35px;
    border-radius:25px;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.1);
    transition:.4s;
}

.review-card:hover{
    transform:translateY(-12px);
    box-shadow:0 0 35px rgba(139,92,246,.35);
}

.review-card h3{
    font-size:26px;
    margin-bottom:20px;
}

.score{
    width:80px;
    height:80px;
    border-radius:50%;
    background:#8B5CF6;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:28px;
    font-weight:700;
    margin-bottom:20px;
    box-shadow:0 0 25px rgba(139,92,246,.6);
}

.review-card p{
    color:#BDBDBD;
    line-height:1.7;
}

@media(max-width:992px){
    .reviews-grid{
        grid-template-columns:1fr;
    }
}
/* ================= GALLERY ================= */

.gallery{

padding:100px 8%;

background:#0B0F18;

}

.gallery-grid{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:25px;

}

.gallery-grid img{

width:100%;

height:250px;

object-fit:cover;

border-radius:20px;

transition:.4s;

cursor:pointer;

}

.gallery-grid img:hover{

transform:scale(1.05);

box-shadow:0 0 35px rgba(139,92,246,.45);

}

@media(max-width:992px){

.gallery-grid{

grid-template-columns:1fr;

}

}
/* ================= NEWSLETTER ================= */

.newsletter{
    padding:100px 8%;
    background:#070B12;
}

.newsletter-box{
    max-width:1000px;
    margin:auto;
    text-align:center;
    padding:70px 40px;
    border-radius:35px;
    background:
        radial-gradient(circle at top left, rgba(139,92,246,.35), transparent 35%),
        linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.03));
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 0 45px rgba(139,92,246,.25);
}

.newsletter-box h2{
    font-size:48px;
    font-family:'Orbitron',sans-serif;
    margin-bottom:18px;
}

.newsletter-box p{
    color:#BDBDBD;
    max-width:650px;
    margin:0 auto 35px;
    line-height:1.8;
}

.newsletter-form{
    display:flex;
    justify-content:center;
    gap:15px;
}

.newsletter-form input{
    width:420px;
    padding:17px 22px;
    border-radius:50px;
    border:1px solid rgba(255,255,255,.15);
    outline:none;
    background:rgba(255,255,255,.08);
    color:white;
}

.newsletter-form input::placeholder{
    color:#aaa;
}

.newsletter-form button{
    padding:17px 34px;
    border:none;
    border-radius:50px;
    background:#8B5CF6;
    color:white;
    font-weight:600;
    cursor:pointer;
    transition:.3s;
}

.newsletter-form button:hover{
    box-shadow:0 0 25px rgba(139,92,246,.7);
    transform:translateY(-3px);
}

@media(max-width:768px){
    .newsletter-form{
        flex-direction:column;
    }

    .newsletter-form input{
        width:100%;
    }

    .newsletter-box h2{
        font-size:34px;
    }
}
/* ================= FOOTER ================= */

.footer{

background:#05070D;

padding:80px 8% 30px;

border-top:1px solid rgba(255,255,255,.08);

}

.footer-container{

display:grid;

grid-template-columns:2fr 1fr 1fr 1fr;

gap:40px;

margin-bottom:50px;

}

.footer-logo h2{

font-size:36px;

font-family:'Orbitron',sans-serif;

margin-bottom:20px;

}

.footer-logo span{

color:#8B5CF6;

}

.footer-logo p{

color:#BDBDBD;

line-height:1.8;

}

.footer-links h3{

margin-bottom:20px;

}

.footer-links ul{

list-style:none;

}

.footer-links li{

margin-bottom:12px;

}

.footer-links a{

color:#BDBDBD;

text-decoration:none;

transition:.3s;

}

.footer-links a:hover{

color:#8B5CF6;

padding-left:6px;

}

.copyright{

text-align:center;

padding-top:25px;

border-top:1px solid rgba(255,255,255,.08);

color:#888;

font-size:15px;

}

@media(max-width:992px){

.footer-container{

grid-template-columns:1fr;

text-align:center;

}

}
.game-details{
    padding: 80px 8%;
}

.details-container{
    max-width: 1200px;
    margin: 40px auto 0;

    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}

.detail-box{
    background: #171717;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 16px;
    padding: 28px;
    transition: 0.3s ease;
}

.detail-box:hover{
    transform: translateY(-6px);
    border-color: #f6c90e;
}

.detail-box h3{
    color: #f6c90e;
    margin-bottom: 10px;
    font-size: 21px;
}

.detail-box p{
    color: #bdbdbd;
    line-height: 1.7;
}

.game-guide{
    padding: 20px 8% 100px;
}

.guide-container{
    max-width: 1000px;
    margin: auto;
    background: #171717;
    border-radius: 18px;
    padding: 40px;
    border: 1px solid rgba(255,255,255,0.08);
}

.guide-container h2{
    font-size: 32px;
    margin-bottom: 22px;
    color: #ffffff;
}

.guide-container p{
    color: #bdbdbd;
    line-height: 1.9;
    margin-bottom: 18px;
}

@media(max-width: 700px){
    .details-container{
        grid-template-columns: 1fr;
    }

    .guide-container{
        padding: 25px;
    }

    .guide-container h2{
        font-size: 25px;
    }
}
.news-featured{
    padding: 80px 8% 110px;
}

.featured-news-box{
    max-width: 1200px;
    margin: 45px auto 0;

    display: grid;
    grid-template-columns: 1fr 1fr;

    background: #171717;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 20px;
    overflow: hidden;
}

.featured-news-image img{
    width: 100%;
    height: 100%;
    min-height: 430px;
    display: block;
    object-fit: cover;
}

.featured-news-content{
    padding: 45px;
}

.news-label{
    display: inline-block;
    color: #f6c90e;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 15px;
}

.featured-news-content h2{
    color: #ffffff;
    font-size: 34px;
    line-height: 1.3;
    margin-bottom: 20px;
}

.featured-news-content p{
    color: #bdbdbd;
    line-height: 1.8;
    margin-bottom: 16px;
}

.featured-news-content .btn-primary{
    display: inline-block;
    margin-top: 12px;
}

@media(max-width: 850px){

    .featured-news-box{
        grid-template-columns: 1fr;
    }

    .featured-news-image img{
        min-height: 280px;
    }

    .featured-news-content{
        padding: 28px;
    }

    .featured-news-content h2{
        font-size: 27px;
    }
}
.contact-page{
    min-height: 100vh;
    padding: 150px 8% 100px;
}

.contact-intro{
    max-width: 700px;
    margin: 18px auto 0;
    color: #bdbdbd;
    line-height: 1.8;
    text-align: center;
}

.contact-container{
    max-width: 1200px;
    margin: 50px auto 0;

    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 35px;
}

.contact-info{
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-box,
.contact-form{
    background: #171717;
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 18px;
}

.contact-box{
    padding: 28px;
}

.contact-box h3{
    color: #f6c90e;
    font-size: 22px;
    margin-bottom: 10px;
}

.contact-box p{
    color: #bdbdbd;
    line-height: 1.7;
    margin-bottom: 8px;
}

.contact-box a{
    color: #ffffff;
    text-decoration: none;
}

.contact-box a:hover{
    color: #f6c90e;
}

.contact-form{
    padding: 35px;
}

.form-group{
    margin-bottom: 22px;
}

.form-group label{
    display: block;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 9px;
}

.form-group input,
.form-group textarea{
    width: 100%;

    padding: 14px 16px;

    background: #101010;
    color: #ffffff;

    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 9px;

    font-family: "Poppins", sans-serif;
    font-size: 15px;

    outline: none;
}

.form-group input:focus,
.form-group textarea:focus{
    border-color: #f6c90e;
}

.form-group textarea{
    resize: vertical;
}

.contact-submit{
    border: none;

    padding: 14px 28px;

    background: #f6c90e;
    color: #111111;

    border-radius: 9px;

    font-weight: 700;
    font-size: 16px;

    cursor: pointer;
    transition: 0.3s;
}

.contact-submit:hover{
    background: #ffffff;
    transform: translateY(-3px);
}

@media(max-width: 850px){

    .contact-container{
        grid-template-columns: 1fr;
    }

}

@media(max-width: 600px){

    .contact-page{
        padding-left: 5%;
        padding-right: 5%;
    }

    .contact-form{
        padding: 24px;
    }

}
/* =========================
   FIX GAMES PAGE COLORS
========================= */

.games-grid .game-card{
    background: #171a21;
    border: 1px solid rgba(255,255,255,0.12);
}

.games-grid .game-card h3{
    color: #ffffff;
}

.games-grid .game-card p{
    color: #c7c7c7;
}

.games-grid .game-card a{
    color: #a855f7;
    font-weight: 600;
    text-decoration: none;
}

.games-grid .game-card a:hover{
    color: #ffffff;
}

.games-grid .rating{
    color: #ffd700;
}

.games-grid .game-info{
    padding: 24px;
}

.trending .section-title{
    color: #ffffff;
}

.trending .section-title span{
    color: #8b5cf6;
    text-shadow: 0 0 15px rgba(139,92,246,0.65);
}

.trending .section-subtitle{
    color: #8b5cf6;
}
/* ==========================
   GAMES PAGE FINAL FIX
========================== */

.trending{
    min-height: 100vh;
}

.trending .section-title{
    color: #ffffff !important;
}

.trending .section-title span{
    color: #8b5cf6 !important;
}

.games-grid .game-card{
    position: relative;
    background: #171a21;
}

.games-grid .game-card img{
    display: block;
}

.games-grid .game-info{
    position: relative;
    z-index: 2;
    padding: 25px;
}

.games-grid .game-info h3{
    color: #ffffff !important;
    font-size: 24px;
}

.games-grid .game-info p{
    color: #c7c7c7 !important;
    line-height: 1.7;
}

.games-grid .game-info a{
    display: inline-block;
    color: #a855f7 !important;
    text-decoration: none;
    transition: 0.3s;
}

.games-grid .game-info a:hover{
    color: #ffffff !important;
    transform: translateX(5px);
}

.games-grid .game-card::before{
    z-index: 1;
    pointer-events: none;
}
.login-page{

min-height:100vh;

display:flex;

justify-content:center;

align-items:center;

background:#070B12;

padding:30px;

}

.login-box{

width:420px;

padding:45px;

background:#171717;

border-radius:25px;

border:1px solid rgba(255,255,255,.08);

box-shadow:0 0 40px rgba(139,92,246,.25);

}

.login-box h1{

text-align:center;

font-size:42px;

font-family:'Orbitron',sans-serif;

margin-bottom:10px;

}

.login-box span{

color:#8B5CF6;

}

.login-box h2{

text-align:center;

margin-bottom:35px;

}

.login-box input{

width:100%;

padding:16px;

margin-bottom:20px;

border:none;

border-radius:10px;

background:#0F1118;

color:white;

font-size:15px;

}

.login-box button{

width:100%;

padding:16px;

background:#8B5CF6;

border:none;

border-radius:10px;

color:white;

font-size:17px;

font-weight:600;

cursor:pointer;

transition:.3s;

}

.login-box button:hover{

background:#6D3DF5;

}

.login-box p{

text-align:center;

margin-top:25px;

}

.login-box a{

color:#8B5CF6;

text-decoration:none;

}

.back-home{

display:block;

margin-top:30px;

text-align:center;

}
/* ==========================
   REVIEWS PAGE
========================== */

.reviews-page{
    min-height: 100vh;
    padding: 150px 8% 110px;
    background: #070b12;
}

.reviews-intro{
    max-width: 680px;
    margin: 18px auto 0;
    text-align: center;
    color: #bdbdbd;
    line-height: 1.8;
}

.reviews-page-grid{
    max-width: 1200px;
    margin: 50px auto 0;

    display: grid;
    grid-template-columns: 1fr;
    gap: 35px;
}

.full-review-card{
    display: grid;
    grid-template-columns: 420px 1fr;

    background: #171a21;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 24px;
    overflow: hidden;

    transition: 0.35s ease;
}

.full-review-card:hover{
    transform: translateY(-8px);
    box-shadow: 0 0 38px rgba(139,92,246,0.3);
}

.full-review-card img{
    width: 100%;
    height: 100%;
    min-height: 330px;
    object-fit: cover;
}

.full-review-content{
    padding: 38px;
}

.review-category{
    display: inline-block;
    color: #8b5cf6;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 12px;
}

.full-review-content h2{
    font-size: 32px;
    margin-bottom: 15px;
    font-family: "Orbitron", sans-serif;
}

.review-rating{
    color: #facc15;
    margin-bottom: 18px;
    letter-spacing: 2px;
}

.review-rating strong{
    color: #ffffff;
    margin-left: 10px;
    letter-spacing: 0;
}

.full-review-content p{
    color: #bdbdbd;
    line-height: 1.9;
    margin-bottom: 24px;
}

.review-button{
    display: inline-block;
    padding: 13px 24px;

    background: #8b5cf6;
    color: #ffffff;

    text-decoration: none;
    font-weight: 700;
    border-radius: 10px;

    transition: 0.3s ease;
}

.review-button:hover{
    background: #ffffff;
    color: #111111;
    transform: translateY(-3px);
}

@media(max-width: 900px){

    .full-review-card{
        grid-template-columns: 1fr;
    }

    .full-review-card img{
        min-height: 260px;
        max-height: 350px;
    }

}

@media(max-width: 600px){

    .reviews-page{
        padding-left: 5%;
        padding-right: 5%;
    }

    .full-review-content{
        padding: 25px;
    }

    .full-review-content h2{
        font-size: 25px;
    }

}
/* =====================================
   CONTACT PAGE
===================================== */

.contact-page {
    min-height: 100vh;
    padding: 150px 7% 100px;
    background:
        radial-gradient(circle at top, rgba(132, 76, 255, 0.16), transparent 40%),
        #070b14;
    color: #ffffff;
}

.contact-page .section-header {
    max-width: 850px;
    margin: 0 auto 60px;
    text-align: center;
}

.contact-page .section-subtitle {
    margin-bottom: 12px;
    color: #9b63ff;
    font-family: "Orbitron", sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 3px;
}

.contact-page .section-title {
    margin-bottom: 20px;
    color: #ffffff;
    font-family: "Orbitron", sans-serif;
    font-size: clamp(36px, 5vw, 64px);
    line-height: 1.2;
}

.contact-page .section-title span {
    color: #8b5cf6;
    text-shadow: 0 0 20px rgba(139, 92, 246, 0.7);
}

.contact-intro {
    max-width: 700px;
    margin: 0 auto;
    color: #aab2c3;
    font-size: 16px;
    line-height: 1.8;
}

.contact-container {
    width: min(1150px, 100%);
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.85fr 1.15fr;
    gap: 35px;
    align-items: stretch;
}

.contact-info {
    display: grid;
    gap: 20px;
}

.contact-box {
    padding: 28px;
    border: 1px solid rgba(139, 92, 246, 0.28);
    border-radius: 18px;
    background: rgba(15, 20, 32, 0.9);
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.25);
    transition: 0.3s ease;
}

.contact-box:hover {
    transform: translateY(-5px);
    border-color: #8b5cf6;
    box-shadow: 0 15px 35px rgba(139, 92, 246, 0.18);
}

.contact-box h3 {
    margin-bottom: 12px;
    color: #ffffff;
    font-family: "Orbitron", sans-serif;
    font-size: 20px;
}

.contact-box p {
    margin-bottom: 10px;
    color: #aab2c3;
    line-height: 1.7;
}

.contact-box a {
    color: #9b63ff;
    text-decoration: none;
    font-weight: 600;
}

.contact-box a:hover {
    color: #ffffff;
}

.contact-form {
    padding: 35px;
    border: 1px solid rgba(139, 92, 246, 0.3);
    border-radius: 22px;
    background: rgba(15, 20, 32, 0.95);
    box-shadow: 0 20px 55px rgba(0, 0, 0, 0.35);
}

.form-group {
    margin-bottom: 22px;
}

.form-group label {
    display: block;
    margin-bottom: 9px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 15px 17px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 11px;
    outline: none;
    background: #0a0f1b;
    color: #ffffff;
    font-family: "Poppins", sans-serif;
    font-size: 15px;
    transition: 0.3s ease;
}

.form-group textarea {
    min-height: 160px;
    resize: vertical;
}

.form-group input::placeholder,
.form-group textarea::placeholder {
    color: #697287;
}

.form-group input:focus,
.form-group textarea:focus {
    border-color: #8b5cf6;
    box-shadow: 0 0 0 4px rgba(139, 92, 246, 0.12);
}

.contact-submit {
    width: 100%;
    padding: 15px 25px;
    border: none;
    border-radius: 11px;
    background: linear-gradient(135deg, #7c3aed, #9b63ff);
    color: #ffffff;
    font-family: "Orbitron", sans-serif;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: 0.3s ease;
}

.contact-submit:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(139, 92, 246, 0.38);
}

/* Mobile */

@media (max-width: 850px) {
    .contact-page {
        padding: 125px 20px 70px;
    }

    .contact-container {
        grid-template-columns: 1fr;
    }

    .contact-form {
        padding: 25px 20px;
    }
}

@media (max-width: 500px) {
    .contact-page .section-title {
        font-size: 34px;
    }

    .contact-box {
        padding: 22px;
    }
}