/* =====================================================================
 * home.css — ANA SAYFA BÖLÜMLERİ (YENİ TASARIM)
 * ---------------------------------------------------------------------
 * 11 bölümün editoryal kompozisyonu. Slider'ın kendi CSS'i slider.css
 * içinde duruyor; burada sadece sayfa-içi bölümler var.
 *
 * İçerik haritası:
 *   1.  Hero (manifesto)        — 5/7 split, 76px başlık
 *   2.  Hakkımda (alıntı)       — 4/8 alıntı manifest
 *   3.  Seçilmiş Çalışmalar     — küratöryel 12-col asimetrik
 *   4.  Sanat Vitrin            — eser + şiir
 *   5.  Yayınlar                — editoryal yıl-gruplu liste (yıl tekrarı yok)
 *   6.  Sergiler & Faaliyetler  — kronolojik manifesto
 *   7.  Ödüller                 — manifesto başlık + tablo
 *   8.  Büyük Manifesto         — 56px tek cümle
 *   9.  Blog                    — sessiz liste
 *  10.  CTA                     — minimal
 *  11.  Tutarlı placeholder (.be-ph)
 *
 * Bölüm ritimleri farklıdır — py-24 mekaniği kırılmıştır.
 * py-12 → py-13 → py-9 → py-12 → py-9 → py-12 gibi değişir.
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 0. BÖLÜM PAYLAŞILAN
 * --------------------------------------------------------------------- */

/* Tutarlı placeholder (görsel yokken): 8 köşeli yıldız + iç içe daireler.
 * Tüm bölümlerde aynı görsel dil. */
.be-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--canvas-deep);
  color: var(--gold);
  opacity: 0.55;
  width: 100%;
  height: 100%;
}
.be-ph svg { width: 38%; height: 38%; }
.be-ph--gold   { background: var(--canvas-deep); color: var(--gold); }
.be-ph--earth  { background: var(--earth); color: var(--gold-soft); opacity: 1; }
.be-ph--sage   { background: var(--sage); color: var(--ink-inverse); opacity: 1; }

/* Section head: sol başlık + sağ link butonu */
.be-section-head {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
  margin-bottom: var(--space-9);
  align-items: end;
}
@media (min-width: 64em) {
  .be-section-head { grid-template-columns: 1fr auto; gap: var(--space-7); margin-bottom: var(--space-10); }
}
.be-section-head__eyebrow { margin-bottom: var(--space-3); }
.be-section-head__title {
  font-size: clamp(1.75rem, 2.4vw + 0.75rem, 2.5rem);
  line-height: var(--lh-heading);
  letter-spacing: var(--tracking-snug);
  max-width: 28ch;
}
.be-section-head__intro {
  margin-top: var(--space-3);
  color: var(--ink-secondary);
  max-width: 56ch;
  font-size: var(--fs-md);
}

/* Eyebrow: aynı token, ortak kullanım */
.be-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  font-family: var(--font-sans);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--ink-tertiary);
}
.be-eyebrow::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 1px;
  background: var(--gold);
}

/* ---------------------------------------------------------------------
 * 1. HERO — Manifesto
 * Tam görünüm yüksekliği değil; ritimli "intro" hissi. 5/7 split.
 * --------------------------------------------------------------------- */
.be-hero {
  position: relative;
  padding-block: var(--space-12) var(--space-11);
  background: var(--canvas);
  overflow: hidden;
}

.be-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-9);
  align-items: end;
}
@media (min-width: 64em) {
  .be-hero__grid { grid-template-columns: 5fr 7fr; gap: var(--space-11); }
}

.be-hero__eyebrow {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  font-family: var(--font-sans);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--ink-tertiary);
  margin-bottom: var(--space-6);
}
.be-hero__eyebrow::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--gold);
  display: inline-block;
}

.be-hero__title {
  font-family: var(--font-serif);
  font-weight: var(--fw-regular);
  font-size: clamp(2.75rem, 5.5vw + 0.5rem, 4.75rem);
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: var(--ink);
  text-wrap: balance;
  margin-bottom: var(--space-6);
}
.be-hero__title em { font-style: italic; color: var(--earth); }
.be-hero__title .accent { font-style: italic; color: var(--gold); }

