/* ==========================================================================
   Public içerik sayfaları — Tarihçe, Vizyon, Misyon, Kulüp tüzüğü, Danışman
   kurulu yönetmeliği, Yönetim / Danışman kurulu, Başkanlarımız, Üyelerimiz,
   Dağcılık kütüphanesi, Basında biz, Bize katılın, İletişim, Mobil uygulama
   ve hata sayfası (SPEC §12.23, §13.1 "İçerik sayfaları").

   Yalnız components.css'te karşılığı OLMAYAN sayfa kuralları burada; jeton
   dışında renk yok, !important yok. Görünümler @section Styles ile yükler.
   ========================================================================== */

/* Süzgeçle gizlenen öğeler için burada kural YOK: components.css:31
   `[hidden]{display:none!important}` zaten display taşıyan sınıfları eziyor. */

/* --------------------------------------------------------- Dar içerik sütunu
   Kaynak listeleri (Eğitimler, Basında biz) ve Başkanlarımız zaman çizelgesi dar
   bir ölçüde okunur. `.container--narrow` bunu ORTALAYARAK yapıyordu: sayfa başı
   (Ui/_PageHead) düz `.container` kullandığı için h1 x≈100'de, gövde x≈340'ta
   başlıyor ve 1440'ta 240 px'lik görünür hizasızlık oluşuyordu. Ölçü burada
   ortalamadan verilir; gövde h1 ile aynı sol kenardan başlar. */
.pc-narrow > * { max-width: 760px; }

/* ------------------------------------------------------------- İçerik sayfası
   Uzun metnin ölçüsü .rich'te (70ch). Buradakiler metnin çevresidir: belge
   künyesi, içindekiler ve sayfa sonu geçişi. */

/* Tüzük / yönetmelik künyesi: "resmî belge" bağlamı ve son güncelleme. */
.pc-doc-note {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 28px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-left: 3px solid var(--g900);
  border-radius: var(--r-md);
  background: var(--bg-subtle);
  font: var(--t-meta);
  color: var(--text-2);
}
.pc-doc-note .bi { flex: none; margin-top: 2px; font-size: 1.125rem; }
.pc-doc-note b { color: var(--text); }
.pc-doc-note__text { min-width: 0; }

/* İçindekiler: components.css'teki .toc yalnız ≥1280'de görünür. Başlık
   bulunamazsa betik kabı gizler ([hidden] components.css:31'de hallediliyor).
   Başlık metni uzun olabilir: components.css'teki tek satırlık hizayı sarmalı yap
   (dokunma hedefi .toc a'daki min-height ile 44 px kalır). */
.pc-toc a { display: block; align-items: initial; padding: 11px 0; line-height: 1.35; overflow-wrap: anywhere; }
/* Tüzük metni "MADDE ..." başlıklarından üretildiğinde liste uzun olabilir:
   yapışkan kutu ekranı taşırmasın, kendi içinde kaysın. */
.pc-toc { max-height: calc(100vh - var(--header-h) - 64px); overflow-y: auto; overscroll-behavior: contain; }

/* .rich içinde bağlantı hedefi olan başlıklar yapışkan başlığın altında kalmasın.
   [data-baslik]: paragraftan başlık sayılan öğeler (public-content.js). */
.pc-rich :is(h1, h2, h3, h4)[id],
.pc-rich [data-baslik] { scroll-margin-top: calc(var(--header-h) + 20px); }

