/* Tek mesele sayfası. Renk YOK — hepsi temel.css belirteci (Kural 3). */

.mesele-foto {
  margin: 0 0 var(--bos-6);
  border-radius: var(--kose);
  overflow: hidden;
  border: 1px solid var(--cizgi);
  background: var(--zemin-kat);
}
.mesele-foto img {
  display: block; width: 100%; height: auto;
  aspect-ratio: 16 / 9; object-fit: cover;
  filter: var(--gorsel-suzgec);
}

.mesele-sayac {
  font-size: var(--ol-2xs); letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--vurgu); font-weight: 600; margin: 0 0 var(--bos-5);
}

.mesele-liste {
  list-style: none; margin: 0; padding: 0;
  border-block-start: 1px solid var(--cizgi);
}
.mesele-madde {
  padding-block: var(--bos-5);
  border-block-end: 1px solid var(--cizgi);
}
.mesele-ust {
  display: flex; flex-wrap: wrap; gap: var(--bos-2) var(--bos-4);
  align-items: baseline; margin-block-end: var(--bos-3);
  font-size: var(--ol-3xs); letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--metin-silik);
}
.mesele-kaynak { color: var(--vurgu); }

.mesele-alinti {
  margin: 0 0 var(--bos-3);
  padding-inline-start: var(--bos-4);
  border-inline-start: 2px solid var(--cizgi-guclu);
  font-family: var(--yazi-makale);
  font-size: var(--ol-m); line-height: 1.55; color: var(--metin);
}
.mesele-alinti:last-child { margin-block-end: 0; }
/* Tespit ile öneri GÖRSEL olarak ayrılıyor: ikisi aynı görünürse sayfa
   "şikâyet listesi" gibi okunuyor, öneriler kayboluyordu. */
.mesele-alinti[data-tur="cozum"] {
  border-inline-start-color: var(--vurgu);
  color: var(--metin-sonuk);
}

.mesele-geri { margin-block-start: var(--bos-6); font-size: var(--ol-2xs); }
.mesele-geri a { color: var(--vurgu); }

@media (max-width: 34rem) {
  .mesele-alinti { font-size: var(--ol-s); padding-inline-start: var(--bos-3); }
}