/* sayfa-rapor.css — Faaliyet Raporu. Genel merkezin "il başkanı ne yapmış,
   çalışıyor mu" diye baktığı sayfa: rakam önde, görüntü altında, sahne sahne.
   Renk yok — yalnız belirteç (Kural 3). */

.rapor { --rapor-en: 78rem; }
.rapor-ic, .rapor-sahne { width: min(var(--rapor-en), 100% - 2 * var(--bos-5)); margin-inline: auto; }
.rapor-sahne { padding-block: var(--bolum-bos); position: relative; }
.rapor-sahne + .rapor-sahne { border-top: 1px solid var(--cizgi); }

/* ---- üst başlık dili ---- */
.rapor-ust { font-size: var(--ol-xs); letter-spacing: 0.18em; text-transform: uppercase; color: var(--vurgu); margin: 0 0 var(--bos-3); }
.rapor-h2 { font-family: var(--yazi-ekran); font-weight: 500; font-size: clamp(1.9rem, 4.2vw, 3.4rem); line-height: 1.05; letter-spacing: 0.01em; margin: 0; max-width: 20ch; }
.rapor-not { color: var(--metin-silik); font-size: var(--ol-s); max-width: 60ch; margin-top: var(--bos-3); }
.rapor-bas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: var(--bos-5); align-items: end; margin-bottom: var(--bos-6); }
.rapor-bas p { margin: 0; }

/* ---- rakam ---- */
.rapor-sayi { font-family: var(--yazi-ekran); font-weight: 500; color: var(--vurgu); line-height: 0.95; letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums; font-size: clamp(2.6rem, 6vw, 4.8rem); margin: 0; }
.rapor-sayi small { font-family: var(--yazi-govde); font-weight: 400; font-size: 0.3em; color: var(--metin-silik); letter-spacing: 0.08em; text-transform: uppercase; margin-inline-start: 0.25em; }
.rapor-etiket { display: block; margin-top: var(--bos-2); font-size: var(--ol-s); color: var(--metin); }
.rapor-etiket small { display: block; color: var(--metin-silik); font-size: var(--ol-xs); margin-top: 0.2rem; }

/* ---- açılış ---- */
.rapor-acilis { padding-block: calc(var(--bos-8) + 3rem) var(--bos-8); }
.rapor-acilis .rapor-ic { position: relative; z-index: 1; max-width: 62rem; margin-inline: max(var(--bos-5), (100% - var(--rapor-en)) / 2) auto; }
.rapor-baslik { font-family: var(--yazi-ekran); font-weight: 500; font-size: clamp(3rem, 8.4vw, 7.4rem); line-height: 0.98; letter-spacing: 0.01em; margin: 0; color: var(--metin); }
.rapor-alt { margin: var(--bos-3) 0 0; color: var(--vurgu); font-size: var(--ol-s); letter-spacing: 0.04em; }
.rapor-lead { margin: var(--bos-4) 0 0; max-width: 46ch; font-size: var(--ol-m); color: var(--metin); }
.rapor-kpi { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: var(--bos-4); margin-top: var(--bos-7); align-items: start; }
.rapor-kpi > div { padding-top: var(--bos-3); border-top: 1px solid var(--vurgu); }
.rapor-kpi .rapor-sayi { font-size: clamp(2.2rem, 4.6vw, 4rem); }

/* ---- rakam duvarı ---- */
.rapor-duvar-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(13.5rem, 1fr)); gap: var(--bos-5) var(--bos-5); }
.rapor-duvar-izgara > div { padding-top: var(--bos-3); border-top: 1px solid var(--cizgi-guclu); }
.rapor-duvar-izgara > div:first-child { grid-column: span 2; border-top-color: var(--vurgu); }
.rapor-duvar-izgara > div:first-child .rapor-sayi { font-size: clamp(3.4rem, 8vw, 6.6rem); }
.rapor-yil { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--bos-4); margin-top: var(--bos-7); }
.rapor-yil > div { display: grid; gap: var(--bos-2); }
.rapor-yil b { font-family: var(--yazi-ekran); font-weight: 500; font-size: var(--ol-l); color: var(--metin); }
.rapor-cubuk { height: 4px; background: var(--cizgi); overflow: hidden; }
.rapor-cubuk i { display: block; height: 100%; width: calc(var(--oran, 1) * 100%); background: var(--vurgu); transform-origin: left center; }