/* Sayfa sonu geçişi (Vizyon ↔ Misyon, tüzük ↔ yönetmelik) */
.pc-nav {
  display: grid;
  gap: 12px;
  margin-top: 48px;
  padding-top: 24px;
  border-top: 1px solid var(--border);
}
@media (min-width: 768px) { .pc-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pc-nav__link {
  display: grid;
  gap: 4px;
  align-content: center;
  min-height: 44px;
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  color: inherit;
  transition: border-color var(--d-fast), box-shadow var(--d-fast);
}
.pc-nav__link:hover { border-color: var(--border-strong); box-shadow: var(--e1); }
.pc-nav__link:hover .pc-nav__title { text-decoration: underline; text-underline-offset: 3px; }
.pc-nav__dir { display: inline-flex; align-items: center; gap: 6px; font: var(--t-sm); color: var(--text-2); }
.pc-nav__title { font: 600 1rem/1.35 var(--font-body); overflow-wrap: anywhere; }
@media (min-width: 768px) {
  .pc-nav__link--next { text-align: right; justify-items: end; }
  .pc-nav__link--next:only-child { grid-column: 2; }
}

/* ------------------------------------------------------------------ Kişiler
   Kurul ızgarası ve üye dizini components.css'teki .member-card'ı kullanır;
   burada yalnız yerleşim, sıralama başlıkları ve başkanlar zaman çizelgesi. */

.pc-people { --grid-gap: 12px; }
.pc-person { min-width: 0; }
.pc-person__text { min-width: 0; }
.pc-person__name { overflow-wrap: anywhere; }
/* Başkan / kurul başkanı kartı: ince vurgu (renk değil, kenar + gölge) */
.pc-person--lead { border-color: var(--border-strong); box-shadow: var(--e1); }

/* Üye dizini: araç satırı + harf dizini + harf grupları */
.pc-dir__tools {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin-bottom: 14px;
}
.pc-dir__search { flex: 1 1 260px; max-width: 420px; }
.pc-dir__count { font: var(--t-sm); color: var(--text-2); }
.pc-dir__az {
  margin-bottom: 28px;
  padding: 10px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.pc-group { scroll-margin-top: calc(var(--header-h) + 16px); }
.pc-group + .pc-group { margin-top: 32px; }
.pc-group__head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}
.pc-group__letter { font: 700 1.5rem/1 var(--font-display); }
.pc-group__count { font: var(--t-sm); color: var(--text-2); }

/* Başkanlarımız: dikey zaman çizelgesi (görevdeki en üstte).
   components.css'teki .timeline yatay program şeridi içindir, burada kullanılmaz. */
.pc-terms { list-style: none; margin: 0; padding: 0; }
.pc-term {
  position: relative;
  display: grid;
  gap: 2px;
  padding: 0 0 24px 28px;
  border-left: 2px solid var(--border);
}
.pc-term:last-child { padding-bottom: 0; border-left-color: transparent; }
.pc-term::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2.5px solid var(--g900);
  background: var(--bg-surface);
}
.pc-term--current::before { background: var(--g900); }
.pc-term__period {
  display: flex;
  align-items: center;
  gap: 10px;
  font: 600 1.375rem/1.1 var(--font-display);
  font-variant-numeric: tabular-nums;
  color: var(--text);
}
.pc-term > .member-card { margin-top: 10px; }

/* --------------------------------------------------------------- Kaynak listeleri
   Dağcılık kütüphanesi (PDF) ve Basında biz (dış haber). Aynı satır bileşeni. */
.pc-res { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.pc-res__row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 16px;
  align-items: center;
  min-height: 76px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--bg-surface);
  color: inherit;
  transition: border-color var(--d-fast), box-shadow var(--d-fast);
}
a.pc-res__row:hover { border-color: var(--border-strong); box-shadow: var(--e1); }
a.pc-res__row:hover .pc-res__title { text-decoration: underline; text-underline-offset: 3px; }
.pc-res__icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: var(--r-md);
  background: var(--bg-muted);
  font-size: 1.5rem;
  color: var(--text-2);
}
.pc-res__body { min-width: 0; }
.pc-res__title { display: block; font: 600 1.0625rem/1.35 var(--font-body); overflow-wrap: anywhere; }
.pc-res__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  margin-top: 4px;
  font: var(--t-sm);
  color: var(--text-2);
}
.pc-res__go { font-size: 1.125rem; color: var(--text-3); }
/* Dosyası yüklenmemiş kayıt: bağlantı değil, sönük satır (kırık bağlantı üretilmez) */
.pc-res__row--off { background: var(--bg-subtle); }
.pc-res__row--off .pc-res__title { color: var(--text-2); }
@media (max-width: 479.98px) {
  .pc-res__row { grid-template-columns: auto minmax(0, 1fr); }
  .pc-res__go { display: none; }
}
/* Yıl başlığı (basın arşivi) */
.pc-year {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 32px 0 12px;
  font: 600 1.25rem/1 var(--font-display);
  color: var(--text-2);
}
.pc-year:first-child { margin-top: 0; }
/* Yıl başlığı her grubun ilk öğesi olduğu için :first-child hepsinde eşleşir;
   üst boşluk sonraki gruplara burada geri verilir (basın arşivi). */
[data-yil-grup] + [data-yil-grup] .pc-year { margin-top: 32px; }
.pc-year::after { content: ""; flex: 1; height: 1px; background: var(--border); }

/* ------------------------------------------------------------- Bize katılın */
.pc-join { display: grid; gap: 28px; align-items: start; }
@media (min-width: 1024px) { .pc-join { grid-template-columns: minmax(0, 1fr) minmax(0, 456px); gap: 40px; } }
.pc-join__lead { max-width: 560px; color: var(--text-2); }
.pc-join__why { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }

.pc-form {
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  background: var(--bg-surface);
  box-shadow: var(--e1);
}
@media (min-width: 768px) { .pc-form { padding: 32px; } }
.pc-form__title { font: var(--t-h3); }
.pc-form__hint { margin-top: 6px; font: var(--t-meta); color: var(--text-2); }
.pc-form__body { display: grid; gap: 18px; margin-top: 22px; }
.pc-form__row { display: grid; gap: 18px; }
@media (min-width: 560px) { .pc-form__row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pc-form__check { align-items: flex-start; }
.pc-form__check .check { margin-top: 2px; }
.pc-form__note { font: var(--t-sm); color: var(--text-2); }
.pc-form__submit { margin-top: 2px; }
.pc-form__submit .pc-form__note { margin-top: 12px; }
/* Form başlığıyla gövde arasına giren geri bildirim (SMTP hatası, doğrulama özeti) */
.pc-form > .alert,
.pc-form > .error-summary { margin-top: 18px; }

/* --------------------------------------------------------------- İletişim */
.pc-contact { display: grid; gap: 24px; align-items: start; }
@media (min-width: 1024px) { .pc-contact { grid-template-columns: minmax(0, 392px) minmax(0, 1fr); gap: 32px; } }
/* Sosyal medya bileşeni çıplak <a> basar. components.css'teki .social koyu alt
   bilgi içindir (beyaz ikon): açık zeminde kendi kabımızı kullanıyoruz. */
.pc-social { display: flex; flex-wrap: wrap; gap: 8px; }
.pc-social a {
  display: inline-grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: var(--r-md);
  border: 1px solid var(--border);
  font-size: 1.125rem;
  color: var(--text-2);
  transition: border-color var(--d-fast), color var(--d-fast), background-color var(--d-fast);
}
.pc-social a:hover { border-color: var(--border-strong); background: var(--bg-subtle); color: var(--text); }
.pc-social:not(:has(a)) { display: none; }

.pc-links { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.pc-link {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  min-height: 68px;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: var(--r-lg);
  background: var(--bg-surface);
  color: inherit;
  transition: border-color var(--d-fast), box-shadow var(--d-fast);
}
.pc-link:hover { border-color: var(--border-strong); box-shadow: var(--e1); }
.pc-link:hover .pc-link__title { text-decoration: underline; text-underline-offset: 3px; }
.pc-link__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-md); background: var(--bg-muted); font-size: 1.125rem; color: var(--text-2); }
.pc-link__title { font: 600 1rem/1.35 var(--font-body); overflow-wrap: anywhere; }
.pc-link__text { margin-top: 2px; font: var(--t-sm); color: var(--text-2); }
.pc-link .bi-chevron-right { color: var(--text-3); }

/* --------------------------------------------------------- Mobil uygulama */
.pc-app { display: grid; gap: 28px; align-items: start; }
@media (min-width: 1024px) { .pc-app { grid-template-columns: minmax(0, 392px) minmax(0, 1fr); gap: 40px; } }
.pc-app__card {
  display: grid;
  gap: 16px;
  justify-items: start;
  padding: 24px;
  border: 1px solid var(--border);
  border-radius: var(--r-xl);
  background: var(--bg-surface);
  box-shadow: var(--e1);
}
@media (min-width: 1024px) { .pc-app__card { position: sticky; top: calc(var(--header-h) + 24px); } }
.pc-app__mark { border-radius: var(--r-lg); }
.pc-app__name { font: var(--t-h3); }
.pc-app__sub { margin-top: 4px; font: var(--t-meta); color: var(--text-2); }
.pc-app__cta { width: 100%; }
.pc-app__facts { --facts-min: 120px; width: 100%; }
.pc-app__facts .facts__value { font: 600 1.125rem/1.3 var(--font-body); white-space: normal; }
.pc-app__note { font: var(--t-sm); color: var(--text-2); }
.pc-app__note a { text-decoration: underline; text-underline-offset: 3px; }
.pc-steps { counter-reset: pc-step; display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.pc-steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; align-items: baseline; }
.pc-steps li::before {
  counter-increment: pc-step;
  content: counter(pc-step);
  font: 700 1.75rem/1 var(--font-display);
  color: var(--text-3);
}
.pc-steps strong { display: block; font: 600 1rem/1.35 var(--font-body); }
.pc-steps span { font: var(--t-meta); color: var(--text-2); }
.pc-feature { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; }
.pc-feature__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-md); background: var(--bg-muted); font-size: 1.125rem; color: var(--text-2); }
.pc-feature strong { display: block; font: 600 1rem/1.35 var(--font-body); }
.pc-feature span { font: var(--t-sm); color: var(--text-2); }

/* ------------------------------------------------------------ Hata sayfası */
.pc-error { padding: 40px 0 8px; }
.pc-error__links { display: grid; gap: 10px; max-width: 420px; margin: 28px auto 0; text-align: left; }
.pc-error__code { margin-top: 20px; font: var(--t-sm); color: var(--text-3); }
.pc-error__code code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }