/* bahissite.com — sıcak siyah zemin + ALTIN gradyan.
   Altın birincil vurgu; zümrüt yalnız "açık/çalışıyor" anlamı taşıyan küçük yerlerde ikincil.
   tanitim'den ayrışma zeminin tonunda (orası mavi-siyah + mavi ışık, burası sıcak siyah +
   altın/kehribar ışık) ve başlık yazı tipinde (Cinzel değil Playfair Display).

   Önceki sürüm soluk duruyordu: vurgu zümrüttü, metin ve kenarlıklar düşük kontrastlıydı,
   H1 gradyanı şeffafa gidiyordu. Hepsi yükseltildi. */

:root{
  --zemin:#090906; --zemin2:#0e0d09;
  --kart:#15130d; --kart2:#1c1a12;
  --cizgi:rgba(227,181,74,.14); --cizgi2:rgba(227,181,74,.42);
  --yazi:#f7f3e9; --soluk:#c2b89f; --soluk2:#8d8470;
  --altin:#e3b54a; --altin-a:#fbe7a1; --altin-k:#a8761f;
  --altin-grad:linear-gradient(135deg,#fbe7a1 0%,#e9c065 38%,#c9922e 70%,#f3d487 100%);
  --yesil:#3fd89a;
  --r:18px; --r-k:12px;
  --baslik:'Playfair Display',Georgia,'Times New Roman',serif;
  --govde:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --golge:0 1px 0 rgba(255,255,255,.05) inset,0 18px 40px -18px rgba(0,0,0,.8);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--zemin);color:var(--yazi);font:16px/1.65 var(--govde);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}

/* YATAY KAYMA: iPhone Safari, body'deki overflow-x:hidden'a rağmen parmakla yana kaydırmaya
   izin verebiliyor. "clip" gerçekten keser ve (hidden'ın aksine) kaydırma kabı oluşturmadığı
   için yapışkan üst bandı BOZMAZ. html'e "hidden" konmaz — body kaydırma kabına döner. */
@supports (overflow:clip){html,body{overflow-x:clip}}

