/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0b0f19;
  --bg2:#111828;
  --bg3:#161d2e;
  --card:#1a2235;
  --card-hover:#1f2a40;
  --gold:#e5a525;
  --gold2:#f5b731;
  --gold-glow:rgba(229,165,37,.25);
  --green:#2ecc71;
  --red:#e74c3c;
  --blue:#3498db;
  --white:#f8f9fa;
  --gray:#a0aec0;
  --gray2:#718096;
  --dark-border:#1e2a3a;
  --radius:14px;
}
html{scroll-behavior:smooth}
body{
  font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
  background:var(--bg);
  color:var(--white);
  line-height:1.6;
  overflow-x:hidden;
  min-height:100vh;
}
a{text-decoration:none;color:inherit;transition:.3s}
img{max-width:100%;display:block}
ul{list-style:none}

/* ===== HEADER ===== */
.header{
  position:fixed;top:0;left:0;width:100%;z-index:100;
  background:rgba(11,15,25,.92);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.04);
}
.header-inner{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 20px;
}
.logo img{height:48px}
.header-btns{display:flex;gap:10px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 32px;border-radius:10px;font-weight:700;font-size:.95rem;
  border:none;cursor:pointer;transition:.3s;text-transform:uppercase;letter-spacing:.5px;
}
.btn-login{
  background:transparent;border:2px solid var(--gold);color:var(--gold);
}
.btn-login:hover{background:var(--gold);color:#000}
.btn-register{
  background:linear-gradient(135deg,var(--gold),#d4941a);color:#000;
  box-shadow:0 4px 20px var(--gold-glow);
}
.btn-register:hover{transform:translateY(-2px);box-shadow:0 6px 28px var(--gold-glow)}
.btn-green{
  background:linear-gradient(135deg,#2ecc71,#27ae60);color:#fff;
  box-shadow:0 4px 20px rgba(46,204,113,.3);
}
.btn-green:hover{transform:translateY(-2px);box-shadow:0 6px 28px rgba(46,204,113,.4)}
.btn-block{width:100%;padding:16px;font-size:1.05rem;border-radius:12px}
.hamburger{display:none;cursor:pointer;padding:8px}
.hamburger span{display:block;width:24px;height:2px;background:var(--white);margin:5px 0;transition:.3s;border-radius:2px}

/* ===== NAV (mobile) ===== */
.nav{display:flex;align-items:center;gap:8px}
.nav a{
  padding:8px 14px;border-radius:8px;font-size:.88rem;font-weight:500;
  color:var(--gray);transition:.3s;
}
.nav a:hover,.nav a.active{color:var(--gold);background:rgba(229,165,37,.08)}

/* ===== HERO ===== */
.hero{
  padding:110px 20px 50px;text-align:center;
  background:radial-gradient(ellipse at 50% 0%,rgba(229,165,37,.06) 0%,transparent 60%);
}
.hero-logo{margin:0 auto 28px;max-width:280px}
.hero h1{
  font-size:clamp(1.6rem,4vw,2.6rem);font-weight:800;
  margin-bottom:14px;line-height:1.3;
}
.hero h1 .gold{color:var(--gold)}
.hero p{
  color:var(--gray);font-size:1.05rem;max-width:600px;margin:0 auto 30px;
}
.hero-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ===== SOCIAL BAR ===== */
.social-bar{
  display:flex;justify-content:center;gap:16px;padding:20px;margin:10px auto;max-width:400px;
}
.social-bar a{
  width:44px;height:44px;border-radius:12px;
  background:var(--card);border:1px solid var(--dark-border);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;color:var(--gray);transition:.3s;
}
.social-bar a:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}

/* ===== SECTION ===== */
.section{padding:50px 20px}
.container{max-width:1200px;margin:0 auto}
.section-title{
  text-align:center;font-size:clamp(1.4rem,3vw,2rem);
  font-weight:800;margin-bottom:36px;
}
.section-title .gold{color:var(--gold)}

/* ===== GAME CARDS (3 büyük kart - sport, casino, slot) ===== */
.game-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.game-card{
  position:relative;border-radius:var(--radius);overflow:hidden;
  cursor:pointer;transition:.3s;
  aspect-ratio:16/10;
  background:var(--card);
}
.game-card:hover{transform:translateY(-6px);box-shadow:0 12px 40px rgba(0,0,0,.5)}
.game-card-img{
  width:100%;height:100%;object-fit:cover;
  transition:.3s;
}
.game-card:hover .game-card-img{transform:scale(1.05)}
.game-card-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.2) 50%,transparent 100%);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:24px;
}
.game-card-overlay h3{
  font-size:1.3rem;font-weight:700;margin-bottom:6px;
}
.game-card-overlay p{
  font-size:.88rem;color:var(--gray);margin-bottom:14px;
}
.game-card-overlay .btn{padding:10px 24px;font-size:.85rem}

