/* EDİTORYAL SAYFALAR — Hakkımızda · Kampanya · Destek (marka-tema F10) */

/* ============================================================
   1 · EDİTORYAL HERO
   ============================================================ */
.mk-ed-hero {
  position: relative; display: flex; align-items: flex-end;
  min-height: 62svh; overflow: hidden;
  background: var(--mk-stone);   /* yüklenene kadar sıcak zemin */
}
.mk-ed-hero--tam { min-height: 78svh; }
.mk-ed-hero-medya { position: absolute; inset: 0; }
.mk-ed-hero-img { width: 100%; height: 100%; object-fit: cover; display: block; object-position: 50% 32%; }
/* Okunabilirlik koruması yalnız metnin olduğu alt bölgede ve hafif. */
.mk-ed-hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 55%;
  background: linear-gradient(to top, rgba(20,18,15,.42), rgba(20,18,15,0));
  pointer-events: none;
}
.mk-ed-hero-icerik {
  position: relative; z-index: 1; width: 100%;
  max-width: var(--mk-icerik); margin: 0 auto;
  padding: 0 var(--mk-kenar) clamp(34px, 5vw, 66px);
  color: var(--mk-beyaz);
}
.mk-ed-ust {
  display: block; margin-bottom: 12px;
  font-size: 10.5px; font-weight: var(--mk-fw-islevsel); letter-spacing: .18em; text-transform: uppercase;
  color: rgba(255,255,255,.82);
}
.mk-ed-h1 {
  margin: 0; font-family: var(--mk-font);
  font-size: clamp(28px, 4.2vw, 54px); font-weight: 500;
  line-height: 1.08; letter-spacing: -.015em; max-width: 16ch;
}

/* Görselsiz varyant — sessiz başlık bloğu, boş görsel alanı yok. */
.mk-ed-baslik-blok {
  max-width: var(--mk-icerik); margin: 0 auto;
  padding: clamp(48px, 7vw, 100px) var(--mk-kenar) clamp(18px, 3vw, 34px);
}
.mk-ed-baslik-blok .mk-ed-ust { color: var(--mk-gri-acik); }
.mk-ed-baslik-blok .mk-ed-h1 { color: var(--mk-siyah); }

/* ============================================================ 2 · EDİTORYAL GÖVDE — Gutenberg içeriği Blok edit */
.mk-ed-govde { padding: var(--mk-bolum-editoryal) 0; }
.mk-ed-govde > * {
  max-width: 62ch; margin-left: auto; margin-right: auto;
  padding-left: var(--mk-kenar); padding-right: var(--mk-kenar);
  box-sizing: content-box;
}
.mk-ed-govde p {
  font-size: clamp(15px, 1.15vw, 17px); line-height: 1.85; color: #2c2924;
  margin: 0 0 1.5em;
}
.mk-ed-govde h2 {
  font-family: var(--mk-font);
  font-size: clamp(19px, 2vw, 26px); font-weight: 500; letter-spacing: -.005em;
  margin: clamp(40px, 5vw, 72px) 0 .7em; text-transform: none;
}
.mk-ed-govde h3 {
  font-size: clamp(15px, 1.3vw, 18px); font-weight: 500;
  margin: clamp(26px, 3vw, 40px) 0 .6em; text-transform: none;
}
/* Blok görselleri metin kolonundan taşarak editoryal ritim kurar. */
.mk-ed-govde .wp-block-image {
  max-width: var(--mk-icerik); padding: 0 var(--mk-kenar);
  margin: clamp(44px, 6vw, 88px) auto;
}
.mk-ed-govde .wp-block-image img {
  width: 100%; height: auto; display: block; background: var(--mk-stone);
}
.mk-ed-govde .wp-block-image figcaption {
  margin-top: 10px; font-size: 12.5px; color: var(--mk-gri); text-align: left;
}
/* Tam genişlik blok — bilinçli editoryal kesinti. */
.mk-ed-govde .alignfull {
  max-width: none; width: 100%; padding: 0;
  margin: clamp(52px, 7vw, 110px) 0;
}
.mk-ed-govde .alignwide { max-width: var(--mk-icerik); padding: 0 var(--mk-kenar); }
.mk-ed-govde blockquote {
  border: 0; padding: 0; margin: clamp(40px, 5vw, 76px) auto;
  font-size: clamp(18px, 2vw, 25px); line-height: 1.45; letter-spacing: -.01em;
}
.mk-ed-govde blockquote p { font-size: inherit; line-height: inherit; }
.mk-ed-govde a { border-bottom: 1px solid var(--mk-cizgi-form); }
.mk-ed-govde a:hover { border-bottom-color: var(--mk-siyah); }

