/* TurkSkyblock tasarım sistemi — açık mavi gökyüzü teması (2026-10-21) */
/* Yazı tipleri (yerel, Google'a istek yok). Lilita One yalnız logoda: Türkçe ğ/ş/İ yok. */
@font-face{font-family:"Nunito";font-weight:200 1000;font-display:swap;src:url(../fonts/nunito-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Nunito";font-weight:200 1000;font-display:swap;src:url(../fonts/nunito-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Lilita One";font-weight:400;font-display:swap;src:url(../fonts/lilita-one-latin-400-normal.woff2) format("woff2")}

:root{
  --zemin:#EAF5FE; --kart:#FFFFFF; --kart2:#F2F8FF;
  --baslik:#0F2F57; --metin:#2E4D70; --aciklama:#4A6585;
  --buton:#176FBA; --buton-h:#125E9F; --buton-yazi:#FFFFFF; --vurgu:#1368B3;
  --turuncu:#FFA41B; --turuncu-h:#F59300; --sari:#FFD43B;
  --cerceve:#CFE3F7; --cerceve2:#E2EEFB;
  --yesil:#23A55A; --kirmizi:#C93A3A;
  --tepe-ortu:rgba(9,42,84,.5);
  --golge:0 1px 2px rgba(15,47,87,.06),0 8px 22px rgba(15,47,87,.08);
  --golge-h:0 2px 4px rgba(15,47,87,.08),0 14px 32px rgba(15,47,87,.14);
  --r:18px; --r-s:12px;
  --serif:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --sans:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --logo:"Lilita One","Nunito",system-ui,sans-serif;
  --mono:ui-monospace,"Cascadia Mono",Consolas,monospace;
  --genislik:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--zemin);color:var(--metin);font:15.5px/1.6 var(--sans);font-weight:500;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--vurgu);text-decoration:none}
a:hover{color:var(--baslik)}
h1,h2,h3,h4{color:var(--baslik);margin:0;line-height:1.25}
p{margin:0}
.kap{max-width:var(--genislik);margin:0 auto;padding:0 20px}
svg.ti{width:1.15em;height:1.15em;vertical-align:-.18em;flex:none;stroke-width:1.9}
.gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* Butonlar */
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;border:1.5px solid transparent;
  font:800 14px/1 var(--sans);cursor:pointer;transition:background .15s,border-color .15s,transform .15s,box-shadow .15s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn-ana{background:var(--buton);color:var(--buton-yazi);box-shadow:0 4px 0 #0F5FA6}
.btn-ana:hover{background:var(--buton-h);color:var(--buton-yazi)}
.btn-cizgi{background:var(--kart);border-color:var(--cerceve);color:var(--baslik)}
.btn-cizgi:hover{border-color:var(--buton);color:var(--baslik)}
.btn-kucuk{padding:8px 14px;font-size:12.5px;box-shadow:none}

/* Duyuru şeridi */
.serit{background:var(--baslik);color:#E6F2FF;font-size:13px;text-align:center;padding:7px 16px}
.serit b{color:var(--sari)}
.serit a{display:inline-flex;align-items:center;gap:4px;margin-left:10px;background:var(--turuncu);color:#3A2300;
  padding:3px 12px;border-radius:999px;font-weight:800;font-size:12px}

/* Üst alan: görsel bant + şeffaf menü */
.tepe{position:relative;background:url(../img/bant-1920.webp) center 32%/cover no-repeat;isolation:isolate}
@media (max-width:900px){.tepe{background-image:url(../img/bant-1280.webp)}}
.tepe::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(9,42,84,.62) 0,rgba(9,42,84,.42) 55%,rgba(9,42,84,.30) 100%)}
.tepe::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:64px;z-index:-1;pointer-events:none;
  background:linear-gradient(rgba(234,245,254,0),var(--zemin))}