.be-hero__lede {
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  color: var(--ink-secondary);
  max-width: 52ch;
  margin-bottom: var(--space-7);
}

.be-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-7);
}

.be-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3) var(--space-5);
  margin-top: var(--space-7);
  padding-top: var(--space-5);
  border-top: 1px solid var(--line);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}

.be-hero__media { position: relative; margin: 0; }
.be-hero__media .be-frame {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--canvas-alt);
  border: 1px solid var(--line-soft);
}
.be-hero__media .be-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1.02);
  transition: transform var(--dur-slow) var(--ease-out-soft);
}
.be-hero__media:hover .be-frame img { transform: scale(1.04); }
.be-hero__media figcaption {
  margin-top: var(--space-3);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  font-family: var(--font-mono);
  letter-spacing: var(--tracking-wide);
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
}

/* Hafif motif: sadece hero'da, %4 opaklıkta 8 köşeli yıldız */
.be-hero__motif {
  position: absolute;
  top: var(--space-7);
  right: var(--space-7);
  width: 140px;
  height: 140px;
  opacity: 0.045;
  color: var(--gold);
  pointer-events: none;
  z-index: 0;
}
.be-hero__motif svg { width: 100%; height: 100%; }
@media (min-width: 64em) {
  .be-hero__motif { width: 220px; height: 220px; top: var(--space-9); right: var(--space-9); }
}

/* ---------------------------------------------------------------------
 * 2. HAKKIMDA — Alıntı manifest
 * 4/8 split. Sol kısa biyografi + CTA, sağ büyük italik alıntı.
 * --------------------------------------------------------------------- */
.be-about-preview__frame {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--radius-lg);
  background: var(--canvas-alt);
  border: 1px solid var(--line-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-tertiary);
}
.be-about-preview__frame img { width: 100%; height: 100%; object-fit: cover; display: block; }

.be-about-preview__body { display: flex; flex-direction: column; gap: var(--space-5); }
.be-about-preview__title {
  font-size: clamp(1.75rem, 2.4vw + 0.75rem, 2.5rem);
  line-height: var(--lh-heading);
  letter-spacing: var(--tracking-snug);
  margin-top: var(--space-3);
}
.be-about-preview__text {
  color: var(--ink-secondary);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  max-width: 56ch;
}
.be-about-preview__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--space-5);
  padding-top: var(--space-4);
  border-top: 1px solid var(--line-soft);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}
.be-about-preview__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-3);
}

/* Alıntı manifest: italik serif, büyük */
.be-about-quote {
  font-family: var(--font-serif);
  font-style: italic;
  font-size: clamp(1.625rem, 2.2vw + 0.6rem, 2.5rem);
  line-height: 1.2;
  letter-spacing: var(--tracking-snug);
  color: var(--ink);
  text-wrap: balance;
  margin: 0;
}
.be-about-quote::before {
  content: "\201C";
  display: block;
  font-size: 3em;
  line-height: 0.8;
  color: var(--gold);
  margin-bottom: var(--space-3);
}
.be-about-quote__attr {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-5);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  color: var(--ink-tertiary);
  text-transform: uppercase;
}
.be-about-quote__attr::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--gold);
}

/* ---------------------------------------------------------------------
 * 3. SEÇİLMİŞ ÇALIŞMALAR — Küratöryel 12-col asimetrik
 * 1 büyük hero (col 8, row 2) + 2 küçük yan yana (col 4) + 2 geniş (col 6).
 * Ürün kartı havası YOK. Müze vitrini gibi.
 * --------------------------------------------------------------------- */
.be-featured {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
}
@media (min-width: 48em) {
  .be-featured {
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 180px;
    gap: var(--space-5);
  }
}

.be-featured__item {
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--canvas-alt);
  border: 1px solid var(--line-soft);
  display: block;
  color: var(--ink);
  aspect-ratio: 4 / 3;
}
@media (min-width: 48em) {
  .be-featured__item { aspect-ratio: auto; }
  .be-featured__item--hero { grid-column: span 8; grid-row: span 2; }
  .be-featured__item--a    { grid-column: span 4; grid-row: span 1; }
  .be-featured__item--b    { grid-column: span 4; grid-row: span 1; }
  .be-featured__item--c    { grid-column: span 6; grid-row: span 1; }
  .be-featured__item--d    { grid-column: span 6; grid-row: span 1; }
}