/* Ticarete dönüş — her paragrafa CTA konmaz, sayfa sonunda tek çıkış. */
.mk-ed-cta {
  max-width: var(--mk-icerik); margin: 0 auto;
  padding: 0 var(--mk-kenar) var(--mk-bolum-editoryal); text-align: center;
}

/* Kampanya gövdesi: metin biraz daha geniş, görsel daha baskın. */
.mk-ed-govde--kampanya > * { max-width: 58ch; }
.mk-ed-urun { padding-top: 0; }

/* ============================================================ 3 · DESTEK — tipografi öncelikli, */
.mk-destek-govde { padding: clamp(28px, 4vw, 56px) 0 var(--mk-bolum-editoryal); }
.mk-destek-govde .mk-kap { max-width: 760px; }
.mk-destek-govde h1 {
  font-family: var(--mk-font);
  font-size: clamp(24px, 3vw, 34px); font-weight: 500;
  letter-spacing: -.01em; text-transform: none; margin: 0 0 .6em;
}
.mk-destek-govde .mk-kap p {
  font-size: 15px; line-height: 1.8; color: var(--mk-gri); margin: 0 0 1.4em; max-width: 58ch;
}

.mk-destek {
  max-width: 760px; margin: clamp(20px, 3vw, 40px) auto 0;
  padding: 0 var(--mk-kenar);
}
.mk-destek-grup { border-top: 1px solid var(--mk-cizgi); padding: clamp(22px, 3vw, 34px) 0; }
.mk-destek-grup:last-child { border-bottom: 1px solid var(--mk-cizgi); }
.mk-destek-baslik {
  font-size: 10.5px; font-weight: var(--mk-fw-islevsel); letter-spacing: .16em; text-transform: uppercase;
  color: var(--mk-gri-acik); margin: 0 0 14px;
}
.mk-destek-liste { list-style: none; margin: 0; padding: 0; }
.mk-destek-liste li { margin: 0; }
.mk-destek-liste a {
  display: flex; align-items: center; min-height: 48px;
  font-size: clamp(15px, 1.3vw, 17px); line-height: 1.4;
  border-bottom: 1px solid transparent;
}
.mk-destek-liste a:hover, .mk-destek-liste a:focus-visible { border-bottom-color: var(--mk-siyah); }

.mk-iletisim-kanal {
  max-width: 760px; margin: clamp(30px, 4vw, 52px) auto 0;
  padding: 0 var(--mk-kenar);
}
.mk-iletisim-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 28px; }
.mk-iletisim-liste a {
  display: inline-flex; align-items: center; min-height: 48px;
  font-size: 15px; border-bottom: 1px solid var(--mk-cizgi-form);
}
.mk-iletisim-liste a:hover { border-bottom-color: var(--mk-siyah); }
.mk-iletisim-saat { margin: 8px 0 0; font-size: 13px; color: var(--mk-gri); }

/* ============================================================ MOBİL — editoryal hiyerarşi korunur, te */
@media (max-width: 900px) {
  .mk-ed-hero { min-height: 56svh; }
  .mk-ed-hero--tam { min-height: 66svh; }
  .mk-ed-h1 { font-size: clamp(26px, 7.5vw, 38px); max-width: 15ch; }
  .mk-ed-govde > * { max-width: none; }
  .mk-ed-govde p { font-size: 15.5px; line-height: 1.8; }
  /* Görsel mobilde kenardan kenara — editoryal karakter korunur. */
  .mk-ed-govde .wp-block-image { padding: 0; margin: clamp(30px, 8vw, 52px) 0; }
  .mk-ed-govde .wp-block-image figcaption { padding: 0 var(--mk-kenar); }
  .mk-destek-liste a { min-height: 52px; }   /* mobilde daha rahat hedef */
}

@media (prefers-reduced-motion: reduce) {
  .mk-destek-liste a, .mk-ed-govde a { transition: none; }
}

