/* =========================================================================
   Acil Sertifika Core — [asc_post] "Blog Detay" · TASARIM v2
   Kaynak: "Acil Sertifika.dc.html" 1496–1625 (`isPost`).

   Tüm kurallar .asc-app[data-page="post"] altına scope'lanır.
   Token öneki --as-* (v1 önekli token adları bu dosyadan TAMAMEN kaldırıldı).
   Buton / rozet / ikon kutusu / nokta / breadcrumb / .as-prose PAYLAŞILAN
   bileşenlerdir (asc.css) — burada yalnızca sayfaya özel yerleşim var.
   Ham hex YOK.

   v2: §2.7 "Bu Yazıyla İlgili Eğitimler" bölümü kaldırıldığı için
   `.as-post-related` kuralları da SİLİNDİ. §2.3 saat tablosu yerine
   `.as-post-tempo` (haftalık tempo) tablosu geldi.

   Bölümler: 1) Hero  2) Gövde (makale + tempo + sağ ray)  3) Responsive
   ========================================================================= */

/* -------------------------------------------------------------------------
   1) HERO — diyagonal zemin + breadcrumb + başlık + yazar + paylaşım + kapak
   ------------------------------------------------------------------------- */
.asc-app[data-page="post"] .as-post-hero {
  position: relative;
  background: var(--as-white);
  overflow: hidden;
}
.asc-app[data-page="post"] .as-post-hero__bg {
  position: absolute;
  inset: 0 0 auto 0;
  top: 0;
  height: 100%;
  background: var(--as-band);
  clip-path: polygon(0 0, 100% 0, 100% 72%, 0 92%);
  pointer-events: none;
}
.asc-app[data-page="post"] .as-post-hero__in {
  position: relative;
  padding-top: clamp(28px, 4vw, 40px);
}

.asc-app[data-page="post"] .as-post-hero__head { margin-top: 26px; max-width: 860px; }

.asc-app[data-page="post"] .as-post-hero__meta-row {
  display: flex;
  align-items: center;
  gap: 11px;
  flex-wrap: wrap;
}
.asc-app[data-page="post"] .as-post-hero__badge {
  display: inline-flex;
  align-items: center;
  padding: 7px 13px;
  border-radius: var(--as-r-pill);
  background: var(--as-white);
  box-shadow: var(--as-shadow-soft);
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--as-blue);
}
.asc-app[data-page="post"] .as-post-hero__meta-tx {
  font-size: 13.5px;
  font-weight: 600;
  color: var(--as-ink-3);
}

.asc-app[data-page="post"] .as-post-hero__title {
  margin-top: 18px;
  max-width: 860px;
  font-size: clamp(2rem, 3.4vw, 3rem);
  line-height: 1.12;
  font-weight: 800;
  letter-spacing: -.032em;
  color: var(--as-navy);
  text-wrap: balance;
}
.asc-app[data-page="post"] .as-post-hero__lead {
  margin-top: 18px;
  max-width: 720px;
  font-size: 1.1875rem;
  line-height: 1.7;
  color: var(--as-ink-2);
  text-wrap: pretty;
}

.asc-app[data-page="post"] .as-post-hero__foot {
  margin-top: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
/* Yazar kutusu yoksa (gerçek WP verisi yok) paylaşım satırı sola değil SAĞA
   yaslanmaya devam etsin diye tek çocuk hizası. */
.asc-app[data-page="post"] .as-post-hero__foot > :only-child { margin-left: auto; }

.asc-app[data-page="post"] .as-post-hero__author { display: flex; align-items: center; gap: 13px; }
.asc-app[data-page="post"] .as-post-avatar {
  width: 46px;
  height: 46px;
  flex: none;
  border-radius: var(--as-r-pill);
  background: var(--as-white);
  box-shadow: var(--as-shadow-soft);
  display: grid;
  place-items: center;
  font-size: 15px;
  font-weight: 800;
  color: var(--as-blue);
}
.asc-app[data-page="post"] .as-post-hero__author-tx { display: flex; flex-direction: column; min-width: 0; }
.asc-app[data-page="post"] .as-post-hero__author-name { font-size: 14.5px; font-weight: 800; color: var(--as-navy); }
.asc-app[data-page="post"] .as-post-hero__author-role { margin-top: 2px; font-size: 13px; font-weight: 600; color: var(--as-ink-3); }

.asc-app[data-page="post"] .as-post-share { display: flex; align-items: center; gap: 9px; }
.asc-app[data-page="post"] .as-post-share__status {
  font-size: 13px;
  font-weight: 700;
  color: var(--as-muted);
  transition: color var(--as-t-fast) var(--as-ease);
}
.asc-app[data-page="post"] .as-post-share.is-copied .as-post-share__status {
  color: var(--as-success);
  animation: as-rise-sm .24s var(--as-ease) both;
}
.asc-app[data-page="post"] .as-post-share .as-icon-btn {
  width: 40px;
  height: 40px;
  border: 0;
  background: var(--as-white);
  box-shadow: var(--as-shadow-soft);
  color: var(--as-navy-2);
  transition: box-shadow var(--as-t-mid) var(--as-ease),
              transform var(--as-t-mid) var(--as-ease),
              color var(--as-t-fast) var(--as-ease);
}
.asc-app[data-page="post"] .as-post-share .as-icon-btn:hover,
.asc-app[data-page="post"] .as-post-share .as-icon-btn:focus-visible {
  background: var(--as-white);
  box-shadow: var(--as-shadow-card);
  transform: translateY(-2px);
  color: var(--as-blue);
}
.asc-app[data-page="post"] .as-post-share .as-icon-btn svg { width: 18px; height: 18px; }

/* Kapak görseli (LCP) — aynı diyagonal zeminli bölümün içinde. */
.asc-app[data-page="post"] .as-post-cover__box {
  margin-top: 34px;
  position: relative;
  height: 420px;
  border-radius: var(--as-r-card-lg);
  overflow: hidden;
  background: var(--as-band);
  box-shadow: var(--as-shadow-card);
}
.asc-app[data-page="post"] .as-post-cover__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 55%;
  display: block;
}

