/* =====================================================================
   ASR VİNÇ — içerik bloklarının ek stilleri
   Tasarım (style.css) değiştirilmez; burada yalnız:
   - yüklenen görsellerin tasarımdaki kutuları doldurması,
   - genel amaçlı blokların (video, harita, boşluk, blog yazısı, sayfalama) eksik stilleri,
   - editör önizlemesindeki boş görsel yer tutucusu.
   ===================================================================== */

/* ---- görseller kutularını doldursun (kutu boyutu tasarımdaki gibi kalır) */
.ptMedia > img, .lpHeroBg > img, .secBg > img, .approachBg > img, .svcBg > img, .ctaBg > img,
.lpHeroBg > video, .heroImage > video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block;
}
.svcBg { overflow: hidden; }
.svcBg > img, .secBg > img { opacity: .35; }
.projectImg > img, .lpProjImg > img, .lpSubImg > img, .fleetImage > img, .articleImg > img,
.lp-img > img, .refTile > img, .lpVideo > img, .detailMedia > img, .mediaPlaceholder > img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.lpVideo > video, .detailMedia > video { width: 100%; height: 100%; object-fit: cover; display: block; background: var(--f-111111); }
/* Yedek parça kartı: ürün fotoğrafı kırpılmaz (contain), açık nötr zeminde bütünüyle görünür. */
.shopImg:has(> img) { background: var(--a-f3f3f1); }
.shopImg > img { width: 100%; height: 100%; max-width: none; object-fit: contain; object-position: center; display: block;
  padding: 8px; box-sizing: border-box; }
/* Metin + görsel: görsel alanı 4:3 kutudur; dikey ya da panoramik fotoğraf bloğu uzatmaz, kutuyu doldurur. */
.mgMedia { position: relative; aspect-ratio: 4 / 3; overflow: hidden; }
.mgMedia > img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block; }
/* Sabit yükseklikli tasarım kutuları (proje şeridi 110 px, referans mozaiği, kategori genel bakış):
   görsel kutuyu büyütmez, kutuyu tam doldurur (cover); kartın yazısı görselin altında kalır. */
.lp-img, .refTile, .lpVideo { position: relative; overflow: hidden; }
.lp-img > img, .refTile > img, .lpVideo > img, .lpVideo > video {
  position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; display: block;
}
.lpVideo:has(img) .lpPlay, .lpVideo:has(video) .lpPlay { display: none; }
.sectorPanel { position: relative; overflow: hidden; }
.sectorPanel > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .5; }
.sectorPanel > .panelIn { position: relative; z-index: 1; }
.refLogo img { max-width: 80%; max-height: 44px; width: auto; height: auto; object-fit: contain; }

/* ---- blok gizleme (Blocks::render: mobilde / masaüstünde gizle) */
@media (max-width: 900px) { .gizleMobil { display: none !important; } }
@media (min-width: 901px) { .gizleMasaustu { display: none !important; } }

/* ---- editör önizlemesi: boş görsel yer tutucusu (canlı sitede basılmaz) */
.onizlemePh { display: grid; place-items: center; text-align: center; width: 100%; height: 100%; min-height: 80px;
  color: var(--f-8a8f90); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.onizlemePh small { display: block; margin-top: 4px; letter-spacing: .04em; text-transform: none; opacity: .8; }
.blokGizli { opacity: .45; }

/* ---- sayfalama bağlantıları (tasarımdaki .pager button görünümü) */
.pager a { width: 29px; height: 29px; border: 1px solid var(--cizgi); background: var(--kart); font-size: 12px;
  display: inline-grid; place-items: center; color: inherit; text-decoration: none; }
.pager a.active { background: var(--d-111111); color: var(--dugmeUstu); border-color: var(--d-111111); }
.blogFilters a.blogFilter { text-decoration: none; color: inherit; }
.blogFilters a.blogFilter.active { color: var(--dugmeUstu); }
.article h3 a { color: inherit; text-decoration: none; }
.blogBos { color: var(--a-6d7573); font-size: 13px; }

/* ---- blog yazısı */
.yaziGovde { margin: 0 auto; }
.yaziMeta { font-size: 12px; letter-spacing: .08em; color: var(--a-6d7573); text-transform: uppercase; margin: 0 0 22px; }
.yaziGovde .prose h2 { font-size: 22px; letter-spacing: -.03em; margin: 26px 0 10px; }
.yaziGovde .prose img { max-width: 100%; height: auto; }
.yaziGeri { margin-top: 30px; }
.pageTop .kicker a { color: inherit; text-decoration: none; }

/* ---- video */
.videoBlok { max-width: 980px; margin: 0 auto; }
.videoBlok.genis { max-width: none; }
.videoKutu { position: relative; aspect-ratio: 16 / 9; background: var(--f-151a19); overflow: hidden; }
.videoKutu > video, .videoKutu iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.videoCephe { position: absolute; inset: 0; display: grid; place-items: center; color: var(--fotoMetin); }
.videoCephe > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .7; }
.videoCepheBtn { position: relative; z-index: 1; width: 72px; height: 72px; border-radius: 50%; border: 1px solid rgb(var(--fotoMetinRgb) / .7);
  background: rgb(var(--fotoMetinRgb) / .1); display: grid; place-items: center; cursor: pointer; }
.videoCepheBtn .play { border: 0; width: auto; height: auto; }
.videoCepheBtn .play:after { border-left-color: var(--fotoMetin); border-left-width: 14px; border-top-width: 9px; border-bottom-width: 9px; }
.videoCepheBtn:hover, .videoCepheBtn:focus-visible { background: var(--vurgu); border-color: var(--vurgu); }
.videoCepheNot { position: absolute; z-index: 1; left: 0; right: 0; bottom: 14px; margin: 0; text-align: center; font-size: 11px; opacity: .8; }

/* ---- harita */
.haritaCephe { position: relative; background: var(--a-eef0ee); display: grid; place-items: center; align-content: center; gap: 14px;
  text-align: center; padding: 24px; min-height: 440px; }
.haritaCephe.h-kisa { min-height: 320px; }
.haritaCephe.h-uzun { min-height: 560px; }
.haritaCephe p { margin: 0; font-size: 12px; color: var(--metin2); max-width: 46ch; }
.haritaCephe .haritaLink { font-size: 12px; color: inherit; }
.haritaCephe iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.haritaNot { font-size: 13px; color: var(--a-8a8f90); }

/* ---- boşluk / ayırıcı */
.araBosluk { padding: 0 clamp(16px, 4vw, 64px); }
.araBosluk.ab-kucuk { height: 24px; }
.araBosluk.ab-orta { height: 56px; }
.araBosluk.ab-buyuk { height: 112px; }
.araBosluk { display: flex; align-items: center; }
.araBosluk hr { flex: 1; border: 0; border-top: 1px solid var(--cizgi); margin: 0; }