/* zemin ışıkları — düz siyah yerine derinlik; ikisi de altın/kehribar tonunda */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(920px 540px at 84% -8%,rgba(227,181,74,.17),transparent 62%),
    radial-gradient(720px 500px at -8% 6%,rgba(168,118,31,.13),transparent 62%),
    linear-gradient(180deg,#090906 0%,#0e0d09 100%)}

img,svg{max-width:100%;height:auto}
a{color:var(--altin-a);text-underline-offset:3px}
a:hover{color:#fff}
:focus-visible{outline:2px solid var(--altin);outline-offset:3px;border-radius:6px}

.kap{max-width:1120px;margin:0 auto;padding:0 20px;width:100%}
.atla{position:absolute;left:-999px;top:8px;background:var(--altin);color:#1b1403;padding:8px 14px;border-radius:8px;z-index:100}
.atla:focus{left:12px}

/* ——— üst bant ——————————————————————————————————————————————— */
/* Yapışkan bant her kaydırma karesinde arkasını yeniden bulanıklaştırıyor; arkasındaki
   şey de tam ekran gradyan katmanı olduğu için karo olarak önbelleğe alınamıyor. saturate
   kaldırıldı (bir filtre geçişi eksildi), blur yarıya indi; aynı görünümü korumak için
   zemin opaklığı .78'den .93'e çıkarıldı. */
.ust{position:sticky;top:0;z-index:40;background:rgba(9,9,6,.93);
  backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  border-bottom:1px solid var(--cizgi)}
.ust::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;
  background:linear-gradient(90deg,transparent,rgba(227,181,74,.65),transparent)}
.ust-ic{display:flex;align-items:center;gap:18px;min-height:72px}
.marka{display:flex;align-items:center;text-decoration:none;flex:none}
.marka img{display:block;height:40px;width:auto}

/* Menü tek satırda kalır ve kendi içinde kayar; kaydırma kabı olduğu için sayfanın
   yatay kaymasına yol açmaz. Sağ kenarda devamı olduğunu gösteren geçiş var. */
.menu-sar{flex:1 1 auto;min-width:0;position:relative}
.menu-sar::after{content:"";position:absolute;right:0;top:0;bottom:0;width:48px;pointer-events:none;
  background:linear-gradient(90deg,rgba(9,9,6,0),rgba(9,9,6,.94))}
.menu{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;
  padding:4px 0;scroll-padding-right:48px;overscroll-behavior-x:contain}
.menu::-webkit-scrollbar{display:none}
.menu a{color:var(--soluk);text-decoration:none;font-size:.86rem;font-weight:600;
  padding:8px 13px;border-radius:999px;white-space:nowrap;transition:background .16s,color .16s}
.menu a:hover{background:rgba(227,181,74,.12);color:var(--altin-a)}

/* ——— öne çıkan firma (her sayfada) ————————————————————————— */
.one{margin:18px 0 0}
.one-ic{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  background:linear-gradient(135deg,rgba(227,181,74,.16),rgba(227,181,74,.05));
  border:1px solid var(--cizgi2);border-radius:var(--r);padding:16px 20px;box-shadow:var(--golge)}
.one-rozet{font-size:.7rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:#1b1403;background:var(--altin-grad);padding:5px 12px;border-radius:999px;flex:none}
.one-ad{font-family:var(--baslik);font-size:1.38rem;font-weight:700;margin:0;line-height:1.2;color:var(--altin-a)}
.one-bilgi{flex:1 1 220px;min-width:0}
.one-aciklama{margin:3px 0 0;color:var(--soluk);font-size:.9rem}
.one-git{flex:none;text-decoration:none;background:var(--altin-grad);color:#1b1403;
  padding:12px 26px;border-radius:999px;font-weight:800;font-size:.92rem;white-space:nowrap;
  box-shadow:0 8px 24px -10px rgba(227,181,74,.85);transition:transform .16s,box-shadow .16s}
.one-git:hover{transform:translateY(-1px);color:#1b1403;box-shadow:0 12px 30px -10px rgba(227,181,74,1)}

/* ——— giriş ————————————————————————————————————————————————— */
.giris{padding:54px 0 26px}
.giris h1{font-family:var(--baslik);font-size:clamp(2rem,6vw,3.1rem);margin:0 0 12px;
  line-height:1.1;font-weight:700}
.slogan{color:var(--soluk);font-size:1.08rem;margin:0;max-width:60ch}

.hub-izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;padding:28px 0 56px}
.hub-kutu{display:block;text-decoration:none;color:inherit;background:linear-gradient(180deg,var(--kart2),var(--kart));
  border:1px solid var(--cizgi);border-radius:var(--r);padding:20px;box-shadow:var(--golge);
  transition:transform .16s,border-color .16s}
.hub-kutu:hover{transform:translateY(-3px);border-color:var(--cizgi2);color:inherit}
.hub-kutu h2{font-family:var(--baslik);margin:0 0 7px;font-size:1.12rem;color:var(--altin-a);font-weight:700}
.hub-kutu p{margin:0;color:var(--soluk);font-size:.89rem;line-height:1.55}

/* ——— hub sayfası ————————————————————————————————————————————— */
.hub{padding:22px 0 56px}
.iz{font-size:.82rem;color:var(--soluk2);margin-bottom:12px}
.iz a{text-decoration:none;color:var(--soluk)}
.iz a:hover{color:var(--altin-a)}
.iz span{margin:0 7px}
.hub h1{font-family:var(--baslik);font-size:clamp(1.7rem,4.6vw,2.5rem);margin:0 0 16px;
  line-height:1.18;font-weight:700;color:var(--altin-a)}

.metin{max-width:70ch}
.metin h2{font-family:var(--baslik);font-size:1.42rem;margin:34px 0 10px;font-weight:700;
  color:var(--yazi);padding-left:14px;border-left:3px solid;border-image:var(--altin-grad) 1}
.metin p{margin:0 0 14px}
.metin ul{margin:0 0 16px;padding-left:0;list-style:none}
.metin li{margin:9px 0;padding-left:26px;position:relative}
.metin li::before{content:"";position:absolute;left:4px;top:.6em;width:8px;height:8px;
  border-radius:50%;background:var(--altin-grad)}
.metin strong{color:var(--altin-a);font-weight:700}

/* ——— firma listesi ————————————————————————————————————————————— */
.liste{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:11px}
.kart{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:16px;
  background:linear-gradient(180deg,var(--kart2),var(--kart));border:1px solid var(--cizgi);
  border-radius:var(--r);padding:15px 18px;box-shadow:var(--golge);transition:border-color .16s}
.kart:hover{border-color:var(--cizgi2)}
.kart:nth-child(1){border-color:rgba(227,181,74,.55)}
.kart:nth-child(1) .kart-sira,.kart:nth-child(2) .kart-sira,.kart:nth-child(3) .kart-sira{
  background:var(--altin-grad);color:#1b1403}

.kart-sira{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;
  background:rgba(227,181,74,.16);color:var(--altin-a);font-weight:800;font-size:.92rem;flex:none}
.kart-ic{min-width:0}
.kart-ad{font-family:var(--baslik);margin:0;font-size:1.14rem;font-weight:700;line-height:1.25;color:var(--yazi)}
.kart-kisa{margin:4px 0 0;color:var(--soluk);font-size:.89rem;line-height:1.5}
.kart-bonus{margin:8px 0 0;display:inline-block;font-size:.8rem;font-weight:700;color:var(--altin-a);
  background:rgba(227,181,74,.14);border:1px solid rgba(227,181,74,.3);padding:3px 11px;border-radius:999px}
.kart-odeme{margin:8px 0 0;display:flex;flex-wrap:wrap;gap:5px}
.kart-odeme span{font-size:.72rem;font-weight:600;color:var(--soluk);background:rgba(255,255,255,.05);
  border:1px solid var(--cizgi);padding:2px 9px;border-radius:7px;white-space:nowrap}
.kart-git{flex:none;text-decoration:none;background:var(--altin-grad);color:#1b1403;
  padding:11px 24px;border-radius:999px;font-weight:800;font-size:.89rem;white-space:nowrap;
  box-shadow:0 8px 22px -12px rgba(227,181,74,.9);transition:transform .16s}
.kart-git:hover{transform:translateY(-1px);color:#1b1403}
.kart-kapali{flex:none;font-size:.8rem;font-weight:600;color:var(--soluk2);
  border:1px dashed rgba(227,181,74,.22);padding:10px 16px;border-radius:999px;white-space:nowrap}

/* ——— kaynak notu ————————————————————————————————————————————— */
.kaynak{margin:20px 0 0;font-size:.83rem;color:var(--soluk);line-height:1.6;
  background:rgba(227,181,74,.05);border:1px solid var(--cizgi);border-left:3px solid var(--altin-k);
  border-radius:var(--r-k);padding:13px 17px}

/* ——— SSS ————————————————————————————————————————————————————— */
.sss{margin:38px 0 0;max-width:70ch}
.sss h2{font-family:var(--baslik);font-size:1.42rem;margin:0 0 12px;font-weight:700;color:var(--altin-a)}
.sss details{background:linear-gradient(180deg,var(--kart2),var(--kart));border:1px solid var(--cizgi);
  border-radius:var(--r-k);padding:13px 17px;margin-bottom:8px}
.sss details[open]{border-color:var(--cizgi2)}
.sss summary{cursor:pointer;font-weight:700;font-size:.96rem;list-style:none;color:var(--yazi)}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+";float:right;color:var(--altin);font-weight:800;margin-left:10px}
.sss details[open] summary::after{content:"−"}
.sss details p{margin:11px 0 0;color:var(--soluk);font-size:.93rem}

.bos{color:var(--soluk)}

/* ——— alt ————————————————————————————————————————————————————— */
.alt{border-top:1px solid var(--cizgi);padding:36px 0 30px;margin-top:34px;
  background:linear-gradient(180deg,transparent,rgba(227,181,74,.05))}
.alt-logo{height:36px;width:auto;margin-bottom:16px}
.uyari{color:var(--soluk);font-size:.84rem;margin:0 0 18px;max-width:82ch;line-height:1.6}
.uyari strong{color:var(--altin-a);background:rgba(227,181,74,.14);
  border:1px solid rgba(227,181,74,.3);padding:1px 9px;border-radius:6px;margin-right:5px}
.alt-menu{display:flex;flex-wrap:wrap;gap:8px 18px;margin-bottom:18px}
.alt-menu a{color:var(--soluk);text-decoration:none;font-size:.85rem}
.alt-menu a:hover{color:var(--altin-a)}
.telif{color:var(--soluk2);font-size:.8rem;margin:0;padding-top:16px;border-top:1px solid var(--cizgi)}

/* Hareketi azalt tercihi açıksa geçişler ve yumuşak kaydırma kapanır (WCAG 2.3.3). */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important}
  .hub-kutu:hover,.kart-git:hover,.one-git:hover{transform:none}
}

/* H1 gradyanla boyanıyor; background-clip:text desteklenmezse yazı görünmez kalırdı.
   @supports ile önce düz renk verilir, destek varsa gradyana geçilir. */
.giris h1{color:var(--altin-a)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .giris h1{background:var(--altin-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
}

/* ——— dar ekran ——————————————————————————————————————————————— */
@media (max-width:760px){
  .kap{padding:0 16px}
  .ust-ic{min-height:60px;gap:12px;flex-wrap:wrap;padding:8px 0}
  .marka img{height:34px}
  .menu-sar{flex-basis:100%;order:3}
  .giris{padding:34px 0 18px}
  .hub-izgara{grid-template-columns:1fr;padding:20px 0 40px}
  .one-ic{padding:14px 16px;gap:12px}
  .one-git{width:100%;text-align:center}
  /* Kart tek sütuna iner. minmax(0,1fr) sayesinde uzun metin kolonu taşırmaz —
     yatay kaymanın sebebi buydu. */
  .kart{grid-template-columns:36px minmax(0,1fr);row-gap:12px;padding:14px 15px}
  .kart-git,.kart-kapali{grid-column:1/-1;text-align:center}
  .metin h2{font-size:1.24rem}
  .metin,.sss{max-width:none}
}

/* ——— sayfa banner'ı ————————————————————————————————————————— */
/* oran kutusu: görsel gelmeden de yeri ayrılır, sayfa zıplamaz */
.banner{margin:0 0 22px;border-radius:var(--r);overflow:hidden;border:1px solid var(--cizgi);
  box-shadow:var(--golge);aspect-ratio:16/9;background:var(--kart)}
.banner img{display:block;width:100%;height:100%;object-fit:cover}
.liste-basligi{font-family:var(--baslik);font-size:1.25rem;font-weight:700;margin:28px 0 0;
  color:var(--soluk);letter-spacing:-.01em}
@media (max-width:760px){.banner{margin-bottom:18px;border-radius:var(--r-k)}}

/* ana sayfa giriş metni — kutuların üstünde, sayfaya kendi sözünü verir */
.giris-metin{margin:0 0 10px;max-width:72ch}