/* -------------------------------------------------------------------------
   2) GÖVDE — makale + sağ ray
   ------------------------------------------------------------------------- */
/* DC 1544: `padding:56px 0 88px`. Alt boşluk standart 96 ritminden 8px DAHA AZ
   (canlıda `--as-section-y` = 96px ölçülmüştü) — makale sonu footer CTA bandına
   biraz daha yakın durur. */
.asc-app[data-page="post"] .as-post-body {
  padding-block: clamp(40px, 6vw, 56px) 88px;
}
@media (max-width: 899.98px) {
  /* Dar ekranda taban ritim küçüldüğü için (64px) oranı koru. */
  .asc-app[data-page="post"] .as-post-body { padding-bottom: 60px; }
}
.asc-app[data-page="post"] .as-post-body__wrap {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
@media (min-width: 1160px) {
  .asc-app[data-page="post"] .as-post-body__wrap { grid-template-columns: minmax(0, 1fr) minmax(0, 288px); gap: 40px; }
}

.asc-app[data-page="post"] .as-post-article {
  min-width: 0;
  background: var(--as-white);
  border: 1px solid var(--as-line-2);
  border-radius: var(--as-r-card-lg);
  box-shadow: var(--as-shadow-card);
  padding: clamp(24px, 2.6vw, 40px);
}

/* Gövde tipografisi (the_content) — .as-prose ölçeğinin üstüne pekiştirme. */
.asc-app[data-page="post"] .as-post-article .as-prose { max-width: 82ch; }

/* GİRİŞ ("lead") PARAGRAFI — DC 1548: 19px / 34.2 (1.8) / w500 / #0B2A5B.
   Canlıda 17px/29.75/w400/#334155 ölçüldü, yani kural hiç TUTMUYORDU: kuralın
   `> p:first-child` seçicisi, gövdesi bir başlıkla (çoğu içe aktarılmış yazıda
   başlığı tekrar eden H1 ile) başlayan yazılarda eşleşmiyor. `first-of-type`
   ilk paragrafı başlık öncelese de yakalar; ayrıca post.php artık başlığı
   tekrar eden gövde H1'ini kaldırıyor. */
.asc-app[data-page="post"] .as-post-article .as-prose > p:first-child,
.asc-app[data-page="post"] .as-post-article .as-prose > p:first-of-type {
  font-size: 1.1875rem;
  line-height: 1.8;
  font-weight: 500;
  color: var(--as-navy-2);
}

/* GÖVDE RİTMİ — DC 1551+: paragraf 17px/1.85 (31.45px), H2 1.2 (33.6px).
   Canlıda `.asc-app` tabanından 1.75 (29.75px) ve `.as-prose h2`den 1.15
   (32.2px) miras alınıyordu. */
/* Ölçüm notu: gövde punto'su MİRASLA geliyordu ve `.asc-app` tabanı 1rem'e
   düşürülünce (asc.css, başka bir dosya) makale metni 16px/29.6'ya iniyordu.
   Tasarım her paragrafa 1.0625rem'i AÇIKÇA yazar (DC 1551+) — biz de yazıyoruz,
   böylece taban değişse de makale ritmi kaymaz. */
.asc-app[data-page="post"] .as-post-article .as-prose p {
  font-size: 1.0625rem;
  line-height: 1.85;
}
/* Madde listesi: DC 1560+ → 1.0625rem / 1.75. */
.asc-app[data-page="post"] .as-post-article .as-prose li {
  font-size: 1.0625rem;
  line-height: 1.75;
}
.asc-app[data-page="post"] .as-post-article .as-prose h2 { line-height: 1.2; }
.asc-app[data-page="post"] .as-post-article .as-prose h2,
.asc-app[data-page="post"] .as-post-article .as-prose h3 { scroll-margin-top: 110px; }
.asc-app[data-page="post"] .as-post-article .as-prose blockquote {
  margin: 1.6em 0 0;
  padding: 26px 30px;
  border-radius: 20px;
  border-left: 4px solid var(--as-red);
  background: var(--as-tint);
  box-shadow: var(--as-shadow-soft);
  font-size: 1.125rem;
  line-height: 1.7;
  font-weight: 600;
  color: var(--as-navy);
}
.asc-app[data-page="post"] .as-post-article .as-prose blockquote p { margin: 0; }
.asc-app[data-page="post"] .as-post-article .as-prose ul { padding-left: 0; }
.asc-app[data-page="post"] .as-post-article .as-prose ul li {
  list-style: none;
  position: relative;
  padding-left: 28px;
}
.asc-app[data-page="post"] .as-post-article .as-prose ul li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: .65em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--as-blue);
}
.asc-app[data-page="post"] .as-post-article .as-prose img,
.asc-app[data-page="post"] .as-post-article .as-prose figure { border-radius: 14px; }