.tepe-ince{padding-bottom:40px}
.tepe-buyuk::before{background:linear-gradient(180deg,rgba(9,42,84,.5) 0,rgba(9,42,84,.1) 22%,rgba(9,42,84,0) 55%)}
.tepe-buyuk::after{height:34%;background:linear-gradient(rgba(234,245,254,0),rgba(234,245,254,.7) 55%,var(--zemin))}
/* Ana sayfa tepesi: Craftavia gibi tam ekran, içerik görselin üstünde yüzer */
.tepe-buyuk{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;background:#7DB9EC;overflow:hidden}

/* Hareketli HD sahne (ana sayfa). Kapsayıcı, görseli "cover" gibi yerleştirir; katmanlar görselin yüzdesiyle hizalanır */
.sahne{position:absolute;inset:0;z-index:-2;overflow:hidden;container-type:size;pointer-events:none;contain:strict;
  background:radial-gradient(120% 70% at 50% 46%,rgba(214,228,242,.85),rgba(214,228,242,0) 62%),linear-gradient(180deg,#0B57AE 0,#2F78C6 22%,#6D9FD2 42%,#A7C1DD 58%,#8FB2D8 72%,#9CC4EA 86%,#CFE6F8 100%)}
/* Ada ortada ve ekranın ~%70'i yüksekliğinde; görselin kenarları gökyüzü degradesine yumuşakça karışır */
.sahne-kap{--oran:1.7917;--boy:72cqh;position:absolute;left:50%;top:8%;height:var(--boy);width:calc(var(--boy) * var(--oran));transform:translateX(-50%)}
.sahne-ic{position:absolute;inset:0;transform-origin:50% 55%;will-change:transform;animation:sahne-suzul 45s ease-in-out infinite alternate}
.sahne-ic img{width:100%;height:100%;display:block;object-fit:cover}
@keyframes sahne-suzul{0%{transform:translate3d(0,.25%,0)}100%{transform:translate3d(0,-.25%,0)}}
@media (max-width:700px) and (orientation:portrait){
  .sahne-kap{--oran:.5625;--boy:64cqh;top:12%}
}
@media (prefers-reduced-motion:reduce){.sahne *{animation:none!important}}
.tepe-buyuk .hero{flex:1;display:flex;flex-direction:column;justify-content:center;padding:12px 0 22px}

.ust{position:relative;z-index:50}
.ust .kap{display:flex;align-items:center;gap:18px;height:84px}
.logo{font:400 26px/1 var(--logo);color:#fff;letter-spacing:.01em;text-shadow:0 2px 0 #0B3B78,0 3px 10px rgba(0,0,0,.25)}
.logo span{color:var(--sari)}
.logo:hover{color:#fff}
.tepe-buyuk .ust .logo{visibility:hidden}
.menu{display:flex;align-items:center;gap:4px;margin:0 auto;padding:6px;background:rgba(255,255,255,.95);border:1px solid #DCE8F5;border-radius:20px;
  box-shadow:0 1px 2px rgba(15,47,87,.06),0 10px 28px rgba(15,47,87,.14)}
/* Beyaz hap menü (Craftavia düzeni): ikonlu öğeler, aralarında ince ayıraç, aktif öğe açık zemin */
.menu > a,.menu-daha > button{position:relative;display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:14px;border:0;background:none;cursor:pointer;
  color:#24384F;font:800 14px/1 var(--sans);white-space:nowrap;transition:background .15s,color .15s}
.menu > a svg.ti,.menu-daha > button svg.ti{width:18px;height:18px;color:var(--vurgu);stroke-width:2}
.menu-daha > button svg.ok{width:14px;height:14px;margin-left:-3px;color:#6B86A6}
.menu > a + a::before,.menu > a + .menu-daha > button::before{content:"";position:absolute;left:-3px;top:28%;bottom:28%;width:1px;background:#E1EAF4;pointer-events:none}
.menu > a:hover,.menu-daha > button:hover{background:#F2F7FC;color:var(--baslik)}
.menu > a.aktif,.menu-daha > button.aktif{background:#EAF1F8;color:var(--baslik)}
.menu > a.aktif::before,.menu > a.aktif + a::before,.menu > a.aktif + .menu-daha > button::before,.menu-daha > button.aktif::before{opacity:0}
.hesap{display:flex;align-items:center;gap:10px}
.mobil-ac{display:none;background:rgba(255,255,255,.16);border:1.5px solid rgba(255,255,255,.4);border-radius:12px;font-size:22px;color:#fff;cursor:pointer;
  width:44px;height:44px;place-items:center;backdrop-filter:blur(6px)}

/* Cam hap düğmeler (hesap, mağaza) */
.hap{display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 16px 0 8px;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.45);color:#fff;font:800 15px/1 var(--sans);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .15s,border-color .15s}
.hap:hover{background:rgba(255,255,255,.3);border-color:#fff;color:#fff}
.hap > svg.ti{width:20px;height:20px;margin-left:6px}
.hap img{width:30px;height:30px;border-radius:9px;image-rendering:pixelated}
.hap .nokta{width:8px;height:8px}
.hap-cizgi{padding:0 22px;background:rgba(255,255,255,.08);border-width:2px;border-color:rgba(255,255,255,.75);text-transform:uppercase;letter-spacing:.04em}
.hap-cizgi > svg.ti{margin-left:0}
.hap-cizgi.aktif,.hap-cizgi.aktif:hover{background:#fff;border-color:#fff;color:var(--baslik)}

/* Açılır menüler */
.acilir{position:relative}
.acilir-liste{display:none;position:absolute;top:calc(100% + 8px);min-width:220px;padding:6px;z-index:60;border-radius:16px}
.menu-daha .acilir-liste{left:50%;transform:translateX(-50%)}
.hesap-ac .acilir-liste{right:0}
.acilir.acik .acilir-liste{display:block}
.acilir-liste a,.acilir-liste button{display:flex;width:100%;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;color:var(--metin);
  font:700 14px var(--sans);background:none;border:0;cursor:pointer;text-align:left}
.acilir-liste a:hover,.acilir-liste button:hover{background:var(--kart2);color:var(--baslik)}
.acilir-liste svg.ti{color:var(--vurgu)}
.hesap-ad{padding:8px 12px 10px;border-bottom:1px solid var(--cerceve2);margin-bottom:4px}
.hesap-ad b{display:block;color:var(--baslik);font-size:15px}
.hesap-ad small{color:var(--aciklama);font-size:12.5px;font-weight:700}
.sepet-link{position:relative;display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;
  background:rgba(255,255,255,.2);border:1.5px solid rgba(255,255,255,.45);color:#fff;backdrop-filter:blur(8px)}
.sepet-link:hover{color:#fff;background:rgba(255,255,255,.3)}
.sepet-link .sayi{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--turuncu);color:#3A2300;font-size:11.5px;font-weight:900;display:grid;place-items:center}

/* Hero (ana sayfa) */
.hero-ic{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px}
.hero-rozet{display:inline-block;padding:10px 26px;border-radius:999px;background:rgba(255,255,255,.18);border:1.5px solid rgba(255,255,255,.5);
  color:#fff;font:800 15px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;backdrop-filter:blur(8px);text-shadow:0 1px 6px rgba(0,20,50,.4)}
.hero-logo{font:400 clamp(40px,9.6vw,120px)/.95 var(--logo);color:var(--sari);letter-spacing:.01em;margin:22px 0 6px;
  -webkit-text-stroke:10px #0B3B78;paint-order:stroke fill;
  text-shadow:0 8px 0 #0B3B78,0 16px 28px rgba(5,25,55,.45)}
.hero-logo span{color:#7FD6FF}
.hero h1{font:800 clamp(17px,2vw,21px)/1.4 var(--sans);color:#fff;max-width:640px;text-shadow:0 1px 2px rgba(0,20,50,.6),0 2px 12px rgba(0,20,50,.6)}
.ip-cam{display:inline-flex;align-items:center;gap:10px;margin-top:30px;padding:13px 28px;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,.28);border:1.5px solid rgba(255,255,255,.7);color:var(--baslik);font:800 15px/1 var(--sans);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:background .15s}
.ip-cam:hover{background:rgba(255,255,255,.45)}
.ip-cam code{font:600 16px/1 var(--mono);color:var(--baslik);margin-left:6px}
.hero-butonlar{display:flex;gap:22px;flex-wrap:wrap;justify-content:center;margin-top:18px}
.buyuk-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:300px;height:72px;padding:0 34px;border-radius:999px;
  font:900 21px/1 var(--sans);letter-spacing:.02em;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s}
.buyuk-btn > svg.ti{width:28px;height:28px}
.buyuk-btn:hover{transform:translateY(-2px)}
.buyuk-btn.katil{background:var(--turuncu);color:#2B1A00;border:0;box-shadow:0 6px 0 #D97A00,0 14px 30px rgba(217,122,0,.35)}
.buyuk-btn.katil:hover{background:var(--turuncu-h)}
.buyuk-btn.discord{background:rgba(255,255,255,.88);color:var(--baslik);border:3px solid #2AA9EE;box-shadow:0 6px 0 rgba(15,95,166,.35),0 14px 30px rgba(15,47,87,.18)}
.buyuk-btn.discord:hover{background:#fff;color:var(--baslik)}
.sayac{position:absolute;top:-14px;right:22px;display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;
  background:var(--yesil);color:#fff;font:900 13.5px/1 var(--sans);letter-spacing:0;text-transform:none;box-shadow:0 3px 10px rgba(0,0,0,.18)}
.sayac i{width:7px;height:7px;border-radius:50%;background:#fff}
.sayac.mavi{background:#1696E0}
.sayac.kapali{background:#7A8BA0}
.hero-not{font-size:13px;font-weight:800;color:var(--baslik);margin-top:14px;padding:7px 16px;border-radius:999px;background:rgba(255,255,255,.72);backdrop-filter:blur(6px)}
.nokta{width:9px;height:9px;border-radius:50%;background:#3FD47A;display:inline-block;align-self:center;flex:none}
.ip-chip{font:700 15px/1 var(--mono);color:var(--baslik);background:var(--kart2);border:1.5px dashed var(--buton);
  padding:9px 12px;border-radius:12px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.ip-chip:hover{background:#E3F0FF}

/* İç sayfa başlığı (görsel bandın içinde) */
.sayfa-bas{padding-top:22px;padding-bottom:72px;position:relative}
.sayfa-bas h1{font:900 clamp(28px,3.6vw,42px)/1.15 var(--serif);color:#fff;text-shadow:0 2px 14px rgba(0,20,50,.5)}
.sayfa-bas p{color:#E8F3FF;margin-top:8px;max-width:680px;font-weight:600;text-shadow:0 1px 8px rgba(0,20,50,.5)}
.sayfa-bas .yol,.sayfa-bas .yol a{color:#CFE6FF}
.sayfa-bas .yol a:hover{color:#fff}
.sayfa-bas .btn-cizgi{background:rgba(255,255,255,.9)}

/* Bölüm başlıkları */
.bolum{padding:60px 0}
.bolum-bas{margin-bottom:26px}
.bolum-bas h2{font:900 clamp(26px,3.2vw,36px)/1.15 var(--serif);color:var(--baslik)}
.bolum-bas p{color:var(--aciklama);margin-top:6px;max-width:640px;font-weight:600}
.bolum-bas.ortala{text-align:center}
.bolum-bas.ortala p{margin-left:auto;margin-right:auto}
.bolum.koyu{background:#DCEEFD;border-top:1px solid var(--cerceve);border-bottom:1px solid var(--cerceve)}

/* Kart ızgarası */
.izgara{display:grid;gap:18px}
.izgara.u2{grid-template-columns:repeat(2,minmax(0,1fr))}
.izgara.u3{grid-template-columns:repeat(3,1fr)}
.izgara.u4{grid-template-columns:repeat(4,1fr)}
.izgara.u6{grid-template-columns:repeat(6,1fr)}
.kart{background:var(--kart);border:1px solid var(--cerceve);border-radius:var(--r);box-shadow:var(--golge)}
a.kart{color:inherit;transition:box-shadow .15s,transform .15s,border-color .15s}
a.kart:hover{box-shadow:var(--golge-h);transform:translateY(-3px);border-color:#9FCBF2}

/* Özellik kartları */
.oz{padding:22px}
.oz .ikon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#E1F0FF;
  color:var(--vurgu);font-size:24px;margin-bottom:14px}
.hk-ikon svg.ti,.oz .ikon svg.ti{width:1em;height:1em;vertical-align:0}
.oz h3{font-size:17px;font-weight:900;margin-bottom:6px}
.oz p{font-size:14px;color:var(--aciklama)}

/* Hızlı erişim */
.hizli{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px 10px;text-align:center}
.hizli .ti{font-size:28px;color:var(--vurgu)}
.hizli b{font-size:14.5px;color:var(--baslik);font-weight:900}
.hizli small{font-size:12px;color:var(--aciklama);line-height:1.35;font-weight:600}

/* Listeler */
.liste-kart{padding:18px}
.liste-kart h3{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:900}
.liste-kart h3 .ti{color:var(--vurgu)}
.liste-kart > p{font-size:12.5px;color:var(--aciklama);margin:2px 0 12px;font-weight:600}
.satir{display:flex;align-items:center;gap:12px;padding:9px 10px;border:1px solid var(--cerceve2);border-radius:12px;background:var(--kart2)}
.satir + .satir{margin-top:8px}
.satir .sira{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;font-weight:900;font-size:13px;
  background:var(--kart);border:1px solid var(--cerceve);color:var(--baslik)}
.satir .sira.s1{background:var(--sari);border-color:#F2B705;color:#3A2300}
.satir img{width:32px;height:32px;border-radius:8px;image-rendering:pixelated}
.satir b{display:block;font-size:14px;color:var(--baslik);font-weight:800}
.satir small{font-size:12px;color:var(--aciklama)}
.satir .sag{margin-left:auto;font-size:12px;color:var(--aciklama);text-align:right}

/* Nasıl girilir */
.giris-ust{display:grid;grid-template-columns:1.15fr .85fr;gap:36px;align-items:start}
.giris-ust h2{font:900 clamp(30px,4.4vw,50px)/1.08 var(--serif)}
.ust-yazi{font-size:12.5px;font-weight:900;color:var(--vurgu);margin-bottom:10px;display:block;text-transform:uppercase;letter-spacing:.12em}
.giris-ust .giris-p{color:var(--aciklama);margin:14px 0 22px;max-width:560px;font-weight:600}
.adim{display:flex;gap:14px;align-items:flex-start;padding:14px 16px}
.adim + .adim{margin-top:10px}
.adim .no{flex:0 0 40px;height:40px;border-radius:12px;background:var(--buton);color:#fff;display:grid;place-items:center;font-weight:900}
.adim h3{font-size:15.5px;font-weight:900}
.adim p{font-size:13.5px;color:var(--aciklama)}
.sunucu-kart{padding:22px}
.sunucu-kart .etiket{font-size:12.5px;font-weight:800;color:var(--aciklama);display:flex;align-items:center;gap:6px;margin-bottom:8px}
.sunucu-kart .ip-chip{width:100%;justify-content:space-between;font-size:18px;padding:14px 16px}
.sunucu-kart .bilgi{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.sunucu-kart .bilgi div{background:var(--kart2);border:1px solid var(--cerceve2);border-radius:12px;padding:10px 12px}
.sunucu-kart .bilgi small{display:block;font-size:11.5px;color:var(--aciklama);font-weight:700}
.sunucu-kart .bilgi b{font-size:14px;color:var(--baslik)}
.sunucu-kart .not{font-size:12.5px;color:var(--aciklama);margin-top:10px}

/* Rehber kartları */
.rehber{display:block;padding:16px 18px}
.rehber .kat{font-size:11.5px;font-weight:900;color:var(--vurgu);display:flex;align-items:center;gap:5px;text-transform:uppercase;letter-spacing:.06em}
.rehber h3{font-size:15.5px;font-weight:900;margin:6px 0}
.rehber p{font-size:13px;color:var(--aciklama)}
.rehber time{display:block;font-size:11.5px;color:#4A6585;margin-top:10px;font-weight:700}

/* Alt bilgi */
.alt{background:var(--baslik);color:#C7DCF3;padding:52px 0 0;margin-top:24px}
.alt-izgara{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:32px}
.alt h4{font:900 13px/1 var(--sans);color:#fff;margin-bottom:14px;text-transform:uppercase;letter-spacing:.1em}
.alt p,.alt li{font-size:13.5px;color:#B3CBE6}
.alt ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.alt ul a{color:#D7E7F8;font-weight:600}
.alt ul a:hover{color:var(--sari)}
.alt ul a::before{content:"▸ ";color:#4DB3F5}
.alt .logo{display:inline-block;margin-bottom:12px}
.sosyal{display:flex;gap:8px;margin-top:14px}
.sosyal a{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:18px}
.sosyal a:hover{border-color:var(--sari);color:var(--sari)}
.alt-son{border-top:1px solid rgba(255,255,255,.14);margin-top:36px;padding:16px 0;font-size:12.5px;color:#9FB9D6;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* Bildirim */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:var(--baslik);color:#fff;
  padding:11px 18px;border-radius:999px;font-size:13.5px;font-weight:800;opacity:0;transition:.2s;pointer-events:none;z-index:99}
.toast.goster{opacity:1;transform:translateX(-50%) translateY(0)}

/* Mobil */
@media (max-width:1100px){
  .menu > a,.menu-daha > button{padding:9px 9px;font-size:13px;gap:5px}
  .hesap .hap span{display:none}
  .hap{padding:0 8px}
  .hap > svg.ti{margin:0 4px}
  .hap-cizgi{padding:0 13px}
}
@media (max-width:991px){
  .menu{display:none}
  .mobil-ac{display:grid}
  .ust .kap{gap:10px;height:72px}
  .tepe-buyuk .ust .logo{visibility:visible}
  .logo{font-size:22px;margin-right:auto}
  .menu.acik{display:flex;flex-direction:column;align-items:stretch;gap:2px;position:absolute;top:72px;left:12px;right:12px;
    background:var(--kart);border:1px solid var(--cerceve);border-radius:18px;padding:8px;box-shadow:var(--golge-h)}
  .menu.acik > a,.menu.acik .menu-daha > button{color:var(--baslik);text-shadow:none;font-size:15.5px;padding:12px 14px;border-radius:12px;width:100%;justify-content:flex-start}
  .menu.acik > a::before,.menu.acik .menu-daha > button::before{display:none}
  .menu.acik > a.aktif{background:var(--kart2)}
  .menu.acik .menu-daha > button{display:none}
  .menu.acik .menu-daha .acilir-liste{display:block;position:static;transform:none;box-shadow:none;border:0;padding:0;min-width:0;border-top:1px solid var(--cerceve2);border-radius:0;margin-top:4px;padding-top:4px}
  .izgara.u4,.izgara.u3{grid-template-columns:repeat(2,1fr)}
  .izgara.u6{grid-template-columns:repeat(3,1fr)}
  .giris-ust,.alt-izgara{grid-template-columns:1fr}
}
@media (max-width:640px){
  .kap{padding:0 16px}
  .tepe-buyuk .hero{padding:12px 0 36px}
  .hero-rozet{font-size:12px;padding:8px 18px;letter-spacing:.14em}
  .hero-logo{-webkit-text-stroke:7px #0B3B78;text-shadow:0 5px 0 #0B3B78,0 10px 20px rgba(5,25,55,.45);margin-top:12px}
  .ip-cam{margin-top:16px;padding:12px 18px;font-size:14px}
  .ip-cam span{display:none}
  .hero-butonlar{flex-direction:column;align-items:stretch;width:100%;gap:22px}
  .buyuk-btn{min-width:0;width:100%;height:62px;font-size:18px}
  .izgara.u4,.izgara.u3{grid-template-columns:1fr}
  .izgara.u6{grid-template-columns:repeat(2,1fr)}
  .bolum{padding:42px 0}
  .serit a{display:none}
  .sayfa-bas{padding-top:10px;padding-bottom:64px}
}

/* ===== İç sayfalar ===== */
.yol{font-size:12.5px;color:var(--aciklama);margin-bottom:10px;display:flex;gap:6px;flex-wrap:wrap}
.yol a{color:var(--aciklama)}
.yol a:hover{color:var(--vurgu)}
.ic{padding-top:24px;padding-bottom:56px}
.iki-kolon{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:start}
.iki-kolon.yan-sag{grid-template-columns:minmax(0,1fr) 300px}
.urun-detay.genis{grid-template-columns:1.4fr .8fr}
.urun-detay.oy{grid-template-columns:1.2fr .8fr}
.yan-menu{padding:10px;position:sticky;top:84px}
.yan-menu a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;color:var(--metin);font-weight:600;font-size:14px}
.yan-menu a:hover,.yan-menu a.aktif{background:var(--kart2);color:var(--baslik)}
.yan-menu a.aktif{box-shadow:inset 3px 0 0 var(--buton)}
.yan-menu .sayi{margin-left:auto;font-size:12px;color:var(--aciklama)}
.kutu{padding:22px}
.kutu + .kutu{margin-top:16px}
.kutu h2{font-size:18px;font-weight:800;margin-bottom:12px}

/* Bildirim kutuları */
.uyari{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:10px;font-size:14px;margin-bottom:16px;border:1px solid}
.uyari.basari{background:#EEF6EE;border-color:#BFDCC2;color:#2F6B3E}
.uyari.hata{background:#FBEDEA;border-color:#EBC3BC;color:#8E3328}
.uyari.bilgi{background:#E8F3FF;border-color:var(--cerceve);color:#1D4E85}
.uyari a{text-decoration:underline;text-underline-offset:2px}
.uyari ul{margin:4px 0 0;padding-left:18px}

/* Formlar */
.form-izgara{display:grid;gap:14px}
.alan label{display:block;font-size:13px;font-weight:700;color:var(--baslik);margin-bottom:6px}
.alan .ipucu{font-size:12px;color:var(--aciklama);margin-top:5px}
.girdi{width:100%;padding:11px 13px;border:1px solid var(--cerceve);border-radius:10px;background:#fff;color:var(--baslik);
  font:500 14.5px/1.4 var(--sans);transition:border-color .15s,box-shadow .15s}
.girdi:focus{outline:none;border-color:var(--buton);box-shadow:0 0 0 3px rgba(30,134,220,.22)}
textarea.girdi{min-height:140px;resize:vertical}
select.girdi{appearance:auto}
.alan.hatali .girdi{border-color:#D99085}
.alan .hata-metni{font-size:12.5px;color:var(--kirmizi);margin-top:5px}
.onay{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--metin)}
.onay input{width:16px;height:16px;accent-color:var(--vurgu)}
.giris-kutu{max-width:440px;margin:40px auto 64px;padding:28px}
.giris-kutu h1{font:900 28px/1.2 var(--serif);margin-bottom:6px}
.giris-kutu > p{color:var(--aciklama);font-size:14px;margin-bottom:20px}
.giris-kutu .alt-link{text-align:center;font-size:13.5px;color:var(--aciklama);margin-top:18px}
.btn-tam{width:100%;justify-content:center;padding:12px 18px}
.btn[disabled]{opacity:.55;cursor:not-allowed}
.btn-tehlike{background:#fff;border-color:#E6C2BC;color:var(--kirmizi)}
.btn-tehlike:hover{border-color:var(--kirmizi);color:var(--kirmizi)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Mağaza */
.sekme{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.sekme a{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid var(--cerceve);
  background:var(--kart);color:var(--metin);font-weight:700;font-size:13.5px}
.sekme a:hover{border-color:var(--buton);color:var(--baslik)}
.sekme a.aktif{background:var(--buton);border-color:var(--buton);color:#fff;font-weight:800}
.urun{display:flex;flex-direction:column;overflow:hidden}
.urun-gorsel{aspect-ratio:16/10;background:var(--kart2);border-bottom:1px solid var(--cerceve2);display:grid;place-items:center;color:var(--vurgu);position:relative}
.urun-gorsel img{width:100%;height:100%;object-fit:cover}
.urun-gorsel svg.ti{width:52px;height:52px;stroke-width:1.4}
.rozet{position:absolute;top:10px;left:10px;background:var(--kirmizi);color:#fff;font-size:12px;font-weight:800;padding:4px 8px;border-radius:7px}
.rozet.one{background:var(--buton);color:#fff;left:auto;right:10px}
.urun-ic{padding:16px;display:flex;flex-direction:column;gap:6px;flex:1}
.urun-ic h3{font-size:16px;font-weight:800}
.urun-ic p{font-size:13px;color:var(--aciklama);flex:1}
.fiyat{display:flex;align-items:baseline;gap:8px;margin-top:6px}
.fiyat b{font-size:19px;color:var(--baslik)}
.fiyat s{font-size:13px;color:#5B7799}
.urun-alt{display:flex;gap:8px;align-items:center;margin-top:10px}
.urun-alt form{margin-left:auto}
.urun-detay{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:start}
.urun-detay .urun-gorsel{border-radius:var(--r);border:1px solid var(--cerceve)}
.icerik-metin{font-size:15px;line-height:1.75;color:var(--metin)}
.icerik-metin h2{font:800 22px/1.3 var(--sans);margin:28px 0 10px}
.icerik-metin h3{font:800 18px/1.3 var(--sans);margin:22px 0 8px}
.icerik-metin p{margin:0 0 14px}
.icerik-metin ul,.icerik-metin ol{margin:0 0 14px;padding-left:22px}
.icerik-metin li{margin-bottom:6px}
.icerik-metin a{text-decoration:underline;text-underline-offset:2px}
.icerik-metin img{border-radius:10px;border:1px solid var(--cerceve);margin:14px 0}
.icerik-metin code{font-family:var(--mono);background:var(--kart2);border:1px solid var(--cerceve2);padding:1px 6px;border-radius:6px;font-size:.92em}
.icerik-metin blockquote{margin:0 0 14px;padding:10px 16px;border-left:3px solid var(--buton);background:var(--kart2);border-radius:0 10px 10px 0}
.adet{display:inline-flex;align-items:center;border:1px solid var(--cerceve);border-radius:10px;overflow:hidden;background:#fff}
.adet button{width:34px;height:38px;border:0;background:var(--kart2);color:var(--baslik);font-size:18px;cursor:pointer}
.adet input{width:46px;height:38px;border:0;text-align:center;font:700 15px var(--sans);color:var(--baslik);-moz-appearance:textfield}
.adet input::-webkit-inner-spin-button{display:none}

/* Tablolar */
.tablo-kap{overflow-x:auto}
.tablo{width:100%;border-collapse:collapse;font-size:14px}
.tablo th{text-align:left;font-size:12px;font-weight:800;color:var(--aciklama);padding:10px 12px;border-bottom:1px solid var(--cerceve)}
.tablo td{padding:12px;border-bottom:1px solid var(--cerceve2);color:var(--metin);vertical-align:middle}
.tablo tr:last-child td{border-bottom:0}
.tablo .sag{text-align:right}
.oyuncu{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--baslik)}
.oyuncu img{width:28px;height:28px;border-radius:6px;image-rendering:pixelated}
.durum{display:inline-block;font-size:12px;font-weight:800;padding:3px 9px;border-radius:999px;border:1px solid var(--cerceve);background:var(--kart2);color:var(--metin)}
.durum.yesil{background:#EEF6EE;border-color:#BFDCC2;color:#2F6B3E}
.durum.sari{background:#FBF4E6;border-color:#EBD6AE;color:#8A6420}
.durum.kirmizi{background:#FBEDEA;border-color:#EBC3BC;color:#8E3328}
.ozet-satir{display:flex;justify-content:space-between;padding:8px 0;font-size:14px;color:var(--metin)}
.ozet-satir.toplam{border-top:1px solid var(--cerceve);margin-top:6px;padding-top:12px;font-size:17px;font-weight:800;color:var(--baslik)}
.bos{padding:40px 20px;text-align:center;color:var(--aciklama)}
.bos svg.ti{width:40px;height:40px;color:var(--buton);margin:0 auto 10px;display:block}

/* Sıralama */
.podyum{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:18px}
.podyum .kart{padding:18px;text-align:center}
.podyum img{width:64px;height:64px;margin:0 auto 10px;border-radius:10px;image-rendering:pixelated}
.podyum b{display:block;font-size:16px;color:var(--baslik)}
.podyum small{color:var(--aciklama)}
.podyum .no{display:inline-block;font-weight:900;color:var(--vurgu);margin-bottom:6px}

/* Profil */
.profil-bas{display:flex;gap:20px;align-items:center;padding:22px}
.profil-bas img{width:96px;height:96px;border-radius:14px;image-rendering:pixelated;border:1px solid var(--cerceve)}
.profil-bas h1{font:900 30px/1.1 var(--serif)}
.profil-bas p{color:var(--aciklama);font-size:14px;margin-top:6px}
.sayilar{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}
.sayilar div{padding:14px;text-align:center}
.sayilar b{display:block;font-size:20px;color:var(--baslik)}
.sayilar small{font-size:12px;color:var(--aciklama)}

/* Destek mesajları */
.mesaj{padding:16px 18px}
.mesaj + .mesaj{margin-top:12px}
.mesaj.yetkili{border-color:#9FCBF2;background:#F2F9FF}
.mesaj-bas{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:13px;color:var(--aciklama)}
.mesaj-bas b{color:var(--baslik);font-size:14px}
.mesaj-bas time{margin-left:auto}
.mesaj-govde{font-size:14.5px;line-height:1.65;white-space:pre-wrap;word-wrap:break-word}

/* Oy */
.oy-kart{display:flex;align-items:center;gap:14px;padding:16px}
.oy-kart .no{flex:0 0 40px;height:40px;border-radius:10px;background:var(--kart2);border:1px solid var(--cerceve2);display:grid;place-items:center;font-weight:900;color:var(--vurgu)}
.oy-kart b{display:block;color:var(--baslik)}
.oy-kart small{color:var(--aciklama);font-size:12.5px}
.oy-kart .btn{margin-left:auto}

/* Sayfalama */
.sayfalama{display:flex;gap:6px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.sayfalama a,.sayfalama span{min-width:36px;height:36px;padding:0 10px;display:inline-grid;place-items:center;border-radius:9px;border:1px solid var(--cerceve);background:var(--kart);font-weight:700;font-size:13.5px;color:var(--metin)}
.sayfalama .aktif{background:var(--buton);border-color:var(--buton);color:#fff}
.sayfalama .pasif{opacity:.45}

@media (max-width:991px){
  .iki-kolon,.iki-kolon.yan-sag,.urun-detay,.urun-detay.genis,.urun-detay.oy{grid-template-columns:minmax(0,1fr)}
  .yan-menu{position:static}
  .sayilar{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .podyum{grid-template-columns:1fr}
  .izgara.u2{grid-template-columns:minmax(0,1fr)}
  .profil-bas{flex-direction:column;text-align:center}
  .oy-kart{flex-wrap:wrap}
  .oy-kart .btn{margin-left:0;width:100%;justify-content:center}
  .hesap-ac > button span{display:none}
  .giris-kutu{margin:24px auto 40px;padding:20px}
}

/* ===== Ana sayfa ek bölümleri (2026-10-21) ===== */
/* Sayılar şeridi: hero'nun altına biner */
.sayilar-serit{position:relative;z-index:3;width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:40px}
.sayi-kart{display:flex;align-items:center;gap:14px;padding:16px 18px;background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.8);border-radius:var(--r);
  box-shadow:0 10px 30px rgba(15,47,87,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.kesfet{align-self:center;display:inline-flex;flex-direction:column;align-items:center;gap:2px;margin-top:22px;font:900 11px/1 var(--sans);
  letter-spacing:.24em;text-transform:uppercase;color:var(--baslik);opacity:.75}
.kesfet:hover{opacity:1;color:var(--baslik)}
.kesfet svg.ti{width:20px;height:20px}
@media (max-height:760px) and (min-width:641px){.hero-logo{font-size:clamp(44px,7.6vw,90px);margin:10px 0 2px}.hero-ic{gap:14px}.ip-cam{margin-top:16px}.sayilar-serit{margin-top:24px}}
.sayi-kart .ikon{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:#E1F0FF;color:var(--vurgu)}
.sayi-kart .ikon svg.ti{width:24px;height:24px;vertical-align:0}
.sayi-kart.yesil .ikon{background:#DDF7EC;color:#059669}
.sayi-kart.turuncu .ikon{background:#FEF1D6;color:#D97706}
.sayi-kart.mor .ikon{background:#EDE6FE;color:#7C3AED}
.sayi-kart b{display:block;font:900 24px/1 var(--sans);color:var(--baslik);letter-spacing:-.02em}
.sayi-kart small{display:block;font-size:12.5px;font-weight:700;color:var(--aciklama);margin-top:4px}

.hedef{display:flex;align-items:center;gap:16px;padding:14px 18px;margin-top:14px}
.hedef .hedef-ikon{flex:none;width:44px;height:44px;border-radius:13px;background:#FEF1D6;color:#D97706;display:grid;place-items:center}
.hedef .hedef-ikon svg.ti{width:22px;height:22px;vertical-align:0}
.hedef .hedef-ic{flex:1;min-width:0}
.hedef b{display:block;font-size:14.5px;color:var(--baslik);font-weight:900}
.hedef small{font-size:12.5px;color:var(--aciklama);font-weight:600}
.hedef .cubuk{height:8px;border-radius:8px;background:#E3EEF9;margin-top:8px;overflow:hidden}
.hedef .cubuk span{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,#1E86DC,#7FD6FF)}
.hedef .yuzde{font:900 22px/1 var(--sans);color:var(--vurgu);flex:none}

/* Sekmeli sıralama */
.sekmeler{display:flex;gap:4px;padding:4px;background:var(--kart2);border:1px solid var(--cerceve2);border-radius:12px;margin:0 0 12px}
.sekmeler button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:7px 4px;border:0;border-radius:9px;background:none;
  font:800 12.5px/1 var(--sans);color:var(--aciklama);cursor:pointer;transition:background .15s,color .15s}
.sekmeler button svg.ti{width:15px;height:15px}
.sekmeler button:hover{color:var(--baslik)}
.sekmeler button.aktif{background:var(--kart);color:var(--baslik);box-shadow:var(--golge)}
.satir .deger{margin-left:auto;font:900 13.5px/1 var(--sans);color:var(--vurgu);white-space:nowrap}
.satir .sira.s2{background:#E8EEF5;border-color:#CBD5E1}
.satir .sira.s3{background:#F6E7D9;border-color:#E6C9AE}
.liste-kart .tum{display:inline-flex;align-items:center;gap:4px;margin-top:12px;font-size:13px;font-weight:800}

/* Topluluk */
.topluluk{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:18px}
.discord-kart{padding:22px;color:#fff;background:linear-gradient(135deg,#5865F2 0,#4752C4 100%);border:0;display:flex;flex-direction:column;gap:12px}
.discord-kart .ust{display:flex;align-items:center;gap:12px}
.discord-kart .ust svg.ti{width:40px;height:40px;vertical-align:0}
.discord-kart h3{color:#fff;font-size:20px;font-weight:900}
.discord-kart p{color:#E3E6FF;font-size:13.5px;font-weight:600}
.discord-kart .sayac-satir{display:flex;gap:16px}
.discord-kart .sayac-satir div{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:800}
.discord-kart .sayac-satir i{width:9px;height:9px;border-radius:50%;background:#3BA55D}
.discord-kart .sayac-satir i.gri{background:#B9BBE8}
.discord-kart .btn{align-self:flex-start;background:#fff;color:#4752C4;box-shadow:0 4px 0 rgba(0,0,0,.18)}
.discord-kart .btn:hover{background:#F2F3FF;color:#4752C4}
.sosyal-kart{padding:20px}
.sosyal-kart h3,.oy-lider h3{font-size:16px;font-weight:900;display:flex;align-items:center;gap:8px}
.sosyal-kart h3 svg.ti,.oy-lider h3 svg.ti{color:var(--vurgu)}
.sosyal-kart > p,.oy-lider > p{font-size:12.5px;color:var(--aciklama);font-weight:600;margin:2px 0 12px}
.sosyal-liste{display:grid;gap:8px}
.sosyal-liste a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;border:1px solid var(--cerceve2);background:var(--kart2);color:var(--baslik);font-weight:800;font-size:14px;transition:border-color .15s,transform .15s}
.sosyal-liste a:hover{border-color:var(--buton);transform:translateX(2px)}
.sosyal-liste a svg.ti{width:20px;height:20px}
.sosyal-liste .yt svg.ti{color:#FF0000}.sosyal-liste .tt svg.ti{color:#111}.sosyal-liste .ig svg.ti{color:#E1306C}
.sosyal-liste small{margin-left:auto;font-size:12px;color:var(--aciklama)}
.oy-lider{padding:20px}
.oy-lider .satir .sag b{color:var(--vurgu)}

/* SSS */
.sss{display:grid;gap:10px}
.sss details{background:var(--kart);border:1px solid var(--cerceve);border-radius:14px;box-shadow:var(--golge);overflow:hidden}
.sss summary{display:flex;align-items:center;gap:12px;padding:15px 18px;cursor:pointer;list-style:none;font-weight:800;font-size:15px;color:var(--baslik)}
.sss summary::-webkit-details-marker{display:none}
.sss summary svg.ti{flex:none;color:var(--vurgu);transition:transform .2s}
.sss details[open] summary svg.ti.ok{transform:rotate(180deg)}
.sss summary .ok{margin-left:auto}
.sss .sss-govde{padding:0 18px 16px 48px;font-size:14px;color:var(--metin)}
.sss .sss-govde a{font-weight:800}
.sss-bas{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}

@media (max-width:991px){
  .sayilar-serit{grid-template-columns:repeat(2,1fr)}
  .topluluk{grid-template-columns:1fr}
}
@media (max-width:640px){
  .sayilar-serit{margin-top:28px;gap:10px}
  .kesfet{display:none}
  .sayi-kart{padding:12px 14px;gap:10px}
  .sayi-kart .ikon{width:38px;height:38px}
  .sayi-kart b{font-size:19px}
  .sss-bas{flex-direction:column;align-items:flex-start}
  .sss .sss-govde{padding-left:18px}
}
.discord-kart{justify-content:center}

/* Performans: hareketli sahnenin üstündeki öğelerde backdrop-filter kapalı (her karede bulanıklık yeniden hesaplanır) */
.tepe-buyuk .hap,.tepe-buyuk .sepet-link,.tepe-buyuk .mobil-ac,.tepe-buyuk .hero-rozet,.tepe-buyuk .ip-cam,.tepe-buyuk .hero-not,.tepe-buyuk .sayi-kart{backdrop-filter:none;-webkit-backdrop-filter:none}
.tepe-buyuk .mobil-ac,.tepe-buyuk .hero-rozet{background:rgba(9,42,84,.32)}
.tepe-buyuk .ip-cam{background:rgba(255,255,255,.62)}
.tepe-buyuk .hero-not{background:rgba(255,255,255,.85)}
.tepe-buyuk .sayi-kart{background:rgba(255,255,255,.95)}
.tepe-buyuk.durdur *,.tepe-buyuk.durdur *::before{animation-play-state:paused!important}

/* Hesap ve sepet düğmeleri menüyle aynı beyaz hap */
.ust .hap,.ust .sepet-link{background:rgba(255,255,255,.95);border:1px solid #DCE8F5;color:#24384F;box-shadow:0 1px 2px rgba(15,47,87,.06),0 10px 28px rgba(15,47,87,.14);
  backdrop-filter:none;-webkit-backdrop-filter:none;height:48px;font-size:14px;white-space:nowrap;flex:none}
.ust .hesap{flex:none}
.ust .hap{padding:0 16px 0 10px}
.ust .hap img{width:30px;height:30px}
.ust .sepet-link{width:48px}
.ust .hap:hover,.ust .sepet-link:hover{background:#fff;border-color:#BBD3EC;color:var(--baslik)}
.ust .hap > svg.ti,.ust .sepet-link svg.ti{color:var(--vurgu)}
@media (max-width:1280px) and (min-width:992px){.menu > a svg.ti,.menu-daha > button svg.ti:not(.ok){display:none}}