.be-featured__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out-soft), filter var(--dur-slow) var(--ease-out-soft);
}
.be-featured__item:hover img { transform: scale(1.04); filter: brightness(0.96); }

.be-featured__caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: var(--space-5);
  background: linear-gradient(to top, rgba(20, 20, 19, 0.78), rgba(20, 20, 19, 0));
  color: var(--ink-inverse);
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity var(--dur-base) var(--ease-standard), transform var(--dur-base) var(--ease-out-soft);
}
.be-featured__item:hover .be-featured__caption,
.be-featured__item:focus-visible .be-featured__caption {
  opacity: 1;
  transform: translateY(0);
}
.be-featured__caption__title {
  font-family: var(--font-serif);
  font-size: var(--fs-lg);
  line-height: var(--lh-tight);
}
.be-featured__caption__meta {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  color: var(--gold-soft);
  margin-top: 4px;
}

/* Boş state — bölümün gizli olduğu durumda kullanılmaz (bölüm gizlenir) */

/* ---------------------------------------------------------------------
 * 4. SANAT VİTRİN — Eser + Şiir
 * 7/5 split, 4:3 görsel, derin taş zemini.
 * --------------------------------------------------------------------- */
.be-vitrine {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-7);
  align-items: center;
}
@media (min-width: 64em) {
  .be-vitrine { grid-template-columns: 7fr 5fr; }
}
.be-vitrine__media {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--canvas-alt);
  border: 1px solid var(--line-soft);
}
.be-vitrine__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out-soft);
}
.be-vitrine__media:hover img { transform: scale(1.03); }
.be-vitrine__text h2 {
  font-size: var(--fs-2xl);
  margin-top: var(--space-3);
  margin-bottom: var(--space-5);
}
.be-vitrine__text h2 em { font-style: italic; color: var(--earth); }
.be-vitrine__text p {
  color: var(--ink-secondary);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  margin-bottom: var(--space-5);
}

/* ---------------------------------------------------------------------
 * 5. YAYINLAR — Editoryal liste (yıl gruplu)
 * Yıl sadece grup başlığında. Tekrar yok.
 * --------------------------------------------------------------------- */
.be-pubs {
  display: flex;
  flex-direction: column;
  gap: var(--space-11);
}

.be-year-group__year {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-4);
  padding-bottom: var(--space-3);
  margin-bottom: var(--space-5);
  border-bottom: 1px solid var(--line);
}
.be-year-group__year__num {
  font-family: var(--font-serif);
  font-size: var(--fs-3xl);
  color: var(--gold);
  font-weight: var(--fw-regular);
  letter-spacing: var(--tracking-tight);
}
.be-year-group__year__count {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}

.be-pub {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  padding: var(--space-5) 0;
  border-top: 1px solid var(--line-soft);
  align-items: baseline;
}
@media (min-width: 48em) {
  .be-pub { grid-template-columns: 90px 1fr 180px; gap: var(--space-7); }
}
.be-pub:last-child { border-bottom: 1px solid var(--line-soft); }

.be-pub__type {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  color: var(--ink-tertiary);
  text-transform: uppercase;
}
.be-pub__title {
  font-family: var(--font-serif);
  font-size: var(--fs-md);
  line-height: var(--lh-tight);
  color: var(--ink);
  display: inline-block;
  margin-bottom: var(--space-2);
  transition: color var(--dur-fast) var(--ease-standard);
}
.be-pub__title:hover { color: var(--gold); }
.be-pub__authors {
  font-size: var(--fs-sm);
  color: var(--ink-secondary);
  margin-bottom: var(--space-2);
}
.be-pub__venue {
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
}
.be-pub__side {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: baseline;
  justify-content: flex-start;
}
@media (min-width: 48em) {
  .be-pub__side { justify-content: flex-end; }
}
.be-pub__doi {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}
.be-pub__doi a:hover { color: var(--gold); }

/* ---------------------------------------------------------------------
 * 6. SERGİLER & FAALİYETLER — Kronolojik manifesto
 * Kart YOK. Düz liste: tarih · başlık · yer. Kart havası silindi.
 * --------------------------------------------------------------------- */
