/* =========================================================
   utilities.css · Şablonlardan çıkarılan inline style="" yerine
   ---------------------------------------------------------
   Amaç: PHP şablonlarında dağınık duran style="" niteliklerini tek bir
   yerde toplamak. Atomik ve birleştirilebilir sınıflar — böylece yeni bir
   kombinasyon için yeni sınıf yazmak gerekmez.

   İsimlendirme: u-<özellik>-<değer>. Ondalıklar alt çizgi ile (u-fs-1_05).
   ========================================================= */

/* ---------- Boşluk (flex/grid gap) ---------- */
.u-gap-8   { gap: 8px }
.u-gap-10  { gap: 10px }
.u-gap-12  { gap: 12px }
.u-gap-14  { gap: 14px }
.u-gap-16  { gap: 16px }
.u-gap-18  { gap: 18px }
.u-gap-20  { gap: 20px }

/* ---------- Flex hizalama ---------- */
.u-flex-wrap      { flex-wrap: wrap }
.u-justify-center { justify-content: center }
.u-justify-end    { justify-content: flex-end }
.u-items-start    { align-items: flex-start }
.u-w-full-center  { width: 100%; justify-content: center }

/* ---------- Dış/iç boşluk ---------- */
.u-mt-4    { margin-top: 4px }
.u-mt-8    { margin-top: 8px }
.u-mt-10   { margin-top: 10px }
.u-mt-18   { margin-top: 18px }
.u-mt-20   { margin-top: 20px }
.u-mt-24   { margin-top: 24px }
.u-mt-28   { margin-top: 28px }
/* 42px: eski statik sayfalarda bölüm başlıklarının ve kart ızgaralarının
   satır içi margin-top değeri. .entry-content'in 1.35em ritmi (~24px) daha
   dardır; blok karşılığı aynı boşluğu korusun diye utility olarak tanımlandı. */
.u-mt-42   { margin-top: 42px }
.u-mb-8    { margin-bottom: 8px }
.u-mb-16   { margin-bottom: 16px }
.u-mb-32   { margin-bottom: 32px }
.u-mb-36   { margin-bottom: 36px }
.u-pt-0    { padding-top: 0 }
.u-ml-auto { margin-left: auto }
.u-mi-auto { margin-inline: auto }
.u-mt-neg1 { margin-top: -1px }

/* ---------- Tipografi ---------- */
.u-text-center { text-align: center }
.u-fs-92       { font-size: .92rem }
.u-fs-95       { font-size: .95rem }
.u-fs-1        { font-size: 1rem }
.u-fs-1_05     { font-size: 1.05rem }
.u-fs-1_2      { font-size: 1.2rem }
.u-fs-95-mt4   { font-size: .95rem; margin-top: 4px }
.u-italic      { font-style: italic }

/* ---------- Renk ---------- */
.u-c-bordo-700  { color: var(--bordo-700) }
.u-c-gold-500   { color: var(--gold-500) }
.u-c-muted      { color: var(--muted) }
.u-c-faint      { color: var(--faint) }
.u-c-white      { color: #fff }
.u-c-onbordo    { color: #e9c9cd }
.u-bg-bordo-800 { background: var(--bordo-800) }
.u-bg-bordo-50  { background: var(--bordo-50); border-color: var(--bordo-100) }
.u-bg-surface-b { background: var(--surface); border-bottom: 1px solid var(--border) }
.u-border-strong{ border-color: var(--border-strong); color: var(--ink-soft) }
/* "Henüz içerik yok" kutularının altın üst şeridi — eski gövdelerde satır içi
   border-top:3px solid var(--gold-600) olarak yazılıydı. ARKMER'in /yayinlar/
   ve /publications/ sayfaları bloklaştırıldıktan sonra bu sınıfı KULLANIR;
   tanımsız kalırsa şerit sessizce kaybolur. */
.u-bt-gold      { border-top: 3px solid var(--gold-600) }

/* ---------- Görsel oranları / kapak görselleri ---------- */
.u-aspect-3-4        { aspect-ratio: 3 / 4 }
.u-cover-image       { aspect-ratio: 3/4; object-fit: cover; width: 100%; border-radius: 8px; box-shadow: var(--shadow-lg) }
.u-cover-image-fill  { object-fit: cover; width: 100%; height: 100% }
.u-media-round-b     { overflow: hidden; border-radius: 0 0 var(--radius-lg) var(--radius-lg); line-height: 0; background: var(--surface) }

/* ---------- Yerleşim ---------- */
.u-grid-auto-260   { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 18px }
.u-grid-auto-280   { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px }
.u-grid-auto-300   { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px }
.u-grid-2col-wide  { grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 64px); align-items: start }

/* İki eşit sütun — misyon/vizyon gibi YAN YANA duran iki kart için.
   .focus-grid burada KULLANILMAZ: auto-fit minmax(240px) geniş ekranda 4 sütun
   açar, iki kart soldaki iki dar sütuna sıkışır. .u-grid-2col-wide de uymaz;
   align-items:start kartların .focus{height:100%} eşitlemesini bozar ve
   yükseklikleri farklı çıkar. Varsayılan stretch hizalaması korunur. */
.u-grid-2          { grid-template-columns: 1fr 1fr; gap: 16px }
@media (max-width: 720px) { .u-grid-2 { grid-template-columns: 1fr } }
.u-grid-1col-card  { grid-template-columns: 1fr; padding: 24px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: #fff }
.u-narrow-hero     { max-width: 820px; padding-top: clamp(30px, 5vw, 56px); padding-bottom: clamp(24px, 3vw, 36px) }
.u-maxw-1040       { max-width: 1040px }
.u-pad-center-48   { padding: 48px 0; text-align: center }
