/* BonusLalesi.com — tek stil dosyası (harici font/CDN yok, sistem fontları) */
/* ==== 1. Temel ==== */
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:#1c2333;background:#f2f5f9;line-height:1.55;font-size:16px}
img{max-width:100%;height:auto;display:block}
a{color:#15803d;text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:#0e1a30;line-height:1.28}
h1{font-size:26px;margin:10px 0 6px}
h2{font-size:21px;margin:30px 0 10px}
h3{font-size:17px;margin:0 0 6px}
p{margin-bottom:12px}
ul,ol{padding-left:22px;margin-bottom:12px}
li{margin-bottom:5px}
strong{color:#0e1a30}
.container{max-width:1080px;margin:0 auto;padding:0 16px}
.gizli{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
main{padding:18px 0 40px}

/* ==== 2. Üst bar ==== */
.site-header{background:#16213a;color:#fff;position:sticky;top:0;z-index:50}
.header-ic{display:flex;align-items:center;justify-content:space-between;min-height:56px;gap:12px;position:relative}
.logo{color:#fff;font-size:20px;font-weight:800;display:flex;align-items:center;gap:8px;white-space:nowrap}
.logo:hover{text-decoration:none}
.logo svg{flex:0 0 auto}
.menu-btn{display:none;background:none;border:1px solid rgba(255,255,255,.4);color:#fff;font-size:20px;line-height:1;padding:6px 10px;border-radius:8px;cursor:pointer}
.menu{display:flex;gap:2px;flex-wrap:wrap}
.menu a{color:#dbe4f5;font-size:14px;font-weight:600;padding:8px 10px;border-radius:8px}
.menu a:hover{background:rgba(255,255,255,.1);color:#fff;text-decoration:none}
.menu a.aktif{background:#22c55e;color:#0b2013}

/* ==== 3. Breadcrumb + güncelleme ==== */
.breadcrumb{margin-top:12px;font-size:13.5px}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:0}
.breadcrumb li{margin:0;display:flex;align-items:center;gap:6px}
.breadcrumb li+li::before{content:"›";color:#8fa0bb}
.breadcrumb a{color:#5a6b85}
.breadcrumb [aria-current]{color:#1c2333;font-weight:600}
.guncelleme{color:#5a6b85;font-size:13.5px;margin-bottom:14px}
.giris{font-size:16.5px;margin-bottom:18px;max-width:82ch}

/* ==== 4. Editör vitrini (Betzula) ==== */
.vitrin{position:relative;background:linear-gradient(135deg,#0f2c1c,#14532d);border-radius:14px;padding:22px 18px 18px;margin:18px 0 28px;box-shadow:0 8px 20px rgba(15,44,28,.28)}
.vitrin-rozet{position:absolute;top:-11px;left:16px;background:#facc15;color:#3b2f05;font-size:12px;font-weight:800;padding:3px 11px;border-radius:999px;letter-spacing:.3px}
.vitrin-ic{display:flex;gap:18px;align-items:center;flex-wrap:wrap}
.vitrin-ic>img{background:#fff;border-radius:10px;padding:6px;width:120px;height:60px;object-fit:contain;flex:0 0 auto}
.vitrin-metin{flex:1 1 300px;min-width:230px}
.vitrin-metin h2{color:#fff;font-size:18.5px;margin:0 0 6px}
.vitrin-metin p{color:#d7e6dc;margin-bottom:9px;font-size:15px}
.vitrin-ozellik{display:flex;gap:6px 20px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.vitrin-ozellik li{color:#eaf5ee;font-size:13.5px;margin:0}
.vitrin-ozellik strong{color:#fde047}
.vitrin-butonlar{display:flex;flex-direction:column;gap:8px;flex:0 0 auto;min-width:160px}

/* ==== 5. Marka kartları ==== */
.liste{display:flex;flex-direction:column;gap:14px;margin-bottom:10px}
.kart{position:relative;background:#fff;border:1px solid #dfe6ef;border-radius:14px;padding:16px;box-shadow:0 1px 3px rgba(16,32,58,.06)}
.kart-vitrin{background:#0e1a30;color:#c8d5ea;border-color:#0e1a30;padding-top:22px}
.rozet{position:absolute;top:-11px;left:16px;background:#22c55e;color:#06210f;font-size:12px;font-weight:800;padding:3px 11px;border-radius:999px;letter-spacing:.3px}
.kart-ust{display:flex;gap:14px;align-items:flex-start}
.sira{flex:0 0 26px;height:26px;border-radius:8px;background:#e8eef7;color:#33415c;font-weight:800;font-size:13.5px;display:flex;align-items:center;justify-content:center}
.kart-vitrin .sira{background:#22c55e;color:#06210f}
.kart-logo{flex:0 0 auto;background:#f5f8fc;border:1px solid #e5ebf4;border-radius:10px;padding:4px;display:block}
.kart-logo img{width:96px;height:48px;object-fit:contain}
.kart-vitrin .kart-logo{background:#fff;border-color:#fff}
.kart-baslik{flex:1 1 auto;min-width:0}
.kart-baslik h3{font-size:17.5px;margin-bottom:3px}
.kart-baslik h3 a{color:#0e1a30}
.kart-vitrin .kart-baslik h3 a{color:#fff}
.kart-bonus{font-weight:700;color:#15803d;margin-bottom:7px}
.kart-vitrin .kart-bonus{color:#4ade80}
.etiketler{display:flex;gap:6px;flex-wrap:wrap;list-style:none;padding:0;margin:0}
.etiketler li{background:#eef4fb;color:#33415c;font-size:12px;font-weight:600;padding:2px 9px;border-radius:999px;margin:0}
.kart-vitrin .etiketler li{background:rgba(255,255,255,.12);color:#dbe4f5}
.kart-meta{display:flex;gap:16px;flex-wrap:wrap;margin:12px 0 8px;padding:10px 0 0;border-top:1px dashed #e2e9f2}
.kart-vitrin .kart-meta{border-top-color:rgba(255,255,255,.18)}
.kart-meta div{display:flex;flex-direction:column;min-width:86px}
.kart-meta dt{font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:#7a8aa5;font-weight:700}
.kart-vitrin .kart-meta dt{color:#93a6c6}
.kart-meta dd{font-size:14.5px;font-weight:700;color:#16213a}
.kart-vitrin .kart-meta dd{color:#fff}
.kart-aciklama{font-size:14.5px;color:#48566f}
.kart-vitrin .kart-aciklama{color:#b9c8e0}
.kart-alt{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}

/* ==== 6. Butonlar ==== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:15px;padding:11px 20px;border-radius:10px;border:0;cursor:pointer;text-align:center;line-height:1.2;transition:transform .12s ease,background .12s ease}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn-bonus{background:#22c55e;color:#06210f;box-shadow:0 3px 10px rgba(34,197,94,.35)}
.btn-bonus:hover{background:#16a34a;color:#fff}
.btn-cerceve{background:transparent;color:#15803d;border:2px solid #22c55e}
.kart-vitrin .btn-cerceve,.vitrin .btn-cerceve{color:#4ade80;border-color:#4ade80}
.btn-kucuk{padding:6px 12px;font-size:13.5px;border-radius:8px}
.btn-tehlike{background:#fee2e2;color:#991b1b;border:2px solid #fecaca}
.btn[disabled]{opacity:.35;cursor:default}
.btn[disabled]:hover{transform:none}

/* ==== 7. Karşılaştırma tablosu ==== */
.tablo-sar{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid #dfe6ef;border-radius:12px;background:#fff}
.karsilastirma{width:100%;border-collapse:collapse;min-width:660px;font-size:14.5px}
.karsilastirma th,.karsilastirma td{padding:11px 12px;text-align:left;border-bottom:1px solid #e8eef6;vertical-align:top}
.karsilastirma thead th{background:#16213a;color:#fff;font-size:12.5px;letter-spacing:.4px;text-transform:uppercase}
.karsilastirma tbody th{font-weight:700}
.karsilastirma tbody th a{color:#0e1a30;text-decoration:underline}
.karsilastirma tbody tr:last-child th,.karsilastirma tbody tr:last-child td{border-bottom:0}
.satir-vitrin{background:#f0fdf4}
.mini-rozet{display:inline-block;background:#22c55e;color:#06210f;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;white-space:nowrap;vertical-align:middle}
.tablo-not{font-size:13px;color:#6b7a93;margin-top:8px}

/* ==== 8. İçerik ==== */
.icerik-gorsel{margin:22px 0;background:#fff;border:1px solid #dfe6ef;border-radius:14px;padding:10px}
.icerik-gorsel img{width:100%;border-radius:10px}
.icerik-gorsel figcaption{font-size:13px;color:#6b7a93;padding:8px 6px 2px;text-align:center}
.bolum{max-width:84ch}
.bolum h2{margin-top:28px}
.bolum ul,.bolum ol{margin-left:4px}
.bolum a{text-decoration:underline}
.kurumsal-icerik h2{font-size:19px}

/* ==== 9. Öne çıkanlar + SSS + ilgili ==== */
.one-cikanlar{margin-top:10px}
.one-cikan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.one-cikan{background:#fff;border:1px solid #dfe6ef;border-radius:12px;padding:14px}
.one-cikan h3{margin-bottom:6px}
.one-cikan p{font-size:14.5px;color:#48566f;margin:0}
.sss{margin-top:10px}
.sss details{background:#fff;border:1px solid #dfe6ef;border-radius:12px;margin-bottom:10px;overflow:hidden}
.sss summary{cursor:pointer;font-weight:700;color:#0e1a30;padding:14px 16px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+";font-size:20px;font-weight:800;color:#22c55e;flex:0 0 auto}
.sss details[open] summary::after{content:"–"}
.sss-cvp{padding:0 16px 14px;color:#48566f}
.sss-cvp p:last-child{margin-bottom:0}
.ilgili{margin-top:30px;background:#fff;border:1px solid #dfe6ef;border-radius:12px;padding:16px}
.ilgili h2{font-size:17px;margin:0 0 10px}
.ilgili ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:4px 18px;list-style:none;padding:0;margin:0}
.ilgili a{font-weight:600}
.sorumlu-not{margin-top:22px;padding:12px 14px;background:#fff7ed;border:1px solid #fed7aa;border-radius:12px;font-size:14px;color:#7c4a12}

/* ==== 10. Marka sayfası ==== */
.marka-ust{display:flex;gap:16px;align-items:center;margin-top:14px}
.marka-ust-logo{background:#fff;border:1px solid #e5ebf4;border-radius:12px;padding:6px;width:132px;height:66px;object-fit:contain;flex:0 0 auto}
.marka-ust h1{margin:0 0 4px}
.ozet-kutu{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:#fff;border:1px solid #dfe6ef;border-radius:14px;padding:16px;margin:16px 0 6px}
.ozet-liste{display:flex;gap:20px;flex-wrap:wrap;margin:0}
.ozet-liste div{display:flex;flex-direction:column;min-width:96px}
.ozet-liste dt{font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:#7a8aa5;font-weight:700}
.ozet-liste dd{font-size:15px;font-weight:700;color:#16213a}
.alternatif{margin-top:26px;background:#0e1a30;border-radius:14px;padding:20px}
.alternatif h2{color:#fff;font-size:19px;margin:0 0 8px}
.alternatif p{color:#c8d5ea;margin-bottom:14px}
.alternatif-butonlar{display:flex;gap:10px;flex-wrap:wrap}

/* ==== 11. Footer ==== */
.site-footer{background:#0e1a30;color:#aab8d0;margin-top:40px;padding:28px 0 18px;font-size:14.5px}
.footer-ust{display:flex;gap:24px;justify-content:space-between;flex-wrap:wrap;margin-bottom:20px}
.footer-hakkinda{max-width:480px}
.footer-marka{color:#fff;font-size:19px;font-weight:800;margin-bottom:8px}
.footer-hakkinda p{margin:0}
.footer-menu{display:flex;flex-direction:column;gap:6px;min-width:190px}
.footer-menu a{color:#cfd9ea}
.footer-sorumlu{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.06);border-radius:12px;padding:12px 14px;margin-bottom:16px}
.footer-sorumlu p{margin:0;font-size:13.5px}
.yas18{flex:0 0 auto;background:#dc2626;color:#fff;font-weight:800;font-size:13px;padding:3px 9px;border-radius:8px}
.footer-alt{border-top:1px solid rgba(255,255,255,.12);padding-top:14px;font-size:13px;color:#8fa0bb}

/* ==== 12. Admin ==== */
.admin-govde{background:#eef1f6}
.admin-giris{max-width:380px;margin:10vh auto;background:#fff;border:1px solid #dfe6ef;border-radius:14px;padding:26px}
.admin-giris h1{font-size:20px;margin-bottom:16px}
.admin-ust{background:#0e1a30;color:#fff;padding:12px 0}
.admin-ust-ic{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.admin-ust-sag{display:flex;align-items:center;gap:12px}
.admin-ust a{color:#cfd9ea;font-weight:600;font-size:14px}
.admin-icerik{padding:22px 16px 50px}
.admin-blok{background:#fff;border:1px solid #dfe6ef;border-radius:14px;padding:18px;margin-bottom:20px}
.admin-blok h2{font-size:18px;margin:0 0 10px}
.admin-not{font-size:13.5px;color:#6b7a93;margin-bottom:12px}
.admin-not code{background:#eef1f6;padding:1px 6px;border-radius:6px;font-size:12.5px}
.admin-tablo{width:100%;border-collapse:collapse;min-width:760px;font-size:14px}
.admin-tablo th,.admin-tablo td{padding:9px 10px;border-bottom:1px solid #e8eef6;text-align:left;vertical-align:middle}
.admin-tablo thead th{background:#f5f8fc;font-size:12.5px;text-transform:uppercase;letter-spacing:.3px;color:#48566f}
.admin-islem{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.admin-islem form{margin:0}
.admin-form{display:flex;flex-direction:column;gap:12px}
.admin-form label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:14px;color:#33415c}
.admin-form input[type=text],.admin-form input[type=password],.admin-form select,.admin-form textarea{font:inherit;padding:9px 11px;border:1px solid #cfd9e8;border-radius:9px;background:#fff;color:#16213a;width:100%}
.admin-form input:focus,.admin-form textarea:focus,.admin-form select:focus{outline:2px solid #22c55e;outline-offset:0;border-color:#22c55e}
.form-satir{display:flex;gap:14px;flex-wrap:wrap}
.form-satir>label,.form-satir>.form-grup{flex:1 1 260px}
.form-tur{border:1px solid #cfd9e8;border-radius:9px;padding:10px 12px}
.form-tur legend{font-weight:700;font-size:13.5px;color:#48566f;padding:0 6px}
.onay{flex-direction:row !important;align-items:center;gap:8px !important;display:flex;font-weight:600}
.onay input{width:auto !important}
.form-butonlar{display:flex;gap:10px;flex-wrap:wrap}
.bildirim{padding:11px 14px;border-radius:10px;font-weight:600;margin-bottom:16px}
.bildirim-ok{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534}
.bildirim-hata{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}

/* ==== 13. Mobil ==== */
@media(max-width:820px){
  .menu-btn{display:block}
  .menu{display:none;position:absolute;top:100%;left:0;right:0;background:#16213a;flex-direction:column;padding:8px 12px 14px;border-top:1px solid rgba(255,255,255,.12)}
  .menu.acik{display:flex}
  .menu a{padding:11px 8px;font-size:15px}
  h1{font-size:22px}
  h2{font-size:19px}
  .kart-ust{flex-wrap:wrap}
  .kart-logo img{width:84px;height:42px}
  .vitrin-ic{flex-direction:column;align-items:flex-start}
  .vitrin-butonlar{width:100%;flex-direction:row}
  .vitrin-butonlar .btn{flex:1}
  .ozet-kutu{flex-direction:column;align-items:stretch}
  .marka-ust{flex-direction:column;align-items:flex-start}
  .kart-alt .btn{flex:1}
}
@media(max-width:480px){
  .kart{padding:14px}
  .kart-alt{flex-direction:column}
  .kart-alt .btn{width:100%}
  .vitrin-butonlar{flex-direction:column}
  .ozet-liste{gap:14px}
}