*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Segoe UI',Tahoma,sans-serif;background:#f4f4f4;color:#333;line-height:1.6;}
a{text-decoration:none;color:inherit;}
img{max-width:100%;height:auto;display:block;}

/* Top bar */
.top-bar{background:#1a1a1a;color:#fff;padding:8px 0;font-size:13px;}
.top-bar .container{display:flex;justify-content:space-between;align-items:center;}
.top-bar .auth-btns a{margin-left:8px;padding:6px 18px;border-radius:4px;font-weight:600;font-size:13px;display:inline-block;}
.btn-login{background:#333;color:#fff;}
.btn-register{background:#e91e63;color:#fff;}

/* Header */
header{background:#fff;box-shadow:0 2px 8px rgba(0,0,0,0.08);position:sticky;top:0;z-index:100;}
.container{max-width:1200px;margin:0 auto;padding:0 15px;}
.header-inner{display:flex;justify-content:space-between;align-items:center;padding:14px 0;}
.logo{font-size:28px;font-weight:900;color:#e91e63;letter-spacing:1px;text-transform:uppercase;}
nav ul{list-style:none;display:flex;gap:5px;}
nav ul li a{padding:10px 16px;display:block;color:#333;font-weight:500;font-size:14px;text-transform:uppercase;border-radius:4px;transition:all 0.3s;}
nav ul li a:hover,nav ul li a.active{background:#e91e63;color:#fff;}
.menu-toggle{display:none;font-size:24px;background:none;border:none;cursor:pointer;}

/* Banner promo */
.promo-banner{background:linear-gradient(90deg,#6a1b9a,#e91e63);color:#fff;text-align:center;padding:18px 15px;font-size:18px;font-weight:700;letter-spacing:1px;}
.promo-banner span{color:#ffd54f;}

/* Hero */
.hero{position:relative;background:#000;}
.hero img{width:100%;max-height:400px;object-fit:cover;opacity:0.75;}
.hero-text{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;text-align:center;width:90%;}
.hero-text h1{font-size:42px;font-weight:800;text-shadow:2px 2px 8px rgba(0,0,0,0.7);margin-bottom:10px;}
.hero-text p{font-size:18px;text-shadow:1px 1px 4px rgba(0,0,0,0.7);}

/* Promo strip */
.promo-strip{background:linear-gradient(90deg,#ffd54f,#ff9800);color:#000;text-align:center;padding:15px;font-weight:800;font-size:17px;}

/* Main layout */
.main-wrapper{display:flex;gap:25px;padding:30px 0;}
.content-area{flex:2.2;}
.sidebar{flex:1;}

/* Game cards */
.game-card{background:#fff;border-radius:8px;overflow:hidden;display:flex;margin-bottom:18px;box-shadow:0 2px 6px rgba(0,0,0,0.06);transition:transform 0.3s;}
.game-card:hover{transform:translateY(-3px);box-shadow:0 4px 14px rgba(0,0,0,0.12);}
.game-card .thumb{flex:0 0 180px;background:#fafafa;display:flex;align-items:center;justify-content:center;}
.game-card .thumb img{width:100%;height:180px;object-fit:cover;}
.game-card .info{padding:16px;flex:1;}
.game-card .info span.tag{display:inline-block;color:#999;font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;}
.game-card .info h3{font-size:20px;color:#222;margin-bottom:10px;line-height:1.3;}
.game-card .info p{font-size:14px;color:#666;margin-bottom:8px;}
.game-card .info .meta{font-size:12px;color:#aaa;}
.game-card .info .read-more{color:#e91e63;font-weight:600;font-size:13px;}

/* Sidebar */
.sidebar-widget{background:#fff;border-radius:8px;padding:18px;margin-bottom:20px;box-shadow:0 2px 6px rgba(0,0,0,0.05);}
.sidebar-widget h4{font-size:17px;color:#e91e63;margin-bottom:14px;padding-bottom:8px;border-bottom:2px solid #f0f0f0;}
.search-box{display:flex;gap:5px;}
.search-box input{flex:1;padding:8px;border:1px solid #ddd;border-radius:4px;font-size:13px;}
.search-box button{background:#e91e63;color:#fff;border:none;padding:8px 14px;border-radius:4px;cursor:pointer;font-weight:600;}
.sidebar-widget ul{list-style:none;}
.sidebar-widget ul li{padding:7px 0;border-bottom:1px dashed #eee;font-size:13px;color:#444;}
.sidebar-widget ul li:last-child{border:none;}
.sidebar-widget ul li a:hover{color:#e91e63;}

/* Features section */
.features-section{background:#fff;padding:40px 0;margin-top:20px;}
.section-title{text-align:center;font-size:28px;color:#222;margin-bottom:8px;}
.section-sub{text-align:center;color:#777;margin-bottom:30px;font-size:14px;}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;}
.feature-box{background:#fafafa;padding:25px 20px;border-radius:8px;text-align:center;border-top:3px solid #e91e63;}
.feature-box img{width:80px;height:80px;margin:0 auto 12px;object-fit:cover;border-radius:50%;}
.feature-box h3{font-size:17px;color:#222;margin-bottom:10px;}
.feature-box p{font-size:13px;color:#666;}

/* About brand */
.about-brand{padding:40px 0;background:#f9f9f9;}
.about-brand-inner{display:flex;gap:30px;align-items:center;flex-wrap:wrap;}
.about-brand-inner .text{flex:1;min-width:280px;}
.about-brand-inner .img{flex:1;min-width:280px;}
.about-brand-inner h2{font-size:26px;color:#e91e63;margin-bottom:15px;}
.about-brand-inner p{font-size:14px;color:#555;margin-bottom:12px;}
.about-brand-inner img{border-radius:8px;width:100%;}

/* Stats */
.stats-section{background:linear-gradient(135deg,#6a1b9a,#e91e63);color:#fff;padding:40px 0;}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:20px;text-align:center;}
.stat-item .num{font-size:36px;font-weight:800;color:#ffd54f;display:block;}
.stat-item .label{font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-top:5px;}

/* FAQ */
.faq-section{padding:50px 0;background:#fff;}
.faq-item{background:#fafafa;padding:18px 22px;margin-bottom:12px;border-radius:6px;border-left:4px solid #e91e63;}
.faq-item h4{font-size:16px;color:#222;margin-bottom:8px;}
.faq-item p{font-size:14px;color:#555;}

/* Testimonial */
.testimonial-section{background:#1a1a1a;color:#fff;padding:40px 0;text-align:center;}
.testimonial-section blockquote{max-width:700px;margin:0 auto;font-size:16px;font-style:italic;line-height:1.8;}
.testimonial-section .author{margin-top:15px;color:#ffd54f;font-weight:600;font-size:14px;}

/* Bottom promo */
.bottom-promo{background:linear-gradient(90deg,#ffd54f,#ff9800);color:#000;text-align:center;padding:20px;font-weight:800;font-size:18px;letter-spacing:1px;}

/* Footer */
footer{background:#1a1a1a;color:#bbb;padding:40px 0 20px;font-size:13px;}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:30px;margin-bottom:25px;}
.footer-col h4{color:#fff;font-size:15px;margin-bottom:14px;border-bottom:2px solid #e91e63;padding-bottom:6px;display:inline-block;}
.footer-col p,.footer-col ul li{font-size:13px;margin-bottom:8px;line-height:1.6;}
.footer-col ul{list-style:none;}
.footer-col ul li a:hover{color:#e91e63;}
.footer-bottom{text-align:center;padding-top:20px;border-top:1px solid #333;color:#777;font-size:12px;}
.footer-bottom span{color:#ffd54f;font-weight:700;}

@media(max-width:900px){
.menu-toggle{display:block;}
nav ul{display:none;flex-direction:column;position:absolute;top:60px;left:0;right:0;background:#fff;box-shadow:0 4px 8px rgba(0,0,0,0.1);padding:10px 0;}
nav ul.open{display:flex;}
.main-wrapper{flex-direction:column;}
.game-card{flex-direction:column;}
.game-card .thumb{flex:none;width:100%;}
.game-card .thumb img{height:200px;}
.hero-text h1{font-size:28px;}
.hero-text p{font-size:14px;}
}