/* ---- ilçe sahnesi (sabitlenir) ---- */
.rapor-ilce { padding-block: var(--bos-7); }
.rapor-ilce-ic { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: var(--bos-7); align-items: center; }
.rapor-ilce .rapor-sayi { font-size: clamp(3.4rem, 8vw, 6.4rem); }
.ilce-liste { list-style: none; margin: var(--bos-5) 0 0; padding: 0; display: grid; gap: 0.15rem; }
.ilce-liste li { display: grid; grid-template-columns: 2.2rem 1fr auto auto; gap: var(--bos-3); align-items: baseline; padding: 0.35rem 0; border-bottom: 1px solid var(--cizgi); }
.ilce-liste li:first-child .ilce-sayi { font-size: clamp(2.2rem, 3.6vw, 3rem); }
.ilce-sira { font-size: var(--ol-2xs); color: var(--metin-silik); letter-spacing: 0.1em; }
.ilce-ad { font-family: var(--yazi-ekran); font-size: clamp(1.05rem, 1.6vw, 1.35rem); letter-spacing: 0.02em; }
.ilce-sayi { font-family: var(--yazi-ekran); font-weight: 500; color: var(--vurgu); font-size: clamp(1.5rem, 2.6vw, 2.2rem); font-variant-numeric: tabular-nums; line-height: 1; min-width: 3ch; text-align: end; }
.ilce-birim { font-size: var(--ol-2xs); color: var(--metin-silik); letter-spacing: 0.08em; text-transform: uppercase; }
.rapor-gazete-yuvarlak { display: grid; grid-template-columns: auto 1fr; align-items: center; justify-items: start; gap: var(--bos-3); text-decoration: none; color: var(--metin); padding-top: 0; text-align: center; }
.rapor-gazete-yuvarlak .yuvarlak { position: relative; display: block; width: 5rem; height: 5rem; border-radius: 50%; overflow: hidden;
  border: 2px solid var(--vurgu); box-shadow: var(--golge), 0 0 0 4px color-mix(in srgb, var(--vurgu) 22%, transparent); background: var(--zemin-kat);
  transition: transform var(--sure-hover, 0.55s) var(--es-yumusak, ease), box-shadow var(--sure-hover, 0.55s) var(--es-yumusak, ease); }
.rapor-gazete-yuvarlak img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; display: block; }
/* Küçük dairede "Oku" etiketi okunmuyordu; kapak görseli tek başına yeter. */
.rapor-gazete-yuvarlak .yuvarlak-etiket { display: none; }
.rapor-gazete-yuvarlak .rapor-etiket { text-align: start; }
@media (hover: hover) and (pointer: fine) { .rapor-gazete-yuvarlak:hover .yuvarlak { transform: translateY(-6px) scale(1.03); box-shadow: var(--golge), 0 0 0 10px color-mix(in srgb, var(--vurgu) 30%, transparent); } }
.ilce-foto { position: relative; aspect-ratio: 4 / 5; max-height: 72svh; }
.ilce-foto figure { position: absolute; margin: 0; inset: 6% 9%; overflow: hidden; border: 1px solid var(--cizgi); background: var(--zemin-kat); box-shadow: var(--golge); }
.ilce-foto img { width: 100%; height: 100%; object-fit: cover; filter: var(--gorsel-suzgec); }
.ilce-foto figcaption { position: absolute; inset-inline: 0; inset-block-end: 0; padding: var(--bos-3); font-size: var(--ol-2xs); color: var(--metin);
  background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--zemin) 88%, transparent)); }