/* ═══ MARKA MANİFESTOSU (r6.22a) ═══ ⚠️ Kart/gölge/arka plan YOK — sayfanın fildişi zemininde sak */
.mk-b-manifesto { padding: var(--mk-ritim-bolum) 0; background: transparent; border: 0; }
/* ⚠️ Okuma genişliği 55–65ch; yatay konum `.mk-kap`tan gelir. */
.mk-manifesto-ic { max-width: 62ch; margin: 0 auto; text-align: center; }
.mk-manifesto-eyebrow { margin: 0 0 14px; }
.mk-manifesto-baslik {
  /* Bölüm başlığı — sayfadaki tek H1 hero'da kalır. */
  font-size: var(--mk-fs-h2); font-weight: var(--mk-fw-baslik);
  line-height: var(--mk-lh-baslik); letter-spacing: var(--mk-ls-baslik-buyuk);
  text-transform: none; margin: 0 0 18px;
}
.mk-manifesto-metin {
  font-size: var(--mk-fs-ikincil); line-height: var(--mk-lh-aciklama);
  color: var(--mk-gri); margin: 0;
}
.mk-manifesto-cta { display: inline-block; margin-top: 26px; }
@media (min-width: 901px) {
  /* Kontrollü asimetri: metin bloğu optik olarak hafif sola yaslanır ama
     satır uzunluğu sabit kalır. */
  /* ⚠️ Sol eksen ortaklaştırıldı: `.mk-kap` başlangıcı. */
  .mk-manifesto-ic { text-align: left; margin-left: 0; margin-right: auto; }
}

/* ═══ LOOKBOOK ŞERİDİ (r6.22b) ═══ ⚠️ Native yatay overflow + scroll-snap. Slider/carousel kütüphanesi YOK. ⚠️ ` */
.mk-b-lookbook { padding: var(--mk-ritim-serit) 0; }
.mk-lb-baslik {
  font-size: var(--mk-fs-h2); font-weight: var(--mk-fw-baslik);
  line-height: var(--mk-lh-baslik); letter-spacing: var(--mk-ls-baslik-buyuk);
  text-transform: none; margin: 0 0 10px;
}
.mk-lb-metin {
  font-size: var(--mk-fs-ikincil); line-height: var(--mk-lh-ikincil);
  color: var(--mk-gri); margin: 0 0 28px; max-width: 52ch;
}
.mk-lb-serit {
  list-style: none; margin: 0; padding: 0 var(--mk-kenar);
  /* ⚠️ r6.22c1 — RİTİM. Canlıda 360px kart + 22px gap ile beşinci karttan
     yalnız ~8px görünüyordu; kaydırılabilirlik algılanmıyordu. */
  /* ⚠️ r6.22d — Aralık 27,6px'ten düşürüldü: şerit daha bağlantılı. */
  display: flex; gap: clamp(10px, 1vw, 16px);
  overflow-x: auto; overflow-y: hidden;
  /* ⚠️ r6.22c — SNAP YALNIZ KULLANICI KAYDIRMASINDA. Otomatik akış 0,26px/kare ilerliyor; snap her kared */
  scroll-snap-type: x proximity;
  touch-action: pan-x pan-y;
  scrollbar-width: none;
}
@media (max-width: 900px) { .mk-lb-serit { gap: 11px; } }
.mk-lb-serit::-webkit-scrollbar { display: none; }
/* ⚠️ Sınıfı JS ekler/kaldırır. JS düşerse sınıf hiç eklenmez ve şerit native
   snap'li kaydırılabilir liste olarak kalır. */
.mk-lb-serit.mk-lb-oto { scroll-snap-type: none; }
.mk-lb-oge { flex: 0 0 auto; scroll-snap-align: start; width: 70vw; max-width: 300px; }
/* ⚠️ r6.22c1 — Değerler HESAPLA seçildi, kopyalanmadı. 22vw/330px ile 1536px'te beşinci karttan yalnız ~25p */
@media (min-width: 901px) { .mk-lb-oge { width: clamp(250px, 20.6vw, 318px); max-width: none; } }
/* ⚠️ r6.22d — TEK ORAN. Tüm medya çerçeveleri 2/3: kartlar aynı üst ve alt hizada, ürün adları aynı ba */
.mk-lb-medya { aspect-ratio: 2 / 3; }
.mk-lb-bag { display: block; color: inherit; }
.mk-lb-medya { display: block; overflow: hidden; background: var(--mk-fon); }
.mk-lb-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mk-lb-ad {
  display: block; margin-top: 12px;
  font-size: var(--mk-fs-kart-ad); line-height: var(--mk-lh-kart-ad);
  color: var(--mk-siyah);
}
.mk-lb-bag:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
/* ⚠️ Hareket azaltmada otomatik akış TAMAMEN kapanır; şerit normal
   kaydırılabilir statik liste olarak kalır. */
