/* ============================================================
   Online Koçunuz — "Senin İçin En İyi Bölüm" sayfası stilleri
   Kaynak: design_system/standalone/senin-icin-en-iyi-bolum.html
   Tüm kurallar .okt-senin-icin-en-iyi-bolum altına scope'landı.
   Token'lar globalde (style.css): var(--border), var(--ink-700),
   --primary-*, --accent-*, --fg-muted, --ink-10 vb.
   @keyframes ve helper sınıflar (page-hero, hero-orbit, float-chip,
   grad-text, reveal, btn, btn-accent, btn-ghost-dark) globaldedir.
   Mobil öncelikli.
   ============================================================ */

/* ---- HERO ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-hero{ overflow:hidden; }
.okt-senin-icin-en-iyi-bolum .okt-eb-chip-1{ top:32%; left:2%; animation:float-up 8s ease-in-out infinite; }
.okt-senin-icin-en-iyi-bolum .okt-eb-chip-2{ top:44%; right:2%; animation:float-up 9s ease-in-out infinite; animation-delay:.8s; }

.okt-senin-icin-en-iyi-bolum .okt-eb-pill{
  display:inline-block; font-size:12px; font-weight:600; line-height:1;
  padding:7px 13px; border-radius:999px;
  color:var(--accent-900); background:var(--accent-100);
  border:1px solid var(--accent-300);
}
.okt-senin-icin-en-iyi-bolum .okt-eb-h1{ margin:12px 0 10px; color:var(--ink-900); max-width:820px; }
.okt-senin-icin-en-iyi-bolum .okt-eb-lead{ max-width:680px; color:var(--ink-700); }
.okt-senin-icin-en-iyi-bolum .okt-eb-lead strong{ color:var(--ink-900); }
.okt-senin-icin-en-iyi-bolum .okt-eb-lead a{ text-decoration:underline; color:var(--primary-700); font-weight:600; }

/* ---- ARAÇ + İÇERİK GÖVDESİ ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-main{ padding:32px 24px 80px; background:#fff; }

.okt-senin-icin-en-iyi-bolum .okt-eb-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  align-items:flex-start;
}
@media (min-width:960px){
  .okt-senin-icin-en-iyi-bolum .okt-eb-grid{
    grid-template-columns:minmax(0,320px) minmax(0,1fr);
  }
}

/* ---- SOL PANEL ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-side{
  position:relative; top:0;
  background:#fff; border:1px solid var(--border);
  border-radius:14px; padding:22px;
}
@media (min-width:960px){
  .okt-senin-icin-en-iyi-bolum .okt-eb-side{ position:sticky; top:88px; }
}

.okt-senin-icin-en-iyi-bolum .okt-eb-field{ margin-bottom:16px; }
.okt-senin-icin-en-iyi-bolum .okt-eb-field:last-child{ margin-bottom:0; }
.okt-senin-icin-en-iyi-bolum .okt-eb-label{
  display:block; font-size:11px; font-weight:800; color:var(--ink-900);
  margin-bottom:6px; text-transform:uppercase; letter-spacing:.06em;
}

/* Alan sekmeleri */
.okt-senin-icin-en-iyi-bolum .okt-eb-tabs{
  display:flex; gap:4px; background:var(--ink-10);
  padding:4px; border-radius:8px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-tabs button{
  flex:1; padding:8px 4px; border:0; background:transparent;
  color:var(--ink-700); font-size:11px; font-weight:700;
  border-radius:5px; cursor:pointer; font-family:inherit;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-tabs button.is-active{
  background:#fff; color:var(--primary-700);
  box-shadow:0 1px 3px rgba(11,15,26,.06);
}

/* İlgi onay kutuları */
.okt-senin-icin-en-iyi-bolum .okt-eb-multi{ display:flex; flex-wrap:wrap; gap:6px; }
.okt-senin-icin-en-iyi-bolum .okt-eb-multi label{
  padding:7px 11px; border:1px solid var(--border); border-radius:7px;
  font-size:12px; cursor:pointer; background:#fff; color:var(--ink-700);
  font-weight:600;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-multi label.on{
  background:var(--primary-50); border-color:var(--primary-500);
  color:var(--primary-700); font-weight:700;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-multi input{ position:absolute; opacity:0; width:0; height:0; }
.okt-senin-icin-en-iyi-bolum .okt-eb-multi input:focus-visible + *{ outline:2px solid var(--primary-500); }
.okt-senin-icin-en-iyi-bolum .okt-eb-multi label:focus-within{ outline:2px solid var(--primary-500); outline-offset:1px; }

.okt-senin-icin-en-iyi-bolum .okt-eb-hint{
  font-size:12px; color:var(--fg-muted); line-height:1.6; margin-top:10px;
}

/* ---- SAĞ: BİLGİ NOTU ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-note{
  padding:14px 16px; background:var(--accent-100); border:1px solid var(--accent-300);
  border-radius:10px; font-size:13.5px; color:var(--accent-900);
  line-height:1.65; margin-bottom:18px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-note strong{ font-weight:800; }

/* ---- BOŞ DURUMLAR ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-empty{
  padding:36px 24px; text-align:center; color:var(--fg-muted);
  font-size:14px; background:#fff; border:1px solid var(--border);
  border-radius:14px;
}

/* ---- SONUÇ BAŞLIĞI ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-listhead{
  display:flex; justify-content:space-between; align-items:center; margin-bottom:12px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-listhead .l{
  font-size:13px; font-weight:800; color:var(--ink-900);
  text-transform:uppercase; letter-spacing:.06em;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-listhead .c{ font-size:12px; color:var(--fg-muted); }

/* ---- BÖLÜM KARTLARI ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-card{
  background:#fff; border:1px solid var(--border); border-radius:12px;
  padding:18px; margin-bottom:12px;
  transition:border-color 160ms var(--ease-out), box-shadow 160ms var(--ease-out);
}
.okt-senin-icin-en-iyi-bolum .okt-eb-card:hover{
  border-color:var(--primary-300);
  box-shadow:0 8px 22px -14px rgba(30,58,226,.4);
}
.okt-senin-icin-en-iyi-bolum .okt-eb-card-top{
  display:flex; justify-content:space-between; align-items:flex-start; gap:14px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-bol{ font-size:16.5px; font-weight:800; color:var(--ink-900); }
.okt-senin-icin-en-iyi-bolum .okt-eb-cnot{ font-size:12.5px; color:var(--fg-muted); margin-top:2px; }
.okt-senin-icin-en-iyi-bolum .okt-eb-alan{
  flex:none; padding:3px 9px; border-radius:5px; font-size:10.5px;
  font-weight:800; letter-spacing:.04em; background:#EEF1FF; color:#1E3AE2;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-tagrow{
  display:flex; flex-wrap:wrap; gap:5px; margin-top:10px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-tag{
  padding:2px 8px; border-radius:99px; font-size:10.5px; font-weight:700;
  background:var(--accent-100); color:var(--accent-900);
}
.okt-senin-icin-en-iyi-bolum .okt-eb-bar{
  height:7px; background:var(--ink-10); border-radius:99px; overflow:hidden; margin-top:12px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-bar > div{
  height:100%; border-radius:99px;
  background:linear-gradient(90deg,#3B5BFF,#7C4DFF);
}
.okt-senin-icin-en-iyi-bolum .okt-eb-match{
  font-size:11.5px; color:var(--ink-700); font-weight:700; margin-top:6px;
}

/* ---- SEO İÇERİK (t2-content eşleniği) ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-content h2{
  color:var(--ink-900); font-size:24px; margin:36px 0 12px; letter-spacing:-0.01em;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-content p{
  font-size:15.5px; color:var(--ink-700); line-height:1.75; margin:0 0 12px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-content ul{
  padding-left:18px; font-size:15px; color:var(--ink-700); line-height:1.8; margin:0 0 14px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-content strong{ color:var(--ink-900); }
.okt-senin-icin-en-iyi-bolum .okt-eb-content a{
  color:var(--primary-700); text-decoration:underline; font-weight:600;
}

/* ---- SSS ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-faq details{
  border-bottom:1px solid var(--border); padding:14px 0;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-faq summary{
  font-size:15.5px; font-weight:700; color:var(--ink-900); cursor:pointer;
  list-style:none; display:flex; justify-content:space-between; align-items:center; gap:14px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-faq summary::-webkit-details-marker{ display:none; }
.okt-senin-icin-en-iyi-bolum .okt-eb-faq summary::after{
  content:'+'; font-size:22px; font-weight:300; color:var(--fg-muted);
}
.okt-senin-icin-en-iyi-bolum .okt-eb-faq details[open] summary::after{ content:'−'; }
.okt-senin-icin-en-iyi-bolum .okt-eb-faq details p{
  margin:10px 0 0; font-size:14.5px; line-height:1.75; color:var(--ink-700);
}

/* ---- CTA ---- */
.okt-senin-icin-en-iyi-bolum .okt-eb-cta{
  margin-top:36px; padding:28px;
  background:linear-gradient(135deg,#0B0F1A,#1A1F2E);
  color:#fff; border-radius:14px;
}
.okt-senin-icin-en-iyi-bolum .okt-eb-cta h2{ color:#fff; margin-top:0; font-size:22px; }
.okt-senin-icin-en-iyi-bolum .okt-eb-cta p{ color:rgba(255,255,255,.78); font-size:14.5px; }
.okt-senin-icin-en-iyi-bolum .okt-eb-cta-btns{
  display:flex; gap:10px; flex-wrap:wrap; margin-top:14px;
}