.ilce-foto figure:nth-child(1) { transform: rotate(-6deg) translate(-13%, 7%); z-index: 1; opacity: 0.8; }
.ilce-foto figure:nth-child(2) { transform: rotate(5deg) translate(13%, -6%); z-index: 2; opacity: 0.9; }
.ilce-foto figure:nth-child(3) { transform: rotate(-1deg); z-index: 3; }

/* ---- faaliyet blokları: rakam sabit solda, kanıt sağda ---- */
.rapor .faaliyet { display: grid; grid-template-columns: minmax(9rem, 15rem) minmax(0, 1fr); gap: var(--bos-6); padding-block: var(--bos-7); border-top: 1px solid var(--cizgi); }
.rapor .faaliyet:first-of-type { border-top: 0; padding-top: 0; }
.rapor .faaliyet-bas { display: contents; }
.rapor .faaliyet-sayi { position: sticky; top: 6rem; align-self: start; font-family: var(--yazi-ekran); font-weight: 500; color: var(--vurgu);
  font-size: clamp(3rem, 6.5vw, 5.6rem); line-height: 0.95; margin: 0; font-variant-numeric: tabular-nums; }
.rapor .faaliyet-sayi span { display: block; font-size: var(--ol-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--metin-silik); margin-top: var(--bos-2); }
.rapor .faaliyet-bas > div { grid-column: 2; }
.rapor .faaliyet-bas h2 { font-family: var(--yazi-ekran); font-weight: 500; font-size: clamp(1.5rem, 3vw, 2.4rem); line-height: 1.1; margin: 0; }
.rapor .faaliyet-not { margin-top: var(--bos-3); max-width: 60ch; color: var(--metin-silik); }
.rapor .faaliyet-dokum, .rapor .kanit-izgara, .rapor .kanit-yok { grid-column: 2; }
.rapor .faaliyet-dokum { display: flex; flex-wrap: wrap; gap: var(--bos-2); list-style: none; margin: var(--bos-4) 0 0; padding: 0; }
.rapor .faaliyet-dokum li { display: flex; gap: var(--bos-2); align-items: baseline; padding: 0.35rem 0.8rem; border: 1px solid var(--cizgi); font-size: var(--ol-xs); }
.rapor .kanit-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); gap: var(--bos-4); margin-top: var(--bos-5); }
.rapor .kanit-kare img { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; filter: var(--gorsel-suzgec); border: 1px solid var(--cizgi); }
.rapor .kanit-kare figcaption { font-size: var(--ol-2xs); color: var(--metin-silik); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* ---- teşkilat ---- */
.rapor-uc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--bos-5); }
.rapor-uc > div { padding-top: var(--bos-3); border-top: 1px solid var(--vurgu); }
.rapor-listeler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--bos-5); margin-top: var(--bos-7); }
.rapor-listeler h3 { font-family: var(--yazi-ekran); font-weight: 500; font-size: var(--ol-m); margin: 0 0 var(--bos-3); }
.rapor-listeler ol, .rapor-listeler ul { margin: 0; padding-inline-start: 1.2em; display: grid; gap: 0.4rem; font-size: var(--ol-s); }
.rapor-kunye { margin: 0; display: grid; gap: 0.5rem; font-size: var(--ol-s); }
.rapor-kunye div { display: grid; grid-template-columns: 8rem 1fr; gap: var(--bos-2); border-bottom: 1px solid var(--cizgi); padding-bottom: 0.4rem; }
.rapor-kunye dt { color: var(--metin-silik); } .rapor-kunye dd { margin: 0; }