@media (prefers-reduced-motion: reduce) {
  .mk-lb-serit { scroll-behavior: auto; }
}

/* ═══ ÜÇÜNCÜ KATEGORİ — editoryal asimetri ═══
   ⚠️ Üç EŞİT kart değil: bir baskın + iki tamamlayıcı. Mobilde tek kolon. */
/* ⚠️ r6.28 — ESKİ MASAÜSTÜ ASİMETRİ BLOĞU KALDIRILDI (1.55fr/1fr, iki satır
   yayılan büyük kart, 1.45/1 ızgara oranı, medyanın `aspect-ratio: auto`ya
   çekilmesi). Kök neden buydu: hero.css'teki oranları bu blok eziyordu.
   Asimetri artık tek yerde: `hero.css`, 1.22fr / 1fr / 1fr. */
.mk-hizmet-baslik { margin: 0 0 14px; }

/* ═══ MARKA HİKÂYESİ (r6.23) ═══
   ⚠️ Kart/gölge/yuvarlak köşe/gradyan YOK — bildirilmez bile.
   ⚠️ Ritim r6.22e jetonundan; yeni sihirli boşluk yok. */
.mk-bolum.mk-b-hikaye { padding: var(--mk-ritim-bolum) 0; }
.mk-hikaye-izgara { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 36px); }
.mk-hikaye-medya { display: block; overflow: hidden; background: var(--mk-fon); }
/* ⚠️ Oran ÖNCEDEN ayrılır → görsel yüklenince CLS yok. Sabit px yükseklik yok. */
.mk-hikaye-medya, .mk-hikaye-medya picture { aspect-ratio: 4 / 5; display: block; }
.mk-hikaye-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mk-hikaye-eyebrow { margin: 0 0 12px; }
.mk-hikaye-baslik {
  /* Manifestodan biraz güçlü, hero ile yarışmaz. Jetonlardan türetilir. */
  font-size: clamp(24px, 2.4vw, 34px);
  font-weight: var(--mk-fw-baslik); line-height: var(--mk-lh-baslik);
  letter-spacing: var(--mk-ls-baslik-buyuk); text-transform: none;
  margin: 0 0 16px;
}
.mk-hikaye-metin {
  font-size: var(--mk-fs-govde); line-height: var(--mk-lh-aciklama);
  color: var(--mk-gri); margin: 0; max-width: 46ch;
}
.mk-hikaye-cta { display: inline-block; margin-top: 26px; min-height: 44px; }
.mk-hikaye-cta:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
@media (min-width: 901px) {
  /* ⚠️ Asimetri: görsel %60, metin %40; aradaki boşluk clamp ile 48–88px. */
  .mk-hikaye-izgara {
    flex-direction: row; align-items: center;
    gap: clamp(48px, 5vw, 88px);
  }
  .mk-hikaye-medya { flex: 0 0 60%; }
  .mk-hikaye-icerik { flex: 1 1 40%; }
  /* ⚠️ Görsel sağa YALNIZ sunumda alınır; DOM sırası değişmez. */
  .mk-b-hikaye--sag .mk-hikaye-medya { order: 2; }
  .mk-b-hikaye--sag .mk-hikaye-icerik { order: 1; }
}

/* ═══ KAMPANYA GERİ SAYIMI (r6.25) ═══
   ⚠️ Yanıp sönme, titreme, kırmızı aciliyet rengi YOK — sakin bilgi. */
.mk-kampanya-sayac { display: block; margin: 0 0 22px; }
.mk-sayac-etiket {
  display: block; margin-bottom: 6px;
  font-size: var(--mk-fs-form-etiket); font-weight: var(--mk-fw-islevsel);
  letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.82);
}
.mk-sayac-deger {
  display: block; font-size: clamp(20px, 2.4vw, 28px); font-weight: 400;
  font-variant-numeric: tabular-nums; letter-spacing: .04em;
}

/* ═══ KAMPANYA ÜST ETİKETİ (r6.25a) ═══
   Tipografi merkezi `.mk-eyebrow` rolünden gelir; burada yalnız ritim. */
.mk-kampanya-eyebrow { margin: 0 0 10px; }
