/*
   Ortak belge kartı (tg A2 / A3, 2026-10-31) — _Cekirdek/_BelgeKarti: E-katalog ve Belgelerimiz. Parça bu dosyayı istek başına bir kez,
   ilk kartın içinde bağlar (gövdede, tema.css'ten SONRA); seçiciler yalnız kartın kendi sınıflarına (.op-belge*) dokunur ve temaların
   genel metin kurallarını (main h2, a, ul, img, details) ezecek kadar belirgindir. Renk, köşe, gölge temanın --op-* değişkenlerinden
   (varsayılanlar parcalar.css :root). Yönler mantıksal (sağdan sola dilde kart ve şerit aynalanır).
     • Izgara: auto-fill 220-280 px sütunlar, başa yaslı (geniş ekranda kartlar yayılmaz); tek sütuna düşen dar ekranda ortada.
     • Kart: dikey 3:4 kapak, başlık + en çok 2 satır açıklama, künye; alt şeritte "PDF · boyut" tek satır, İncele ve yuvarlak İndir
       (en az 44×44 px, üzerine gelmeden de görünür). Üzerine gelince kart hafifçe yükselir (hareket azaltma tercihinde yükselmez).
*/
.op-belge-kap { min-width: 0; }
.op-belge-kap .op-belge-izgara, .sayfa-govde .op-belge-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 280px));
    justify-content: start; gap: clamp(18px, 2vw, 28px); margin: 0; padding: 0; list-style: none; }
@media (max-width: 560px) {
    .op-belge-kap .op-belge-izgara, .sayfa-govde .op-belge-izgara { justify-content: center; }
}
.op-belge-izgara > .op-belge { position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 0;
    background: var(--op-kart); border: 1px solid var(--op-cizgi); border-radius: var(--op-yaricap); box-shadow: var(--op-golge);
    color: var(--op-metin); text-align: start; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.op-belge-izgara > .op-belge::before, .op-belge-izgara > .op-belge::marker { content: none; }
.op-belge-izgara > .op-belge:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--op-ana) 32%, var(--op-cizgi));
    box-shadow: 0 2px 6px rgba(16, 24, 40, .06), 0 26px 48px -26px rgba(16, 24, 40, .38); }
@media (prefers-reduced-motion: reduce) {
    .op-belge-izgara > .op-belge { transition: none; }
    .op-belge-izgara > .op-belge:hover { transform: none; }
}

/* ── Kapak (dikey 3:4) ── */
.op-belge .op-belge-kapak { position: relative; display: block; aspect-ratio: 3 / 4; margin: 10px 10px 0; overflow: hidden;
    border-radius: max(6px, calc(var(--op-yaricap) - 6px)); background: var(--op-zemin); text-decoration: none; color: inherit; }
.op-belge .op-belge-kapak img { display: block; width: 100%; height: 100%; max-width: none; margin: 0; object-fit: cover; border-radius: 0;
    transition: transform .5s ease; }