.be-exhibitions-list {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
}
.be-exhibition {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  padding: var(--space-6) 0;
  border-top: 1px solid var(--line-soft);
}
@media (min-width: 48em) {
  .be-exhibition { grid-template-columns: 110px 1fr 220px; gap: var(--space-7); align-items: baseline; }
}
.be-exhibition:last-child { border-bottom: 1px solid var(--line-soft); }

.be-exhibition__date {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}
.be-exhibition__title {
  font-family: var(--font-serif);
  font-size: var(--fs-lg);
  line-height: var(--lh-tight);
  color: var(--ink);
  margin: 0;
}
.be-exhibition__title a { transition: color var(--dur-fast) var(--ease-standard); }
.be-exhibition__title a:hover { color: var(--gold); }
.be-exhibition__type {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  margin-top: var(--space-2);
}
.be-exhibition__place {
  font-size: var(--fs-sm);
  color: var(--ink-secondary);
  margin-top: var(--space-2);
}
.be-exhibition__place span + span::before {
  content: " · ";
  color: var(--line-strong);
  margin: 0 4px;
}

/* Eski kart stilleri (eski .be-exhibitions__list ve .be-exhibition__media
 * geriye dönük uyumluluk için korunuyor — artık kullanılmıyor ama
 * archive-sanat-eseri / archive-sergi şablonları referans alabilir). */
.be-exhibitions__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-5); }
.be-exhibition__media {
  position: relative;
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: var(--radius-md);
  background: var(--canvas-alt);
  border: 1px solid var(--line-soft);
}
.be-exhibition__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out-soft); }
.be-exhibition__media:hover img { transform: scale(1.04); }

/* ---------------------------------------------------------------------
 * 7. ÖDÜLLER — Manifesto başlık + 4 sütunlu tablo
 * Yıl · Ödül · Veren Kurum · Kategori. Satırlar hover'da hafifçe tonlanır.
 * --------------------------------------------------------------------- */
.be-awards-head {
  margin-bottom: var(--space-9);
  max-width: 60ch;
}
.be-awards-head h2 {
  font-size: clamp(1.875rem, 2.4vw + 0.75rem, 2.5rem);
  margin-top: var(--space-3);
}

.be-awards-table {
  width: 100%;
  border-collapse: collapse;
}
.be-awards-table th {
  font-family: var(--font-sans);
  font-size: var(--fs-micro);
  font-weight: var(--fw-medium);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--ink-tertiary);
  text-align: left;
  padding: var(--space-3) var(--space-3) var(--space-3) 0;
  border-bottom: 1px solid var(--line);
}
.be-awards-table td {
  padding: var(--space-5) var(--space-3) var(--space-5) 0;
  border-bottom: 1px solid var(--line-soft);
  vertical-align: top;
  transition: background-color var(--dur-fast) var(--ease-standard);
}
.be-awards-table tbody tr:hover td { background: var(--canvas-alt); }
.be-awards-table td:nth-child(1) {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--gold);
  width: 80px;
}
.be-awards-table td:nth-child(2) {
  font-family: var(--font-serif);
  font-size: var(--fs-md);
  line-height: var(--lh-tight);
}
.be-awards-table td:nth-child(3) {
  font-size: var(--fs-sm);
  color: var(--ink-secondary);
}
.be-awards-table td:nth-child(4) {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
  text-align: right;
}
@media (max-width: 48em) {
  /* Mobilde tablo → liste görünümü */
  .be-awards-table thead { display: none; }
  .be-awards-table,
  .be-awards-table tbody,
  .be-awards-table tr,
  .be-awards-table td { display: block; width: 100%; }
  .be-awards-table tr { padding: var(--space-5) 0; border-top: 1px solid var(--line-soft); }
  .be-awards-table tr:first-child { border-top: 0; }
  .be-awards-table td { padding: var(--space-1) 0; border-bottom: 0; }
  .be-awards-table td:nth-child(1) { width: auto; color: var(--gold); margin-bottom: var(--space-2); }
  .be-awards-table td:nth-child(4) { text-align: left; margin-top: var(--space-2); }
}

