/* ============================================================================
   Depo — içerik sayfaları (/sayfa/...)

   Şablon yenitema dilindeydi: yeşil vurgu, sabit gri skala, 12-14px yarıçaplar
   ve 800 ağırlıklı sans başlık. Biçim gövdeden alınıp buraya taşındı.
   ========================================================================== */

.depo .stx { width: 100%; margin: 0 auto; padding: 0 0 56px; }

/* Konum çubuğu */
.depo .stx-crumb {
  display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0 0 14px;
  font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
  line-height: 1; color: var(--d-muted);
}
.depo .stx-crumb a { color: var(--d-muted); font-weight: 700; }
.depo .stx-crumb a:hover { color: var(--d-gold); }
.depo .stx-crumb .sep { width: 10px; height: 10px; flex: none; color: #cfc8ba; }
.depo .stx-crumb span[aria-current] {
  min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: #4a463f;
}

/* Kart */
.depo .stx-card {
  position: relative; overflow: hidden;
  background: #fff;
  border: 1px solid var(--d-line);
  border-radius: var(--d-radius);
}
.depo .stx-card::before {
  content: ''; position: absolute; inset: 0 0 auto 0; height: 2px; background: var(--d-gold);
}

.depo .stx-head { padding: 34px 38px 26px; border-bottom: 1px solid #f0ece3; }

/* Okuma ölçüsü: hukuk metinlerinde satırlar 1080px'te okunamayacak kadar
   uzuyordu; ~72 karakter rahat bir satır uzunluğu. */
.depo .stx-measure { max-width: 72ch; margin-inline: auto; }

.depo .stx-title {
  margin: 0; font-family: var(--d-font-head); font-size: 40px; font-weight: 500;
  letter-spacing: -.4px; line-height: 1.08; color: var(--d-ink); text-wrap: balance;
}
.depo .stx-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.depo .stx-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 11px; border-radius: 3px;
  background: #fbf9f5; border: 1px solid var(--d-line);
  font-size: 11px; font-weight: 600; color: var(--d-muted); line-height: 1;
}
.depo .stx-chip svg { width: 13px; height: 13px; opacity: .75; }
.depo .stx-chip b { color: #4a463f; font-weight: 700; }

.depo .stx-body {
  padding: 32px 38px 38px;
  font-size: 15px; line-height: 1.85; color: #3f3b34;
}
.depo .stx-measure > *:first-child { margin-top: 0; }
.depo .stx-measure > *:last-child { margin-bottom: 0; }

/* ── Panelden girilen HTML için tipografi ───────────────────────────────── */
.depo .stx-body h1,
.depo .stx-body h2,
.depo .stx-body h3,
.depo .stx-body h4 {
  color: var(--d-ink); font-weight: 700; letter-spacing: -.2px; line-height: 1.35;
  margin: 36px 0 13px;
}
.depo .stx-body h1 { font-family: var(--d-font-head); font-size: 28px; font-weight: 500; letter-spacing: -.3px; }
.depo .stx-body h2 {
  font-size: 17px; position: relative; padding-left: 15px;
}
.depo .stx-body h2::before {
  content: ''; position: absolute; left: 0; top: .3em; bottom: .3em; width: 2px; background: var(--d-gold);
}
.depo .stx-body h3 { font-size: 15.5px; }
.depo .stx-body h4 {
  font-size: 11px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase; color: var(--d-gold);
}

.depo .stx-body p { margin: 0 0 18px; }
.depo .stx-body strong, .depo .stx-body b { color: var(--d-ink); font-weight: 700; }

.depo .stx-body a {
  color: var(--d-gold); font-weight: 600;
  text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px;
}
.depo .stx-body a:hover { color: var(--d-ink); }

.depo .stx-body ul, .depo .stx-body ol { margin: 0 0 19px; padding-left: 21px; }
.depo .stx-body li { margin-bottom: 9px; padding-left: 4px; }
.depo .stx-body li::marker { color: var(--d-gold); font-weight: 700; }

.depo .stx-body blockquote {
  margin: 24px 0; padding: 16px 20px;
  background: #fbf9f5; border: 1px solid var(--d-line);
  border-left: 3px solid var(--d-gold);
  border-radius: 0 3px 3px 0; color: #4a463f; font-style: normal;
}
.depo .stx-body blockquote p:last-child { margin-bottom: 0; }

/* Tablolar dar ekranda kendi içinde kayar */
.depo .stx-body table {
  width: 100%; border-collapse: separate; border-spacing: 0; margin: 24px 0; font-size: 13.5px;
  border: 1px solid var(--d-line); border-radius: 3px; overflow: hidden;
}
.depo .stx-body th, .depo .stx-body td { padding: 11px 14px; border-bottom: 1px solid #f0ece3; text-align: left; }
.depo .stx-body tr:last-child td { border-bottom: none; }
.depo .stx-body th {
  background: #fbf9f5; font-weight: 700; color: var(--d-ink);
  font-size: 10px; letter-spacing: 1.2px; text-transform: uppercase;
}

.depo .stx-body hr { border: none; border-top: 1px solid #f0ece3; margin: 32px 0; }

.depo .stx-body img {
  max-width: 100%; height: auto; display: block; margin: 22px 0;
  border-radius: 3px; border: 1px solid var(--d-line);
}

.depo .stx-body code {
  background: #f6f4ee; border: 1px solid var(--d-line);
  padding: 1px 6px; border-radius: 3px; font-size: .88em; color: #5a4620;
}
.depo .stx-body pre {
  background: var(--d-dark); color: #ddd7cb; padding: 16px 18px; border-radius: 3px;
  overflow-x: auto; margin: 22px 0; font-size: 12.5px; line-height: 1.7;
}
.depo .stx-body pre code { background: transparent; border: none; color: inherit; padding: 0; }

@media (max-width: 767.98px) {
  .depo .stx { padding: 0 0 36px; }
  .depo .stx-crumb { font-size: 10px; margin-bottom: 11px; gap: 6px; }
  .depo .stx-head { padding: 24px 18px 20px; }
  .depo .stx-title { font-size: 28px; }
  .depo .stx-body { padding: 22px 18px 28px; font-size: 14.5px; line-height: 1.78; }
  .depo .stx-body h1 { font-size: 22px; margin-top: 28px; }
  .depo .stx-body h2 { font-size: 16px; margin-top: 28px; padding-left: 13px; }
  .depo .stx-body h3 { font-size: 15px; margin-top: 24px; }
  .depo .stx-body table { display: block; overflow-x: auto; white-space: nowrap; }
}