.op-belge:hover .op-belge-kapak img { transform: scale(1.025); }
/* Belgelerimiz: sertifika ve yetki belgesi sayfanın tamamı görünür (kırpılmaz) */
.op-belge--belge .op-belge-kapak img { object-fit: contain; padding: 14px; }
.op-belge .op-belge-kapak:focus-visible { outline: 3px solid var(--op-ana); outline-offset: 2px; }
.op-belge-yer { display: grid; place-content: center; justify-items: center; gap: 12px; width: 100%; height: 100%;
    background: linear-gradient(160deg, var(--op-ana-acik), color-mix(in srgb, var(--op-ana) 4%, #ffffff) 70%); color: var(--op-ana-metin); }
.op-belge-yer svg { width: 34%; max-width: 92px; height: auto; }
.op-belge-yer b { font-size: .78rem; font-weight: 800; letter-spacing: .16em; }
/* Yönlendirme kartı: kapak arkasında iki yaprak (çoklu katalog) + dosya sayısı */
.op-belge--yonlendirme .op-belge-kapak { overflow: visible; background: none; }
.op-belge--yonlendirme .op-belge-kapak > img, .op-belge--yonlendirme .op-belge-kapak > .op-belge-yer { position: relative; z-index: 1;
    border-radius: inherit; background-color: var(--op-zemin); box-shadow: 0 10px 22px -16px rgba(16, 24, 40, .45); }
.op-belge--yonlendirme .op-belge-kapak::before, .op-belge--yonlendirme .op-belge-kapak::after { content: ""; position: absolute; inset: 0;
    border-radius: inherit; background: var(--op-kart); border: 1px solid var(--op-cizgi); }
.op-belge--yonlendirme .op-belge-kapak::before { transform: rotate(-4deg) translate(-6px, 4px); }
.op-belge--yonlendirme .op-belge-kapak::after { transform: rotate(3deg) translate(5px, 2px); }
.op-belge-adet { position: absolute; z-index: 2; inset-block-end: 12px; inset-inline-end: 12px; display: grid; place-items: center; min-width: 44px;
    height: 44px; padding: 0 12px; border-radius: 999px; background: var(--op-ana); color: var(--op-ana-uzeri); font-weight: 800; font-size: 1.05rem;
    font-variant-numeric: tabular-nums; box-shadow: 0 8px 18px -10px rgba(16, 24, 40, .5); }

/* Tür etiketi (Belgelerimiz): kapağın üst köşesinde */
.op-belge .op-belge-tur { position: absolute; z-index: 2; inset-block-start: 20px; inset-inline-start: 20px; max-width: calc(100% - 40px);
    padding: 5px 11px; border-radius: 999px; background: rgba(255, 255, 255, .94); color: var(--op-ana-metin); font-size: .74rem; font-weight: 700;
    letter-spacing: .02em; line-height: 1.25; box-shadow: 0 0 0 1px var(--op-cizgi), 0 6px 14px -10px rgba(16, 24, 40, .4); pointer-events: none;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── Gövde ── */
.op-belge .op-belge-govde { display: flex; flex-direction: column; gap: 8px; padding: 16px 18px 14px; min-width: 0; }
/* Kart başlığı bölüm başlığı değil: telefonda _ortak/tema-duzeltmeleri.css'in "main h2" ölçüsü (!important) burada uygulanmaz */
.op-belge .op-belge-govde .op-belge-baslik { margin: 0; font-family: var(--op-baslik-font); font-weight: var(--op-baslik-agirlik); font-size: 1.04rem !important;
    line-height: 1.3 !important; letter-spacing: -.01em; color: var(--op-metin); text-transform: none; overflow-wrap: anywhere; }
.op-belge .op-belge-govde .op-belge-aciklama { margin: 0; color: var(--op-ikincil); font-size: .9rem; line-height: 1.5; display: -webkit-box;
    -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.op-belge .op-belge-govde .op-belge-kunye { margin: 0; color: var(--op-ikincil); font-size: .82rem; line-height: 1.5; overflow-wrap: anywhere; }
.op-belge .op-belge-govde .op-belge-urun { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 7px; align-self: flex-start;
    min-height: 32px; color: var(--op-ana-metin); font-size: .86rem; font-weight: 700; text-decoration: none; }
.op-belge .op-belge-urun svg { width: 16px; height: 16px; flex: none; }
.op-belge .op-belge-urun:hover span { text-decoration: underline; text-underline-offset: 3px; }
.op-belge .op-belge-govde .op-belge-dogrula { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 6px; align-self: flex-start;
    min-height: 32px; color: var(--op-ana-metin); font-size: .84rem; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.op-belge .op-belge-dogrula svg { width: 14px; height: 14px; flex: none; }
[dir="rtl"] .op-belge .op-belge-dogrula svg, [dir="rtl"] .op-belge .op-belge-incele svg { transform: scaleX(-1); }

/* Katlanır ayrıntı (veren kurum, son kontrol) */
.op-belge .op-belge-ayrinti { position: relative; z-index: 2; margin: 0; padding: 0; border: 0; background: none; }
.op-belge .op-belge-ayrinti > summary { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0; list-style: none; cursor: pointer;
    color: var(--op-metin); font-size: .84rem; font-weight: 700; background: none; border: 0; }
.op-belge .op-belge-ayrinti > summary::-webkit-details-marker { display: none; }
.op-belge .op-belge-ayrinti > summary::before, .op-belge .op-belge-ayrinti > summary::after { content: none; }
.op-belge .op-belge-ayrinti > summary::after { content: ""; width: 7px; height: 7px; border-inline-end: 2px solid currentColor; border-block-end: 2px solid currentColor;
    transform: translateY(-2px) rotate(45deg); transition: transform .2s; position: static; background: none; border-radius: 0; }
.op-belge .op-belge-ayrinti[open] > summary::after { transform: translateY(1px) rotate(-135deg); }
.op-belge .op-belge-ayrinti > summary:focus-visible { outline: 2px solid var(--op-ana); outline-offset: 2px; border-radius: 4px; }
.op-belge .op-belge-ayrinti dl { display: grid; gap: 6px; margin: 6px 0 2px; padding: 10px 12px; border-radius: var(--op-yaricap-kucuk); background: var(--op-zemin);
    font-size: .82rem; line-height: 1.45; }
.op-belge .op-belge-ayrinti dl > div { display: grid; gap: 1px; }
.op-belge .op-belge-ayrinti dt { margin: 0; color: var(--op-ikincil); font-weight: 600; }
.op-belge .op-belge-ayrinti dd { margin: 0; color: var(--op-metin); overflow-wrap: anywhere; }

/* ── Alt şerit: "PDF · boyut" (tek satır), İncele, İndir ── */
.op-belge .op-belge-serit { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: auto; padding: 12px 14px 14px;
    border-top: 1px solid var(--op-cizgi); }
.op-belge .op-belge-dosya { flex: 1 0 100%; display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: var(--op-ikincil); font-size: .78rem;
    font-weight: 700; letter-spacing: .04em; white-space: nowrap; font-variant-numeric: tabular-nums; }
.op-belge .op-belge-dosya svg { width: 16px; height: 16px; flex: none; color: var(--op-ana-metin); }
.op-belge .op-belge-serit a.op-belge-incele, .op-belge .op-belge-serit a.op-belge-buyut { flex: 1 1 auto; display: inline-flex; align-items: center;
    justify-content: center; gap: 8px; min-width: 0; min-height: 44px; margin: 0; padding: 10px 18px; border: 1.5px solid var(--op-ana); border-radius: 999px;
    background: var(--op-ana); color: var(--op-ana-uzeri); font-size: .92rem; font-weight: 700; line-height: 1.2; text-decoration: none; white-space: nowrap;
    box-shadow: none; transition: filter .15s, box-shadow .15s; }
.op-belge .op-belge-serit a.op-belge-incele svg, .op-belge .op-belge-serit a.op-belge-buyut svg { width: 16px; height: 16px; flex: none; }
.op-belge .op-belge-serit a.op-belge-incele:hover, .op-belge .op-belge-serit a.op-belge-buyut:hover { filter: brightness(1.06);
    box-shadow: 0 10px 20px -12px color-mix(in srgb, var(--op-ana) 70%, transparent); }
.op-belge .op-belge-serit a.op-belge-buyut { background: var(--op-kart); color: var(--op-ana-metin); }
.op-belge .op-belge-serit a.op-belge-buyut:hover { background: var(--op-ana-acik); filter: none; }
.op-belge .op-belge-serit a.op-belge-indir { flex: none; display: grid; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0;
    border: 1.5px solid color-mix(in srgb, var(--op-ana) 45%, var(--op-cizgi)); border-radius: 50%; background: var(--op-kart);
    color: var(--op-ana-metin); text-decoration: none; transition: background-color .15s, color .15s, border-color .15s; }
.op-belge .op-belge-serit a.op-belge-indir svg { width: 20px; height: 20px; }
.op-belge .op-belge-serit a.op-belge-indir:hover { background: var(--op-ana); border-color: var(--op-ana); color: var(--op-ana-uzeri); }
.op-belge .op-belge-serit a:focus-visible { outline: 3px solid var(--op-ana); outline-offset: 2px; }
[dir="rtl"] .op-belge .op-belge-git svg { transform: scaleX(-1); }
/* Yalnız görselli belge: kartın tamamı "Görseli büyüt" (ışık kutusu) — bağlantı kartı kaplar; künye bağlantıları ve ayrıntı üstte kalır */
.op-belge--gorsel { cursor: pointer; }
.op-belge--gorsel .op-belge-serit a.op-belge-buyut::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--op-yaricap); }
@media (prefers-reduced-motion: reduce) {
    .op-belge .op-belge-kapak img, .op-belge:hover .op-belge-kapak img { transition: none; transform: none; }
}

/* ── Belgelerimiz tür süzgeci (JS'siz bağlantılar) ── */
.op-belge-suzgec { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 clamp(20px, 2.6vw, 32px); padding: 0; }
.op-belge-suzgec a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; border: 1px solid var(--op-cizgi);
    border-radius: 999px; background: var(--op-kart); color: var(--op-metin); font-size: .9rem; font-weight: 600; line-height: 1.2; text-decoration: none;
    transition: border-color .15s, background-color .15s, color .15s; }
.op-belge-suzgec a:hover { border-color: color-mix(in srgb, var(--op-ana) 45%, var(--op-cizgi)); color: var(--op-ana-metin); }
.op-belge-suzgec a[aria-current] { background: var(--op-ana); border-color: var(--op-ana); color: var(--op-ana-uzeri); }
.op-belge-suzgec a:focus-visible { outline: 3px solid var(--op-ana); outline-offset: 2px; }
.op-belge-suzgec-sayi { min-width: 24px; padding: 1px 7px; border-radius: 999px; background: var(--op-zemin); color: var(--op-ikincil); font-size: .76rem;
    font-weight: 700; text-align: center; font-variant-numeric: tabular-nums; }
.op-belge-suzgec a[aria-current] .op-belge-suzgec-sayi { background: color-mix(in srgb, var(--op-ana-uzeri) 22%, transparent); color: var(--op-ana-uzeri); }