/* Eski award-card stilleri (eski tasarımdan kalma; geriye dönük uyumluluk) */
.be-awards__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
}
@media (min-width: 48em) {
  .be-awards__grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-5); }
  .be-awards__grid .is-featured { grid-column: span 2; }
}
.be-award-card {
  position: relative;
  display: grid;
  grid-template-columns: 90px 1fr;
  gap: var(--space-5);
  padding: var(--space-5);
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  color: var(--ink);
  text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-standard);
}
.be-award-card:hover { border-color: var(--line); }
.be-award-card__media {
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: var(--radius-sm);
  background: var(--canvas-alt);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ink-tertiary);
}
.be-award-card__media img { width: 100%; height: 100%; object-fit: cover; }
.be-award-card__body { display: flex; flex-direction: column; gap: var(--space-2); }
.be-award-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}
.be-award-card__title { font-family: var(--font-serif); font-size: var(--fs-md); line-height: var(--lh-tight); }
.be-award-card__issuer { font-size: var(--fs-sm); color: var(--ink-secondary); }

/* ---------------------------------------------------------------------
 * 8. BÜYÜK MANIFESTO — Tek cümle, 56px
 * --------------------------------------------------------------------- */
.be-manifesto {
  padding-block: var(--space-13);
  max-width: var(--w-wide);
  margin-inline: auto;
}
.be-manifesto__text {
  font-family: var(--font-serif);
  font-size: clamp(1.875rem, 3.2vw + 0.75rem, 3.5rem);
  line-height: 1.16;
  letter-spacing: var(--tracking-snug);
  color: var(--ink);
  text-wrap: balance;
}
.be-manifesto__text em { font-style: italic; color: var(--earth); }
.be-manifesto__attr {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  margin-top: var(--space-7);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  color: var(--ink-tertiary);
  text-transform: uppercase;
}
.be-manifesto__attr::before {
  content: "";
  width: 32px;
  height: 1px;
  background: var(--gold);
}

/* ---------------------------------------------------------------------
 * 9. BLOG — Sessiz liste
 * Tarih · Başlık · Kategori. Görsel yok (sessiz).
 * --------------------------------------------------------------------- */
.be-blog-list {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
}
.be-blog-item {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-2);
  padding: var(--space-5) 0;
  border-top: 1px solid var(--line-soft);
}
@media (min-width: 48em) {
  .be-blog-item { grid-template-columns: 140px 1fr 140px; gap: var(--space-7); align-items: baseline; }
}
.be-blog-item:last-child { border-bottom: 1px solid var(--line-soft); }
.be-blog-item__date {
  font-family: var(--font-mono);
  font-size: var(--fs-sm);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}
.be-blog-item__title {
  font-family: var(--font-serif);
  font-size: var(--fs-lg);
  line-height: var(--lh-tight);
  color: var(--ink);
  margin: 0;
}
.be-blog-item__title a { transition: color var(--dur-fast) var(--ease-standard); }
.be-blog-item__title a:hover { color: var(--gold); }
.be-blog-item__cat {
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  text-align: left;
}
@media (min-width: 48em) {
  .be-blog-item__cat { text-align: right; }
}

/* Eski post-card stilleri (geriye dönük uyumluluk — archive vb. şablonlarda) */
.be-blog__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-7);
}
@media (min-width: 48em) {
  .be-blog__grid { grid-template-columns: repeat(3, 1fr); gap: var(--space-7); }
}
.be-post-card {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-md);
  overflow: hidden;
  color: var(--ink);
  text-decoration: none;
  transition: border-color var(--dur-fast) var(--ease-standard);
}
.be-post-card:hover { border-color: var(--line); }
.be-post-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: var(--canvas-alt);
}
.be-post-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out-soft); }
.be-post-card:hover .be-post-card__media img { transform: scale(1.04); }
.be-post-card__body { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-5); }
.be-post-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  font-family: var(--font-mono);
  font-size: var(--fs-xs);
  color: var(--ink-tertiary);
  letter-spacing: var(--tracking-wide);
}
.be-post-card__title { font-family: var(--font-serif); font-size: var(--fs-lg); line-height: var(--lh-tight); }
.be-post-card__title a { transition: color var(--dur-fast) var(--ease-standard); }
.be-post-card__title a:hover { color: var(--gold); }
.be-post-card__excerpt { font-size: var(--fs-sm); color: var(--ink-secondary); }
.be-post-card__more {
  margin-top: auto;
  font-family: var(--font-sans);
  font-size: var(--fs-sm);
  color: var(--ink);
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
}
.be-post-card__more::after {
  content: "→";
  display: inline-block;
  transition: transform var(--dur-fast) var(--ease-out-soft);
}
.be-post-card:hover .be-post-card__more::after { transform: translateX(3px); }