/* ---- tespitler ---- */
.rapor-tespit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--bos-5); }
.rapor-konu { padding: var(--bos-4); border: 1px solid var(--cizgi); background: var(--zemin-kat); display: grid; gap: var(--bos-3); align-content: start; }
.rapor-konu h3 { font-family: var(--yazi-ekran); font-weight: 500; font-size: var(--ol-m); margin: 0; }
.rapor-konu h3 small { display: block; color: var(--vurgu); font-size: var(--ol-xs); font-family: var(--yazi-govde); letter-spacing: 0.06em; margin-top: 0.3rem; }
.rapor-konu blockquote { margin: 0; font-family: var(--yazi-makale); font-size: var(--ol-s); line-height: 1.55; border-inline-start: 2px solid var(--vurgu); padding-inline-start: var(--bos-3); }
.rapor-konu .rapor-not { margin: 0; font-size: var(--ol-2xs); }

/* ---- sandık ---- */
.rapor-sandik-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bos-6); }
.rapor-sandik-izgara > div { padding-top: var(--bos-3); border-top: 1px solid var(--vurgu); }
.rapor-sandik-izgara .rapor-sayi { font-size: clamp(3rem, 7vw, 5.8rem); }
.rapor-cipler { display: flex; flex-wrap: wrap; gap: var(--bos-2); margin-top: var(--bos-4); }
.rapor-cipler span { padding: 0.3rem 0.75rem; border: 1px solid var(--vurgu); color: var(--vurgu); font-size: var(--ol-xs); letter-spacing: 0.04em; }

/* ---- basılı sayı ---- */
.rapor .gazete-izgara { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--bos-4); }
.rapor .gazete-sayfa { margin: 0; display: flex; flex-direction: column; gap: var(--bos-2); }
.rapor .gazete-sayfa a { display: block; border: 1px solid var(--cizgi); background: var(--zemin-kat); box-shadow: var(--golge-yakin); }
.rapor .gazete-sayfa img { display: block; width: 100%; height: auto; }
.rapor .gazete-sayfa figcaption { font-size: var(--ol-2xs); color: var(--metin-silik); letter-spacing: 0.06em; text-transform: uppercase; }
.rapor .dugme { display: inline-block; padding: 0.8rem 1.4rem; border: 1px solid var(--vurgu); color: var(--vurgu); text-decoration: none; letter-spacing: 0.08em; text-transform: uppercase; font-size: var(--ol-xs); }
@media (max-width: 62rem) { .rapor .gazete-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--bos-3); } }

/* ---- çevirmeli okuyucu ---- */
.okuyucu-acik, .okuyucu-acik body { overflow: hidden; }
.okuyucu { position: fixed; inset: 0; z-index: 90; background: color-mix(in srgb, var(--zemin-derin) 94%, transparent);
  display: grid; grid-template-rows: 1fr auto; padding: var(--bos-4); backdrop-filter: blur(6px); }
.okuyucu-kapat { position: absolute; top: var(--bos-3); right: var(--bos-3); width: 2.8rem; height: 2.8rem; border-radius: 50%;
  border: 1px solid var(--cizgi-guclu); background: var(--zemin-kat); color: var(--metin); font-size: 1.6rem; line-height: 1; cursor: pointer; z-index: 2; }
.okuyucu-kapat:hover, .okuyucu-ok:hover { border-color: var(--vurgu); color: var(--vurgu); }
.okuyucu-sahne { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--bos-3); min-height: 0; }
.okuyucu-ok { width: 3rem; height: 3rem; border-radius: 50%; border: 1px solid var(--cizgi-guclu); background: var(--zemin-kat); color: var(--metin);
  font-size: 2rem; line-height: 1; cursor: pointer; transition: border-color var(--gecis), color var(--gecis), opacity var(--gecis); }
.okuyucu-ok:disabled { opacity: 0.25; cursor: default; }
.okuyucu-kitap { position: relative; justify-self: center; height: min(86vh, calc((100vw - 10rem) * 1754 / 1240)); aspect-ratio: 1240 / 1754;
  perspective: 2600px; cursor: pointer; user-select: none; touch-action: pan-y; }
