:root{
  --zemin:#0f1424; --zemin2:#141b33; --panel:#1a2240; --panel2:#222c52; --cizgi:#2e3a6b;
  --yazi:#eef1fb; --soluk:#9aa5c9; --vurgu:#ff9f1c; --vurgu2:#ffbf47; --turkuaz:#2ec4b6; --kirmizi:#ef5b5b; --yesil:#4fd17a;
  --r:16px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--zemin);color:var(--yazi);font:16px/1.6 Nunito,system-ui,sans-serif;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:var(--vurgu2);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:'Baloo 2',Nunito,sans-serif;line-height:1.15;margin:0 0 .5em}
img{max-width:100%;display:block}
.kap{max-width:1180px;margin:0 auto;padding:0 16px}
.soluk{color:var(--soluk)}

/* butonlar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font:800 16px Nunito,sans-serif;border:0;border-radius:12px;padding:12px 22px;cursor:pointer;color:#241300;background:linear-gradient(180deg,var(--vurgu2),var(--vurgu));box-shadow:0 4px 0 #b4670a;text-decoration:none!important;transition:transform .08s}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #b4670a}
.btnKucuk{padding:7px 14px;font-size:14px;border-radius:10px;box-shadow:0 3px 0 #b4670a}
.btnIkincil{background:var(--panel2);color:var(--yazi);box-shadow:0 4px 0 #0a0f1f}
.btnBuyuk{padding:16px 34px;font-size:20px}

/* üst menü */
.ust{background:#0b1020ee;border-bottom:1px solid var(--cizgi);position:sticky;top:0;z-index:20;backdrop-filter:blur(6px)}
.ustIc{display:flex;align-items:center;justify-content:space-between;height:64px;gap:12px}
.logo{display:flex;align-items:center;gap:8px;color:var(--yazi);font:800 22px 'Baloo 2',sans-serif;text-decoration:none!important}
.logo b{color:var(--vurgu)}
.logoIkon{font-size:28px}
.nav{display:flex;align-items:center;gap:18px}
.nav a{color:var(--yazi);font-weight:800}
.nav a.navIkincil{color:var(--soluk)}
.menuBtn{display:none;background:none;border:0;color:var(--yazi);font-size:28px;cursor:pointer}
@media (max-width:760px){
  .menuBtn{display:block}
  .nav{display:none;position:absolute;top:64px;left:0;right:0;background:#0b1020;flex-direction:column;align-items:stretch;padding:12px 16px 18px;gap:12px;border-bottom:1px solid var(--cizgi)}
  body.menuAcik .nav{display:flex}
}
.duyuruBant{background:#3a2a0a;border-bottom:1px solid #6b4a12;padding:9px 0;font-weight:700;font-size:15px}

/* hero */
.hero{position:relative;overflow:hidden;padding:56px 0 46px;background:radial-gradient(ellipse at 80% 0%,#3a2a7a 0%,transparent 55%),radial-gradient(ellipse at 0% 100%,#0e4a52 0%,transparent 50%),var(--zemin2);border-bottom:1px solid var(--cizgi)}
.heroIc{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center}
.hero h1{font-size:clamp(34px,5vw,56px)}
.hero h1 span{color:var(--vurgu)}
.hero p{font-size:19px;color:#c9d0ea;max-width:560px}
.heroBtn{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.heroGorsel{border-radius:20px;overflow:hidden;border:3px solid var(--cizgi);box-shadow:0 20px 50px #0009;transform:rotate(1.5deg)}
.rozetSira{display:flex;gap:18px;margin-top:22px;flex-wrap:wrap;color:var(--soluk);font-weight:700;font-size:15px}
@media (max-width:860px){.heroIc{grid-template-columns:1fr}.heroGorsel{transform:none}}

/* bölümler */
.bolum{padding:42px 0}
.bolumBaslik{display:flex;justify-content:space-between;align-items:end;gap:12px;margin-bottom:18px}
.bolumBaslik h2{font-size:32px;margin:0}

/* oyun kartları */
.oyunIzgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px}
.oyunKart{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--r);overflow:hidden;color:var(--yazi);text-decoration:none!important;transition:transform .15s,box-shadow .15s;display:flex;flex-direction:column}
.oyunKart:hover{transform:translateY(-4px);box-shadow:0 14px 30px #0008;border-color:var(--vurgu)}
.oyunKapak{aspect-ratio:16/9;background:#000 center/cover;position:relative}
.oyunEtiket{position:absolute;top:10px;left:10px;background:#000b;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:800}
.oyunBilgi{padding:14px 16px 16px;display:flex;flex-direction:column;flex:1}
.oyunBilgi h3{font-size:22px;margin:0 0 4px}
.oyunBilgi p{margin:0 0 12px;color:var(--soluk);font-size:14px;flex:1}
.oyunAlt{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--soluk)}
.yakinda{border-style:dashed;opacity:.75}
.yakinda .oyunKapak{display:grid;place-items:center;font-size:54px;background:linear-gradient(135deg,#1d2650,#2a1d50)}

/* içerik / özellik kartları */
.ozellikler{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.ozellik{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--r);padding:20px}
.ozellik .ik{font-size:34px}
.ozellik h3{font-size:20px;margin:8px 0 6px}
.ozellik p{margin:0;color:var(--soluk);font-size:15px}
.sss details{background:var(--panel);border:1px solid var(--cizgi);border-radius:12px;padding:14px 18px;margin-bottom:10px}
.sss summary{font-weight:800;cursor:pointer}
.sss p{color:#c9d0ea;margin:10px 0 0}

/* metin sayfaları */
.metin{max-width:820px;margin:0 auto;padding:40px 16px 56px}
.metin h1{font-size:40px}
.metin h2{font-size:26px;margin-top:1.6em;color:var(--vurgu2)}
.metin p,.metin li{color:#d3d9ef}
.metin .guncelleme{color:var(--soluk);font-size:14px}

/* formlar */
.formKart{max-width:440px;margin:40px auto 56px;background:var(--panel);border:1px solid var(--cizgi);border-radius:20px;padding:28px 24px;box-shadow:0 16px 40px #0007}
.formKart h1{font-size:32px;text-align:center}
.alan{margin-bottom:14px}
.alan label{display:block;font-weight:800;margin-bottom:5px;font-size:14px}
.alan input,.alan textarea,.alan select{width:100%;padding:12px 13px;border-radius:10px;border:2px solid var(--cizgi);background:#0d1328;color:#fff;font:inherit}
.alan input:focus,.alan textarea:focus{outline:none;border-color:var(--vurgu)}
.alan small{color:var(--soluk)}
.onay{display:flex;gap:9px;align-items:flex-start;font-size:14px;color:#c9d0ea;margin-bottom:16px}
.onay input{margin-top:4px;width:18px;height:18px}
.formKart .btn{width:100%}
.uyari{padding:11px 14px;border-radius:10px;margin-bottom:14px;font-weight:700;font-size:15px}
.uyari.hata{background:#4a1c1c;border:1px solid #8a3030;color:#ffc4c4}
.uyari.tamam{background:#173a2a;border:1px solid #2f7a52;color:#c4ffd9}
.formAlt{text-align:center;margin-top:16px;color:var(--soluk);font-size:15px}

/* oyun tanıtım sayfası */
.tanitim{display:grid;grid-template-columns:1fr 320px;gap:26px;padding:30px 0 50px}
.tanitimAna h1{font-size:44px;margin-bottom:6px}
.oynaKutu{position:relative;border-radius:20px;overflow:hidden;border:3px solid var(--cizgi);margin:16px 0 20px}
.oynaKutu img{width:100%}
.oynaKutu .oynaUst{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(transparent 30%,#000a)}
.galeri{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0}
.galeri img{border-radius:12px;border:1px solid var(--cizgi)}
.tanitimYan{display:flex;flex-direction:column;gap:18px}
.yanKart{background:var(--panel);border:1px solid var(--cizgi);border-radius:var(--r);padding:16px}
.yanKart h3{font-size:20px}
.tus{display:inline-block;background:#0d1328;border:1px solid var(--cizgi);border-bottom-width:3px;border-radius:6px;padding:0 7px;font-size:13px;font-weight:800;min-width:24px;text-align:center}
.liste{width:100%;border-collapse:collapse;font-size:14px}
.liste td,.liste th{padding:7px 6px;border-bottom:1px solid #ffffff10;text-align:left}
.liste th{color:var(--soluk);font-size:12px}
.nokta{display:inline-block;width:8px;height:8px;border-radius:50%;background:#555;margin-right:6px}
.nokta.on{background:var(--yesil)}
@media (max-width:900px){.tanitim{grid-template-columns:1fr}.galeri{grid-template-columns:1fr 1fr}}

/* profil */
.istatIzgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:14px 0 24px}
.istat{background:var(--panel);border:1px solid var(--cizgi);border-radius:14px;padding:14px 16px}
.istat b{display:block;font-size:26px;color:var(--vurgu2);font-family:'Baloo 2'}
.istat span{color:var(--soluk);font-size:14px}

/* reklam */
.reklam{margin:22px auto;text-align:center;min-height:90px;position:relative;max-width:1180px}
.reklamEtiket{display:block;font-size:11px;color:#6d779b;letter-spacing:1px;text-transform:uppercase;margin-bottom:4px}
.reklamBos{border:2px dashed #3b4780;border-radius:12px;padding:22px;color:#7d88b3;font-size:14px}
.reklamYan{min-height:250px;margin:0}

/* alt kısım */
.alt{background:#0b1020;border-top:1px solid var(--cizgi);padding:30px 0 18px;margin-top:20px}
.altIc{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}
.altIc p{max-width:360px;font-size:14px}
.altLinkler{display:flex;flex-direction:column;gap:6px}
.altLinkler a{color:var(--soluk)}
.telif{color:#6d779b;font-size:13px;margin-top:18px;padding-top:14px;border-top:1px solid #ffffff0d}