/* Placeholder for missing images */
.game-card-placeholder{
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  font-size:4rem;
}
.game-card-placeholder.sport{background:linear-gradient(135deg,#1a4a2e,#0d2818)}
.game-card-placeholder.casino{background:linear-gradient(135deg,#3a1a1a,#1a0d0d)}
.game-card-placeholder.slot{background:linear-gradient(135deg,#1a1a3a,#0d0d1a)}

/* ===== BONUS CARDS ===== */
.bonus-cards{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.bonus-card{
  background:var(--card);border:1px solid var(--dark-border);
  border-radius:var(--radius);overflow:hidden;
  transition:.3s;cursor:pointer;
  display:block;
}
.bonus-card:hover{
  transform:translateY(-4px);
  border-color:var(--gold);
  box-shadow:0 8px 30px rgba(0,0,0,.4);
}
.bonus-card-img{
  width:100%;aspect-ratio:16/9;object-fit:cover;
  background:var(--bg2);
  border-radius:var(--radius);
}
.bonus-card-placeholder{
  width:100%;aspect-ratio:16/9;
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  gap:8px;font-size:2rem;font-weight:800;
  color:var(--gold);
}
.bonus-card-placeholder span{font-size:.8rem;color:var(--gray);font-weight:400}
.bonus-card-placeholder.b1{background:linear-gradient(135deg,#1a2a1a,#0d1a0d)}
.bonus-card-placeholder.b2{background:linear-gradient(135deg,#2a1a2a,#1a0d1a)}
.bonus-card-placeholder.b3{background:linear-gradient(135deg,#1a1a2a,#0d0d2a)}
.bonus-card-placeholder.b4{background:linear-gradient(135deg,#2a2a1a,#1a1a0d)}
.bonus-card-body{padding:16px}
.bonus-card-body h3{font-size:1rem;margin-bottom:6px}
.bonus-card-body p{font-size:.82rem;color:var(--gray);line-height:1.5}

/* ===== BIG BANNER ===== */
.big-banner{
  border-radius:var(--radius);overflow:hidden;
  margin:0 auto;max-width:1200px;
  background:var(--card);
  position:relative;cursor:pointer;
  transition:.3s;
}
.big-banner:hover{box-shadow:0 8px 40px rgba(229,165,37,.15)}
.big-banner-placeholder{
  width:100%;aspect-ratio:21/7;
  background:linear-gradient(135deg,var(--bg2),var(--card),var(--bg3));
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:16px;padding:40px;text-align:center;
}
.big-banner-placeholder h2{font-size:clamp(1.4rem,3vw,2.2rem);font-weight:800}
.big-banner-placeholder h2 .gold{color:var(--gold)}
.big-banner-placeholder p{color:var(--gray);font-size:1rem;max-width:500px}

/* ===== ADVANTAGES ===== */
.advantages-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;
}
.adv-item{
  background:var(--card);border:1px solid var(--dark-border);
  border-radius:var(--radius);padding:24px;
  display:flex;gap:16px;align-items:flex-start;transition:.3s;
}
.adv-item:hover{border-color:rgba(229,165,37,.3)}
.adv-icon{
  flex-shrink:0;width:48px;height:48px;border-radius:12px;
  background:rgba(229,165,37,.1);
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;
}
.adv-item h4{font-size:.95rem;margin-bottom:4px}
.adv-item p{font-size:.82rem;color:var(--gray)}

/* ===== FAQ ===== */
.faq-list{max-width:800px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.faq-item{
  background:var(--card);border:1px solid var(--dark-border);
  border-radius:12px;overflow:hidden;
}
.faq-q{
  padding:18px 22px;display:flex;justify-content:space-between;align-items:center;
  cursor:pointer;font-weight:600;font-size:.95rem;transition:.3s;
}
.faq-q:hover{color:var(--gold)}
.faq-q .icon{color:var(--gold);font-size:1.2rem;transition:.3s}
.faq-item.active .faq-q .icon{transform:rotate(45deg)}
.faq-a{max-height:0;overflow:hidden;transition:.3s;padding:0 22px}
.faq-item.active .faq-a{max-height:300px;padding:0 22px 18px}
.faq-a p{color:var(--gray);font-size:.9rem;line-height:1.7}

/* ===== CTA ===== */
.cta{
  text-align:center;padding:60px 20px;
  background:radial-gradient(ellipse at 50% 100%,rgba(229,165,37,.05) 0%,transparent 60%);
}
.cta h2{font-size:clamp(1.4rem,3vw,2rem);margin-bottom:12px}
.cta h2 .gold{color:var(--gold)}
.cta p{color:var(--gray);margin-bottom:28px;font-size:1rem}

/* ===== FOOTER ===== */
.footer{
  background:var(--bg2);border-top:1px solid var(--dark-border);
  padding:40px 20px 20px;text-align:center;
}
.footer-logo{margin:0 auto 16px;max-width:160px}
.footer p{color:var(--gray2);font-size:.82rem;line-height:1.7;max-width:600px;margin:0 auto 16px}
.footer-social{display:flex;justify-content:center;gap:10px;margin:16px 0}
.footer-social a{
  width:38px;height:38px;border-radius:10px;
  background:var(--card);border:1px solid var(--dark-border);
  display:flex;align-items:center;justify-content:center;
  color:var(--gray2);font-size:.95rem;transition:.3s;
}
.footer-social a:hover{border-color:var(--gold);color:var(--gold)}
.sponsor-bar{text-align:center;padding:16px 0;border-bottom:1px solid var(--dark-border);margin-bottom:16px}
.footer-bottom{
  margin-top:20px;padding-top:16px;
  border-top:1px solid var(--dark-border);
  font-size:.75rem;color:var(--gray2);
}
.footer-badges{display:flex;justify-content:center;gap:10px;margin-top:10px;flex-wrap:wrap}
.badge{
  padding:4px 12px;border-radius:6px;
  background:var(--card);border:1px solid var(--dark-border);
  font-size:.72rem;color:var(--gray2);
}

/* ===== BREADCRUMB ===== */
.breadcrumb{padding:90px 20px 10px;max-width:1200px;margin:0 auto}
.breadcrumb-list{display:flex;gap:8px;font-size:.82rem;color:var(--gray2)}
.breadcrumb-list a{color:var(--gray);transition:.3s}
.breadcrumb-list a:hover{color:var(--gold)}

/* ===== PAGE HERO ===== */
.page-hero{
  padding:100px 20px 40px;text-align:center;
  background:radial-gradient(ellipse at 50% 0%,rgba(229,165,37,.04),transparent 60%);
}
.page-hero h1{font-size:clamp(1.5rem,3.5vw,2.4rem);margin-bottom:10px}
.page-hero h1 .gold{color:var(--gold)}
.page-hero p{color:var(--gray);font-size:1rem;max-width:600px;margin:0 auto}

/* ===== CONTENT ===== */
.content{padding:30px 20px 60px}
.content-wrap{max-width:900px;margin:0 auto}
.content-wrap h2{font-size:1.5rem;margin:36px 0 14px;color:var(--gold)}
.content-wrap h3{font-size:1.15rem;margin:24px 0 10px}
.content-wrap p{color:var(--gray);margin-bottom:14px;font-size:.95rem;line-height:1.8}
.content-wrap ul,.content-wrap ol{margin:14px 0;padding-left:22px}
.content-wrap li{color:var(--gray);margin-bottom:6px;font-size:.9rem;list-style:disc}
.content-wrap ol li{list-style:decimal}
.content-wrap blockquote{border-left:3px solid var(--gold);padding:14px 20px;margin:20px 0;background:rgba(229,165,37,.04);border-radius:0 8px 8px 0}
.content-wrap blockquote p{color:var(--white);margin:0}

/* TABLE */
.info-table{width:100%;border-collapse:collapse;margin:20px 0}
.info-table th,.info-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--dark-border)}
.info-table th{background:var(--card);color:var(--gold);font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}
.info-table td{color:var(--gray);font-size:.9rem}

/* CARDS GRID (sub pages) */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.card{
  background:var(--card);border:1px solid var(--dark-border);
  border-radius:var(--radius);padding:28px;transition:.3s;
}
.card:hover{transform:translateY(-4px);border-color:rgba(229,165,37,.3);box-shadow:0 8px 30px rgba(0,0,0,.4)}
.card-icon{
  width:52px;height:52px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;margin-bottom:16px;
  background:rgba(229,165,37,.1);
}
.card h3{font-size:1.1rem;margin-bottom:8px}
.card p{color:var(--gray);font-size:.88rem}
.card-link{display:inline-flex;align-items:center;gap:6px;color:var(--gold);font-size:.85rem;font-weight:600;margin-top:14px}

/* BLOG */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px}
.blog-card{
  background:var(--card);border:1px solid var(--dark-border);
  border-radius:var(--radius);overflow:hidden;transition:.3s;
}
.blog-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.4)}
.blog-card-img{height:180px;display:flex;align-items:center;justify-content:center;font-size:3rem;position:relative}
.blog-card-img .tag{position:absolute;top:10px;left:10px;padding:4px 10px;background:var(--gold);color:#000;font-size:.7rem;font-weight:700;border-radius:6px;text-transform:uppercase}
.blog-card-body{padding:20px}
.blog-card-meta{display:flex;gap:14px;font-size:.75rem;color:var(--gray2);margin-bottom:8px}
.blog-card h3{font-size:1rem;margin-bottom:6px;transition:.3s}
.blog-card:hover h3{color:var(--gold)}
.blog-card p{font-size:.85rem;color:var(--gray)}

/* BLOG DETAIL */
.blog-detail{padding:30px 20px 60px}
.blog-detail-wrap{max-width:800px;margin:0 auto}
.blog-detail h1{font-size:clamp(1.4rem,3vw,2rem);margin-bottom:12px;line-height:1.4}
.blog-detail-meta{display:flex;gap:16px;font-size:.82rem;color:var(--gray2);margin-bottom:28px;flex-wrap:wrap}
.blog-detail-content h2{font-size:1.4rem;margin:28px 0 12px;color:var(--white)}
.blog-detail-content h3{font-size:1.1rem;margin:20px 0 8px}
.blog-detail-content p{color:var(--gray);margin-bottom:14px;font-size:.95rem;line-height:1.8}
.blog-detail-content ul{margin:12px 0;padding-left:20px}
.blog-detail-content li{color:var(--gray);margin-bottom:6px;list-style:disc}
.blog-sidebar{margin-top:36px;padding:20px;background:var(--card);border:1px solid var(--dark-border);border-radius:var(--radius)}
.blog-sidebar h3{font-size:1rem;margin-bottom:12px}
.blog-sidebar a{display:block;padding:8px 0;color:var(--gray);font-size:.88rem;border-bottom:1px solid var(--dark-border);transition:.3s}
.blog-sidebar a:last-child{border:none}
.blog-sidebar a:hover{color:var(--gold)}

/* CONTACT */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.contact-item{
  display:flex;gap:14px;padding:18px;
  background:var(--card);border:1px solid var(--dark-border);border-radius:var(--radius);
}
.contact-icon{
  width:44px;height:44px;border-radius:10px;
  background:rgba(229,165,37,.1);
  display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;flex-shrink:0;
}
.contact-item h4{font-size:.9rem;margin-bottom:3px}
.contact-item p{font-size:.8rem;color:var(--gray)}
.contact-form{display:flex;flex-direction:column;gap:14px}
.contact-form label{font-size:.82rem;color:var(--gray);font-weight:500}
.contact-form input,.contact-form textarea,.contact-form select{
  background:var(--card);border:1px solid var(--dark-border);border-radius:8px;
  padding:12px 14px;color:var(--white);font-size:.9rem;font-family:inherit;transition:.3s;
}
.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{outline:none;border-color:var(--gold)}
.contact-form textarea{resize:vertical;min-height:110px}

/* BONUS PAGE GRID */
.bonus-page-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.bonus-page-card{
  background:var(--card);border:1px solid var(--dark-border);
  border-radius:var(--radius);padding:24px;text-align:center;transition:.3s;
  position:relative;overflow:hidden;
}
.bonus-page-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--gold2))}
.bonus-page-card:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 8px 30px rgba(0,0,0,.4)}
.bonus-amount{font-size:2rem;font-weight:800;color:var(--gold);margin:10px 0 6px}
.bonus-page-card h3{font-size:.95rem;color:var(--gray);font-weight:500}
.bonus-page-card p{font-size:.8rem;color:var(--gray2);margin:10px 0 16px}

/* ===== RESPONSIVE ===== */
@media(max-width:1024px){
  .game-cards{grid-template-columns:1fr 1fr}
  .bonus-cards{grid-template-columns:1fr 1fr}
  .contact-grid{grid-template-columns:1fr}
}
@media(max-width:768px){
  .nav{
    display:none;position:fixed;top:72px;left:0;right:0;bottom:0;
    background:rgba(11,15,25,.98);flex-direction:column;
    align-items:center;justify-content:center;gap:12px;
  }
  .nav.open{display:flex}
  .hamburger{display:block}
  .game-cards{grid-template-columns:1fr}
  .bonus-cards{grid-template-columns:1fr 1fr}
  .hero-btns{flex-direction:column;align-items:center}
  .btn{width:260px}
}
@media(max-width:480px){
  .bonus-cards{grid-template-columns:1fr}
  .header-btns .btn{padding:10px 18px;font-size:.82rem}
}