/* Hakkımızda — Belgelerimiz bölümü (önek: bl-). Lacivert zemin üzerinde dört sertifika taraması; tıklayınca büyür. */
.bl-bolum { background-color: var(--lacivert); background-image: linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px), radial-gradient(ellipse 50% 80% at 88% 10%, var(--giris-parilti), transparent 70%); background-size: 24px 24px, 24px 24px, auto; color: var(--beyaz); scroll-margin-top: 80px; }
.bl-bolum .bolum-etiket { color: var(--vurgu-acik); }
.bl-bolum .bolum-etiket::before { background: var(--vurgu-acik); }
.bl-bolum .hk-baslik { color: var(--beyaz); }
.bl-bolum .hk-baslik::after { background: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)) left center / 100% 1px no-repeat, linear-gradient(#fff, #fff) left center / 1px 100% no-repeat, linear-gradient(#fff, #fff) right center / 1px 100% no-repeat; }
.bl-aciklama { margin: 6px 0 0; max-width: 64ch; font-size: 16px; line-height: 1.6; color: var(--giris-yazi); text-wrap: pretty; }

.bl-izgara { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px clamp(16px, 2.2vw, 28px); }
.bl-kart { min-width: 0; display: grid; align-content: start; gap: 16px; }
.bl-tarama { position: relative; display: block; padding: 0; border: 0; border-radius: 4px; overflow: hidden; background: #fff; cursor: zoom-in; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14), 0 18px 36px -18px rgba(0, 0, 0, 0.7); transition: transform 0.25s cubic-bezier(0.2, 0.7, 0.2, 1), box-shadow 0.25s; }
.bl-tarama img { display: block; width: 100%; height: auto; aspect-ratio: 520 / 738; object-fit: cover; }
.bl-tarama:hover { transform: translateY(-4px); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.3), 0 26px 44px -18px rgba(0, 0, 0, 0.8); }
.bl-tarama:focus-visible { outline: 2px solid var(--vurgu-acik); outline-offset: 3px; }
.bl-buyut { position: absolute; right: 10px; bottom: 10px; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--lacivert); color: var(--beyaz); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35); }
.bl-buyut svg { width: 18px; height: 18px; }
.bl-metin { display: grid; gap: 6px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, 0.22); }
.bl-standart { margin: 0; font-family: var(--yazi-mono); font-size: 13px; font-weight: 500; letter-spacing: 0.08em; color: var(--vurgu-acik); }
.bl-kart h3 { margin: 0; font-family: var(--yazi-baslik); font-size: 25px; font-weight: 600; line-height: 1.1; color: var(--beyaz); text-wrap: balance; }
.bl-kart p.bl-ne { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--giris-yazi); }
.bl-no { margin: 4px 0 0; font-family: var(--yazi-mono); font-size: 12px; letter-spacing: 0.04em; color: var(--giris-yazi); opacity: 0.85; }

.bl-kunye { margin: 0; padding: 20px 0 0; border-top: 1px solid rgba(255, 255, 255, 0.22); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px clamp(16px, 2.2vw, 28px); }
.bl-kunye div { min-width: 0; display: grid; align-content: start; gap: 4px; }
.bl-kunye dt { font-family: var(--yazi-mono); font-size: 11.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--vurgu-acik); }
.bl-kunye dd { margin: 0; font-size: 14.5px; line-height: 1.5; color: var(--beyaz); }

/* Büyütülmüş belge */
dialog.bl-pencere { padding: 0; border: 0; background: transparent; max-width: min(92vw, 820px); max-height: 94vh; overflow: visible; }
dialog.bl-pencere::backdrop { background: rgba(8, 14, 22, 0.86); }
html:has(dialog.bl-pencere[open]) { overflow: hidden; }
.bl-pencere-ic { display: grid; gap: 10px; }
.bl-pencere-ust { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #fff; }
.bl-pencere-ad { margin: 0; font-family: var(--yazi-mono); font-size: 13px; letter-spacing: 0.06em; }
.bl-pencere-dugmeler { display: flex; gap: 8px; }
.bl-pencere button { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.35); background: rgba(255, 255, 255, 0.08); color: #fff; display: grid; place-items: center; cursor: pointer; }
.bl-pencere button:hover { background: rgba(255, 255, 255, 0.2); }
.bl-pencere button svg { width: 18px; height: 18px; }
.bl-pencere-kaydir { max-height: calc(94vh - 60px); overflow: auto; border-radius: 4px; background: #fff; }
.bl-pencere-kaydir img { display: block; width: 100%; height: auto; }

@media (max-width: 999px) {
  .bl-izgara, .bl-kunye { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 419px) {
  .bl-kart h3 { font-size: 21px; }
  .bl-kart p.bl-ne { font-size: 13.5px; }
  .bl-kunye { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) { .bl-tarama { transition: none; } .bl-tarama:hover { transform: none; } }
@media print { .bl-bolum { background: #fff; color: #000; } }

/* Ürün belgeleri (Yerli Malı): yönetim sistemi belgelerinin altında ayrı grup, aynı kart düzeni */
.bl-grup { display: grid; gap: 6px; padding-top: clamp(28px, 3vw, 40px); border-top: 1px solid rgba(255, 255, 255, 0.22); }
.bl-grup-baslik { margin: 0; font-family: var(--yazi-baslik); font-size: clamp(26px, 2.6vw, 34px); font-weight: 600; line-height: 1.1; color: var(--beyaz); }
.bl-urun .bl-no { overflow-wrap: anywhere; }

/* Belgelerimiz sayfası (belgeler.html): yalnız belgeler, beyaz zemin; tarama ve belge adı */
.bl-sayfa { background: #FFFFFF; border-bottom: 1px solid var(--cizgi); }
.bl-sayfa-ic { padding-block: clamp(36px, 5vw, 64px) clamp(56px, 7vw, 96px); display: grid; gap: clamp(24px, 3vw, 36px); }
.bl-sayfa-baslik { margin: 0; font-family: var(--yazi-baslik); font-size: clamp(34px, 4vw, 48px); font-weight: 700; line-height: 1.05; color: var(--murekkep); }
.bl-sayfa .bl-izgara { gap: clamp(28px, 3vw, 40px) clamp(16px, 2.2vw, 28px); }
.bl-sayfa .bl-tarama { box-shadow: 0 0 0 1px var(--cizgi), 0 14px 30px -18px rgba(18, 26, 38, 0.35); }
.bl-sayfa .bl-tarama:hover { box-shadow: 0 0 0 1px var(--cizgi-guclu, #C9D3DE), 0 22px 40px -18px rgba(18, 26, 38, 0.45); }
.bl-sayfa .bl-tarama:focus-visible { outline-color: var(--mavi); }
.bl-sayfa .bl-metin { gap: 4px; padding-top: 12px; border-top: 1px solid var(--cizgi); }
.bl-sayfa .bl-standart { color: var(--mavi); }
.bl-sayfa .bl-kart h3 { font-size: clamp(21px, 2vw, 24px); color: var(--murekkep); }