/* MOBİL TAŞMA (ölçüm): 390px'te makale içi tablo x=45 / w=357 ile sağ kenarı
   402px'e taşıyor, viewport 390 → sağdan kırpılıyordu ve kaydırma sarmalayıcısı
   yoktu. post.php artık her gövde tablosunu `.as-prose__scroll` kabuğuna alıyor;
   kaydırma SAYFAYA değil bu kabuğa ait olur (gövde yatay kaymaz). */
.asc-app[data-page="post"] .as-post-article .as-prose__scroll {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.asc-app[data-page="post"] .as-post-article .as-prose__scroll > table { margin-top: 0; }
.asc-app[data-page="post"] .as-post-article .as-prose__scroll:focus-visible {
  outline: 2px solid var(--as-blue-ring);
  outline-offset: 3px;
  border-radius: 18px;
}
/* Kabuk `.as-prose`nin doğrudan çocuğu olduğu için tablonun üst boşluğu ona geçer. */
.asc-app[data-page="post"] .as-post-article .as-prose > .as-prose__scroll { margin-top: 1.6em; }

/* Gövdeden gelen tablolar da tempo tablosuyla aynı kabuğu alsın. */
.asc-app[data-page="post"] .as-post-article .as-prose table {
  width: 100%;
  margin-top: 1.6em;
  border: 1px solid var(--as-line-2);
  border-radius: 18px;
  overflow: hidden;
  box-shadow: var(--as-shadow-soft);
  border-collapse: separate;
  border-spacing: 0;
}
.asc-app[data-page="post"] .as-post-article .as-prose th,
.asc-app[data-page="post"] .as-post-article .as-prose td {
  padding: 14px 18px;
  border-top: 1px solid var(--as-line-2);
  text-align: left;
}
.asc-app[data-page="post"] .as-post-article .as-prose thead th {
  border-top: 0;
  background: var(--as-tint);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--as-navy-2);
}
.asc-app[data-page="post"] .as-post-article .as-prose tbody tr:nth-child(even) td { background: var(--as-tint-2); }

/* -- TEMPO TABLOSU (v2 §2.3 — saat tablosunun yerine, DC 1565–1582) -------- */
.asc-app[data-page="post"] .as-post-tempo { margin-top: 40px; max-width: 82ch; }
.asc-app[data-page="post"] .as-post-tempo__title {
  margin: 0;
  font-size: clamp(1.4rem, 2vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.2;
  color: var(--as-navy);
}
.asc-app[data-page="post"] .as-post-tempo__lead {
  margin-top: 14px;
  font-size: 1.0625rem;
  line-height: 1.85;
  color: var(--as-ink-2);
}
.asc-app[data-page="post"] .as-post-tempo__box {
  margin-top: 26px;
  border: 1px solid var(--as-line-2);
  border-radius: 18px;
  /* Yatayda `hidden` yerine `auto`: dar ekranda uzun satır kırpılmak yerine
     kutunun İÇİNDE kayar (sayfa gövdesi yatay kaymaz). Dikeyde `hidden`
     kalması radius kırpımını korur. */
  overflow: auto hidden;
  box-shadow: var(--as-shadow-soft);
}
.asc-app[data-page="post"] .as-post-tempo__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
}
.asc-app[data-page="post"] .as-post-tempo__table thead tr { background: var(--as-tint); }
.asc-app[data-page="post"] .as-post-tempo__table thead th {
  text-align: left;
  padding: 14px 18px;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--as-navy-2);
}
.asc-app[data-page="post"] .as-post-tempo__table tbody tr { border-top: 1px solid var(--as-line-2); }
.asc-app[data-page="post"] .as-post-tempo__table tbody tr:nth-child(even) { background: var(--as-tint-2); }
.asc-app[data-page="post"] .as-post-tempo__table tbody th {
  text-align: left;
  padding: 14px 18px;
  font-weight: 700;
  color: var(--as-navy);
}
.asc-app[data-page="post"] .as-post-tempo__table tbody td {
  padding: 14px 18px;
  color: var(--as-ink-2);
}

