/* Darkbet rehber siteleri - darkbet_kur.py tarafindan kopyalanir. AMP'ye de inline edilir:
   !important, @import ve JS'e bagli stil kullanma. */
:root{--k:#0b0d11;--k2:#15181f;--k3:#232733;--s:#ffc107;--s2:#ffb300;--m:#1b1e25;--g:#5b6270;--c:#e6e8ec;--z:#f4f5f7;--b:#fff;--r:12px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--z);color:var(--m);font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:var(--k);text-decoration:underline;text-decoration-color:var(--s);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:#000;text-decoration-color:var(--s2)}
.w{max-width:1160px;margin:0 auto;padding:0 16px}

/* butonlar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:10px;padding:10px 16px;font-weight:800;font-size:15px;line-height:1.2;text-decoration:none;white-space:nowrap;transition:transform .15s,background .15s}
.btn-y{background:var(--s);color:var(--k)}
.btn-y:hover{background:var(--s2);color:var(--k);transform:translateY(-1px)}
.btn-l{padding:14px 22px;font-size:16px}

/* header */
.hdr{background:var(--k);border-bottom:1px solid var(--k3);position:sticky;top:0;z-index:20}
.hdr-in{display:flex;align-items:center;gap:20px;min-height:64px}
.logo{flex:0 0 auto;text-decoration:none}
.logo img{width:144px;height:30px}
.mnav{display:flex;gap:4px;flex:1 1 auto;overflow-x:auto;scrollbar-width:none}
.mnav::-webkit-scrollbar{display:none}
.mnav a{color:#cfd3da;text-decoration:none;font-weight:600;font-size:15px;padding:8px 10px;border-radius:8px;white-space:nowrap}
.mnav a:hover,.mnav a[aria-current]{color:var(--s);background:var(--k2)}
.hdr-cta{flex:0 0 auto}

/* sayfa basligi */
.hero{background:linear-gradient(180deg,var(--k) 0%,var(--k2) 100%);color:#fff;padding:22px 0 30px}
.hero h1{font-size:34px;line-height:1.2;margin:10px 0 12px;letter-spacing:-.01em}
.hero-a{color:#c4c9d2;font-size:18px;max-width:760px;margin:0 0 14px}
.bc{display:flex;flex-wrap:wrap;gap:6px;font-size:14px;color:#9aa1ad}
.bc a{color:#c4c9d2;text-decoration:none}
.bc a:hover{color:var(--s)}
.bc span[aria-current]{color:#e6e8ec}
.kunye{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;font-size:14px;color:#9aa1ad}
.kunye a{color:var(--s);text-decoration:none}
.kunye a:hover{text-decoration:underline}

/* yerlesim */
.grid{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:28px;padding-top:24px;padding-bottom:40px;align-items:start}
.art{background:var(--b);border-radius:var(--r);padding:28px 34px;box-shadow:0 1px 3px rgba(11,13,17,.06);min-width:0}

/* metin */
.prose{font-size:17px;line-height:1.75}
.prose>p:first-child{font-size:18.5px;color:#2a2e37}
.prose h2,.art>section>h2{font-size:25px;line-height:1.3;margin:38px 0 14px;padding-left:14px;border-left:4px solid var(--s);color:var(--k);scroll-margin-top:84px}
.prose h3{font-size:20px;line-height:1.35;margin:28px 0 10px;color:var(--k)}
.prose p{margin:0 0 16px}
.prose ul,.prose ol{margin:0 0 18px;padding-left:24px}
.prose li{margin:0 0 8px;padding-left:4px}
.prose ul>li::marker{color:var(--s2)}
.prose ol>li::marker{color:var(--k);font-weight:800}
.prose strong{color:var(--k)}
.prose code{background:var(--z);padding:1px 6px;border-radius:5px;font-size:.92em}
.tbl{overflow-x:auto;margin:0 0 20px;border:1px solid var(--c);border-radius:10px}
.tbl table{width:100%;border-collapse:collapse;font-size:15px;min-width:520px}
.tbl th{background:var(--k);color:#fff;text-align:left;padding:10px 12px;font-weight:700}
.tbl td{padding:10px 12px;border-top:1px solid var(--c);vertical-align:top}
.tbl tr:nth-child(even) td{background:#fafbfc}

/* icindekiler */
.toc{background:var(--z);border:1px solid var(--c);border-radius:10px;padding:14px 18px;margin:0 0 26px;font-size:15.5px}
.toc summary{font-weight:800;cursor:pointer;color:var(--k)}
.toc ol{margin:10px 0 0;padding-left:22px;columns:2;column-gap:28px}
.toc li{margin:0 0 6px;break-inside:avoid}
.toc a{text-decoration:none}
.toc a:hover{text-decoration:underline;text-decoration-color:var(--s)}

/* CTA */
.cta{position:relative;background:var(--k);color:#fff;border-radius:var(--r);overflow:hidden;margin:6px 0 26px}
.rozet{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--k);background:#d9dde3;border-radius:5px;padding:2px 7px}
.cta-ust .rozet{position:absolute;top:10px;left:10px;z-index:1}
.cta-gorsel img{width:100%;aspect-ratio:1200/374;object-fit:cover}
.cta-ic{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px}
.cta-b{font-weight:800;font-size:18px;margin:0 0 4px;color:#fff}
.cta-a{margin:0;color:#b9bfca;font-size:14.5px;line-height:1.5}
.cta-a a{color:var(--s)}
.cta-son{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;border-left:5px solid var(--s);margin:34px 0 10px}
.cta-son .rozet{margin-bottom:8px}

/* kutular */
.kutu{border-radius:10px;padding:18px 22px;margin:28px 0 0;font-size:15.5px}
.kutu h2{font-size:19px;margin:0 0 10px;padding:0;border:0}
.kutu p{margin:0 0 10px}
.kutu p:last-child{margin:0}
.kutu-yontem{background:var(--z);border:1px solid var(--c)}
.kutu-uyari{background:#fff8e1;border:1px solid #ffe08a}
.kucuk{font-size:14px;color:var(--g)}

/* SSS ve ilgili */
.sss{margin-top:10px}
.sss-k{border:1px solid var(--c);border-radius:10px;padding:14px 18px;margin:0 0 10px}
.sss-k h3{font-size:17px;margin:0 0 6px;color:var(--k)}
.sss-k p{margin:0;font-size:15.5px;color:#3a3f4a}
.ilgili ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.ilgili li a{display:block;padding:12px 14px;border:1px solid var(--c);border-radius:10px;text-decoration:none;font-weight:600;background:var(--b)}
.ilgili li a:hover{border-color:var(--s);background:#fffbeb}

/* kenar cubugu */
.side{position:sticky;top:84px;display:grid;gap:16px}
.side-k{background:var(--b);border-radius:var(--r);padding:16px 18px;box-shadow:0 1px 3px rgba(11,13,17,.06)}
.side-b{font-weight:800;font-size:15px;margin:0 0 10px;color:var(--k);text-transform:uppercase;letter-spacing:.03em}
.side-k ul{list-style:none;margin:0;padding:0}
.side-k li{border-top:1px solid var(--c)}
.side-k li:first-child{border-top:0}
.side-k a{display:block;padding:8px 0;font-size:14.5px;text-decoration:none;color:#2a2e37;line-height:1.4}
.side-k a:hover{color:var(--k);text-decoration:underline;text-decoration-color:var(--s)}
.side-k a[aria-current]{font-weight:800;color:var(--k);border-left:3px solid var(--s);padding-left:8px}

/* ana sayfa */
.ana{padding-top:24px;padding-bottom:40px}
.ana-giris{background:var(--b);border-radius:var(--r);padding:22px 26px;margin-bottom:20px}
.lead{font-size:18px;margin:0;color:#2a2e37}
.kat{margin:34px 0 0}
.kat h2{font-size:24px;margin:0 0 14px;padding-left:14px;border-left:4px solid var(--s);color:var(--k);scroll-margin-top:84px}
.kartlar{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px}
.kart{display:flex;flex-direction:column;gap:6px;background:var(--b);border:1px solid var(--c);border-radius:var(--r);padding:16px 18px;text-decoration:none;color:var(--m);transition:border-color .15s,transform .15s}
.kart:hover{border-color:var(--s);transform:translateY(-2px);color:var(--m)}
.kart-b{font-weight:800;color:var(--k);font-size:16.5px}
.kart-a{font-size:14px;color:var(--g);line-height:1.5}
.ana .kutu,.ana .sss{background:var(--b)}
.ana .sss{border-radius:var(--r);padding:6px 22px 14px;margin-top:28px}
.ana .sss h2{font-size:22px;margin:16px 0 12px;padding-left:14px;border-left:4px solid var(--s)}
.yatay{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;margin:10px 0 0;padding:0;font-size:14.5px}

/* footer */
.ftr{background:var(--k);color:#aeb4bf;margin-top:10px;font-size:14.5px}
.ftr-in{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px;padding-top:36px;padding-bottom:26px}
.ftr p{margin:10px 0 0;line-height:1.6}
.ftr-b{color:#fff;font-weight:800;margin:0 0 10px;text-transform:uppercase;font-size:13.5px;letter-spacing:.05em}
.ftr ul{list-style:none;margin:0;padding:0}
.ftr li{margin:0 0 7px}
.ftr a{color:#cfd3da;text-decoration:none}
.ftr a:hover{color:var(--s)}
.yas{display:flex;align-items:center;gap:10px}
.y18{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:2px solid var(--s);border-radius:50%;color:var(--s);font-weight:800;font-size:13px;flex:0 0 auto}
.ftr-alt{border-top:1px solid var(--k3);padding-top:14px;padding-bottom:18px;font-size:13px;color:#7d8491}
.ftr-alt p{margin:0}
.ftr code{color:#aeb4bf;background:none}

/* mobil yapiskan CTA */
.sticky{display:none}

@media (max-width:960px){
  .grid{grid-template-columns:minmax(0,1fr)}
  .side{position:static}
  .ftr-in{grid-template-columns:1fr 1fr}
  .ftr-in>.ftr-k:first-child{grid-column:1/-1}
}
@media (max-width:767px){
  body{font-size:16px}
  .hdr{position:static}
  .hdr-in{flex-wrap:wrap;gap:0 12px;min-height:0;padding-top:10px}
  .hdr-cta{display:none}
  .prose h2,.art>section>h2,.kat h2{scroll-margin-top:12px}
  .logo img{width:120px;height:25px}
  .mnav{order:3;flex:1 0 100%;margin:6px -16px 0;padding:0 12px 8px}
  .mnav a{font-size:14px;padding:6px 9px}
  .hero{padding:14px 0 22px}
  .hero h1{font-size:27px}
  .kunye{font-size:13px;gap:4px 14px}
  .hero-a{font-size:16px}
  .grid{padding-top:14px;gap:18px}
  .art{padding:20px 18px;border-radius:10px}
  .prose{font-size:16.5px}
  .prose>p:first-child{font-size:17.5px}
  .prose h2,.art>section>h2{font-size:22px;margin-top:30px}
  .toc ol{columns:1}
  .cta-ic,.cta-son{flex-direction:column;align-items:stretch;text-align:left}
  .cta-ic .btn,.cta-son .btn{width:100%}
  .ftr-in{grid-template-columns:1fr;gap:20px}
  .sticky{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:rgba(11,13,17,.97);border-top:2px solid var(--s)}
  .sticky>span{color:#aeb4bf;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
  .sticky .btn{flex:1 1 auto;max-width:260px}
  body{padding-bottom:64px}
}
@media (prefers-reduced-motion:reduce){*{transition:none;scroll-behavior:auto}}