/* ---------------------------------------------------------------------
 * 10. CTA — Minimal
 * Tek satır başlık + eposta butonu + ghost link.
 * --------------------------------------------------------------------- */
.be-cta {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-7);
  align-items: end;
  padding-block: var(--space-11);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
@media (min-width: 64em) {
  .be-cta { grid-template-columns: 1.6fr 1fr; gap: var(--space-11); padding-block: var(--space-13); }
}
.be-cta h2 {
  font-family: var(--font-serif);
  font-size: clamp(1.875rem, 2.6vw + 0.75rem, 3rem);
  line-height: var(--lh-heading);
  letter-spacing: -0.01em;
  color: var(--ink);
  text-wrap: balance;
  margin-top: var(--space-3);
  margin-bottom: var(--space-5);
  max-width: 24ch;
}
.be-cta p {
  color: var(--ink-secondary);
  font-size: var(--fs-md);
  line-height: var(--lh-body);
  max-width: 52ch;
}
.be-cta__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: var(--space-3);
}
@media (min-width: 64em) {
  .be-cta__actions { justify-content: flex-end; }
}

/* ---------------------------------------------------------------------
 * 11. PAYLAŞILAN YARDIMCILAR — be-empty, be-stagger, be-reveal
 * --------------------------------------------------------------------- */
.be-empty {
  padding: var(--space-9) var(--space-5);
  text-align: center;
  color: var(--ink-tertiary);
  font-size: var(--fs-sm);
  font-family: var(--font-sans);
}
.be-empty h3 {
  font-size: var(--fs-md);
  color: var(--ink-secondary);
  margin-bottom: var(--space-2);
}

/* Scroll reveal — JavaScript ile .is-in sınıfı eklenecek */
.be-reveal {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--dur-medium) var(--ease-out-soft),
    transform var(--dur-medium) var(--ease-out-soft);
}
.be-reveal.is-in {
  opacity: 1;
  transform: translateY(0);
}
.be-reveal--d1 { transition-delay: var(--stagger); }
.be-reveal--d2 { transition-delay: calc(var(--stagger) * 2); }
.be-reveal--d3 { transition-delay: calc(var(--stagger) * 3); }

@media (prefers-reduced-motion: reduce) {
  .be-reveal { opacity: 1; transform: none; transition: none; }
}

/* Staggered children (slider'daki gruplar, vitrin itemları vb.) */
.be-stagger > * {
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity var(--dur-medium) var(--ease-out-soft),
    transform var(--dur-medium) var(--ease-out-soft);
}
.be-stagger.is-in > *:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 0ms; }
.be-stagger.is-in > *:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 60ms; }
.be-stagger.is-in > *:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 120ms; }
.be-stagger.is-in > *:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 180ms; }
.be-stagger.is-in > *:nth-child(5) { opacity: 1; transform: translateY(0); transition-delay: 240ms; }
.be-stagger.is-in > *:nth-child(6) { opacity: 1; transform: translateY(0); transition-delay: 300ms; }

@media (prefers-reduced-motion: reduce) {
  .be-stagger > * { opacity: 1; transform: none; transition: none; }
}

/* ---------------------------------------------------------------------
 * 12. RESPONSIVE — sadece ana sayfa bölümleri
 * Mevcut responsive.css'i tamamlar; çakışma olmaz çünkü
 * sınıf adları farklı (be-section--* / be-hero / be-vitrine / ...).
 * --------------------------------------------------------------------- */
@media (max-width: 48em) {
  .be-hero { padding-block: var(--space-9) var(--space-8); }
  .be-hero__motif { width: 110px; height: 110px; top: var(--space-5); right: var(--space-5); }
  .be-featured { gap: var(--space-4); }
  .be-pubs { gap: var(--space-9); }
  .be-pub { padding: var(--space-4) 0; }
  .be-exhibition { padding: var(--space-5) 0; }
  .be-blog-item { padding: var(--space-4) 0; }
}