/* Üst şerit sağı: en çok sorulan üç soru */
.sss-ust-populer { flex: none; width: 24rem; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); border-radius: 18px; padding: .9rem .9rem .9rem; }
.sss-ust-populer-bas { margin: 0 0 .6rem .2rem; font-size: .82rem; font-weight: 600; color: #e3d7eb; }
.sss-ust-populer ol { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.sss-ust-populer a { display: grid; grid-template-columns: 32px 1fr auto; gap: .75rem; align-items: center; min-height: 52px; padding: .55rem .85rem .55rem .6rem; background: #fff; border-radius: 12px; color: var(--murekkep); text-decoration: none; font-size: .9rem; line-height: 1.3; }
.sss-ust-populer a::after { content: '→'; color: var(--mor); font-weight: 600; }
.sss-ust-populer a:hover { background: var(--mor-acik); color: var(--mor-koyu); }
.sss-ust-populer a span { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 999px; background: var(--sari); color: var(--patlican); font-weight: 700; font-size: .85rem; }
.sss-ust-populer b { font-weight: 600; }

/* Gövde: solda yapışkan konu dizini, sağda grup kartları */
.sss-bolum { padding: 3.6rem 0 4.2rem; }
.sss-duzen { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 2.6rem; align-items: start; }
.sss-dizin { position: sticky; top: 92px; display: flex; flex-direction: column; gap: .15rem; background: #fff; border: 1px solid var(--kenar); border-radius: var(--kose-buyuk); box-shadow: var(--golge); padding: 1rem .6rem .6rem; }
.sss-dizin .etiket { margin: 0 .6rem .45rem; }
.sss-dizin a { display: flex; align-items: center; gap: .65rem; min-height: 44px; padding: .3rem .6rem; border-radius: 12px; text-decoration: none; color: var(--murekkep-2); font-weight: 600; font-size: .92rem; }
.sss-dizin a small { margin-left: auto; color: var(--gri); font-weight: 400; font-size: .78rem; }
.sss-dizin .sss-no { width: 28px; height: 28px; font-size: .78rem; background: var(--mor-acik); color: var(--mor-koyu); }
.sss-dizin a:hover { background: var(--mor-acik); color: var(--mor-koyu); }
.sss-dizin a:hover .sss-no { background: var(--mor); color: #fff; }
.sss-icerik { display: grid; gap: 1.4rem; }
.sss-grup { padding: 1.6rem 1.9rem .5rem; scroll-margin-top: 92px; }
.sss-grup-bas { margin-bottom: .6rem; padding-bottom: .9rem; border-bottom: 1px solid var(--cizgi); }
.sss-grup-bas h2 { font-size: 1.4rem; }
.sss-madde { scroll-margin-top: 92px; }
.sss-madde p { max-width: 46rem; }

/* Terimler bandı */
.sss-terimler { padding: 4.2rem 0; scroll-margin-top: 72px; }
.sss-terim-bas { max-width: 44rem; margin-bottom: 1.8rem; }
.sss-terim-bas .sessiz { font-size: 1.05rem; }
.sss-terim-kartlar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; }
.sss-terim { padding: 1.3rem 1.4rem 1.4rem; scroll-margin-top: 92px; }
.sss-terim dd { font-size: .95rem; }

/* Kapanış */
.sss-son { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 2.2rem 3rem; margin-top: 4.5rem; margin-bottom: 4.5rem; }

@media (max-width: 1100px) {
  .sss-ust-populer { width: 20rem; }
  .sss-terim-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .sss-ust-populer { display: none; }
  .sss-duzen { grid-template-columns: 1fr; gap: 1.2rem; }
  .sss-dizin { position: static; flex-direction: row; flex-wrap: wrap; }
  .sss-dizin .etiket { width: 100%; }
  .sss-terim-kartlar { grid-template-columns: 1fr; }
  .sss-son { flex-direction: column; align-items: flex-start; padding: 2rem; }
}