/* -- Sağ ray -------------------------------------------------------------- */
.asc-app[data-page="post"] .as-post-aside {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
@media (min-width: 1160px) {
  .asc-app[data-page="post"] .as-post-aside { position: sticky; top: 110px; }
}

.asc-app[data-page="post"] .as-post-toc {
  padding: 24px;
  border: 1px solid var(--as-line-2);
  border-radius: var(--as-r-card);
  background: var(--as-white);
  box-shadow: var(--as-shadow-soft);
}
.asc-app[data-page="post"] .as-post-toc__list {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.asc-app[data-page="post"] .as-post-toc__link {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.5;
  color: var(--as-ink-2);
  transition: color var(--as-t-fast) var(--as-ease), transform var(--as-t-mid) var(--as-ease);
}
.asc-app[data-page="post"] .as-post-toc__link:hover,
.asc-app[data-page="post"] .as-post-toc__link:focus-visible { color: var(--as-blue); transform: translateX(3px); }
/* AA: --as-muted-2 beyaz üzerinde 2.56:1 (12px/800 → 4.5:1 gerekli).
   Aynı aileden bir ton koyu: --as-muted → 4.76:1. */
.asc-app[data-page="post"] .as-post-toc__num {
  font-size: 12px;
  font-weight: 800;
  color: var(--as-muted);
  flex: none;
  margin-top: 1px;
}

.asc-app[data-page="post"] .as-post-ctacard {
  padding: 26px;
  border-radius: var(--as-r-card);
  background: var(--as-navy);
  box-shadow: var(--as-shadow-card);
  display: flex;
  flex-direction: column;
  gap: 0;
}
.asc-app[data-page="post"] .as-post-ctacard__title {
  margin-top: 16px;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.3;
  color: var(--as-white);
}
.asc-app[data-page="post"] .as-post-ctacard__text {
  margin-top: 10px;
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--as-on-navy);
}
.asc-app[data-page="post"] .as-post-ctacard .as-btn { margin-top: 18px; }
.asc-app[data-page="post"] .as-post-ctacard .as-btn--ghost { margin-top: 9px; }

.asc-app[data-page="post"] .as-post-others {
  padding: 24px;
  border: 1px solid var(--as-line-2);
  border-radius: var(--as-r-card);
  background: var(--as-white);
  box-shadow: var(--as-shadow-soft);
}
.asc-app[data-page="post"] .as-post-others__list {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.asc-app[data-page="post"] .as-post-others__item {
  display: flex;
  gap: 13px;
  align-items: center;
  padding: 10px;
  border-radius: 14px;
  color: var(--as-navy);
  transition: background-color var(--as-t-fast) var(--as-ease);
}
.asc-app[data-page="post"] .as-post-others__item:hover,
.asc-app[data-page="post"] .as-post-others__item:focus-visible { background: var(--as-tint); }
.asc-app[data-page="post"] .as-post-others__thumb {
  width: 56px;
  height: 48px;
  flex: none;
  border-radius: 11px;
  background: linear-gradient(150deg, var(--as-tint-3), var(--as-tint-4));
}
.asc-app[data-page="post"] .as-post-others__body { min-width: 0; }
.asc-app[data-page="post"] .as-post-others__cat {
  display: block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--as-blue);
}
.asc-app[data-page="post"] .as-post-others__title {
  display: block;
  margin-top: 4px;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  color: var(--as-navy);
}

/* -------------------------------------------------------------------------
   3) RESPONSIVE
   ------------------------------------------------------------------------- */
@media (max-width: 899.98px) {
  .asc-app[data-page="post"] .as-post-cover__box { height: 320px; }
}
@media (max-width: 559.98px) {
  .asc-app[data-page="post"] .as-post-cover__box { height: 240px; }
  .asc-app[data-page="post"] .as-post-hero__foot { align-items: flex-start; }
  .asc-app[data-page="post"] .as-post-tempo__table { font-size: 14px; }
  .asc-app[data-page="post"] .as-post-tempo__table thead th,
  .asc-app[data-page="post"] .as-post-tempo__table tbody th,
  .asc-app[data-page="post"] .as-post-tempo__table tbody td { padding: 12px 14px; }
}