.okuyucu-kitap img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block;
  background: var(--marka-kagit, #fff); box-shadow: var(--golge); }
.okuyucu-yaprak { position: absolute; inset: 0; transform-origin: left center; transform-style: preserve-3d; backface-visibility: hidden;
  visibility: hidden; transition: transform 0.55s var(--es-cikis, cubic-bezier(0.19, 1, 0.22, 1)); z-index: 2; }
.okuyucu-yaprak.acik { visibility: visible; }
.okuyucu-yaprak::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(0 0 0 / 0.35), transparent 40%); opacity: 0.9; pointer-events: none; }
.okuyucu-ust { z-index: 3; }
.okuyucu-cubuk { display: flex; justify-content: center; align-items: center; gap: var(--bos-5); padding-top: var(--bos-3);
  font-size: var(--ol-xs); color: var(--metin-silik); letter-spacing: 0.06em; text-transform: uppercase; }
.okuyucu-sayac { font-family: var(--yazi-ekran); font-size: var(--ol-m); color: var(--vurgu); letter-spacing: 0.08em; }
.okuyucu-pdf { color: var(--vurgu); text-decoration: none; border: 1px solid var(--vurgu); padding: 0.4rem 0.9rem; }
.rapor .gazete-sayfa a { cursor: zoom-in; }
@media (max-width: 62rem) {
  .okuyucu { padding: var(--bos-2); }
  .okuyucu-sahne { grid-template-columns: 1fr; }
  .okuyucu-ok { display: none; }
  .okuyucu-kitap { height: auto; width: min(100%, calc(80vh * 1240 / 1754)); }
  .okuyucu-ipucu { display: none; }
}
@media (prefers-reduced-motion: reduce) { .okuyucu-yaprak { transition: none; } }

/* ---- kapanış ---- */
.rapor-kapanis { text-align: center; padding-block: var(--bos-8); }
.rapor-kapanis .rapor-ic { max-width: 54rem; }
.rapor-kapanis-metin { font-family: var(--yazi-ekran); font-weight: 500; font-size: clamp(1.6rem, 3.6vw, 3rem); line-height: 1.2; margin: 0; color: var(--metin); }
.rapor-kapanis .rapor-not { margin-inline: auto; }
.rapor-kaynak { width: min(var(--rapor-en), 100% - 2 * var(--bos-5)); margin: 0 auto; padding-block: var(--bos-5) var(--bos-7); border-top: 1px solid var(--cizgi); color: var(--metin-silik); font-size: var(--ol-xs); }
.rapor-kaynak a { color: var(--metin); }

/* ---- dar ekran ---- */
@media (max-width: 62rem) {
  .rapor-acilis .sahne-fon img { object-position: 62% 18%; }
  .rapor-acilis .sahne-fon::after { background:
    linear-gradient(180deg, color-mix(in srgb, var(--zemin) 30%, transparent) 0%, color-mix(in srgb, var(--zemin) 78%, transparent) 30%, var(--zemin) 52%); }
  .rapor-bas, .rapor-ilce-ic, .rapor-uc, .rapor-listeler, .rapor-tespit, .rapor-sandik-izgara { grid-template-columns: 1fr; }
  .rapor-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rapor-gazete-yuvarlak { grid-column: span 2; }
  .ilce-foto { display: none; }
  .rapor .faaliyet { grid-template-columns: 1fr; gap: var(--bos-4); }
  .rapor .faaliyet-sayi { position: static; }
  .rapor .faaliyet-bas > div, .rapor .faaliyet-dokum, .rapor .kanit-izgara, .rapor .kanit-yok { grid-column: 1; }
  .rapor .kanit-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bos-3); }
  .rapor-duvar-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bos-4); }
  .rapor-duvar-izgara > div:first-child { grid-column: span 2; }
  .ilce-liste li { grid-template-columns: 1.8rem 1fr auto auto; }
  .dev-yazi { font-size: clamp(4rem, 22vw, 8rem); opacity: 0.22; }
}