/* SLM ve SLA sayfaları — lfam.css (lf-) ve mjf.css (mj-) üzerine yalnızca slm.html ve sla.html'de yüklenen ekler (önek: ms-).
   Yükleme sırası: style.css · detay.css · lfam.css · mjf.css · slm-sla.css · iso-hucre.css · giris-ulas.css.
   İki sayfa da MJF sayfasının akışını izler; burada yalnız görsel yer tutucuları, koyu bölümdeki kart ızgarası
   ve malzeme kutuları durur. Fotoğraflar gelince .ms-yer kutuları MJF'deki <img> kalıbıyla değiştirilir. */

/* ---------- Görsel yer tutucu: kesik çizgili pafta kutusu, mono etiket ---------- */
.ms-yer { display: grid; place-items: center; text-align: center; padding: 16px; color: var(--ikincil);
  background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(30, 111, 208, 0.045) 14px 15px), linear-gradient(180deg, #F6F8FA, #DAE0E6);
  outline: 1px dashed var(--cizgi-guclu); outline-offset: -8px; }
.ms-yer span { font-family: var(--yazi-mono); font-size: 12.5px; line-height: 1.5; letter-spacing: 0.02em; text-transform: uppercase; max-width: 30ch; }
.ms-yer span b { display: block; font-weight: 500; color: var(--murekkep); margin-bottom: 4px; }

/* Kapaktaki yer tutucu: fotoğrafın kaplayacağı alan (mj-sayfa kuralı sağ %62'yi ayırır), koyu zeminde */
.ms-sayfa .lf-kapak-foto.ms-yer { background: repeating-linear-gradient(135deg, transparent 0 18px, rgba(255, 255, 255, 0.035) 18px 19px), linear-gradient(135deg, #16263F, #0C1521); outline-color: rgba(255, 255, 255, 0.22); color: rgba(255, 255, 255, 0.7); object-fit: unset; }
.ms-sayfa .lf-kapak-foto.ms-yer span b { color: var(--beyaz); }
.ms-sayfa .lf-kapak-foto.ms-yer { padding-left: 26%; }
@media (max-width: 1099px) { .ms-sayfa .lf-kapak-foto.ms-yer { padding-left: 16px; } .ms-sayfa .lf-kapak-foto.ms-yer span { display: none; } }

/* Uygulama kartlarındaki yer tutucu: 16:9 */
.lf-uyg-foto.ms-yer { aspect-ratio: 16 / 9; }

/* ---------- Koyu bölüm: üç ya da altı kart (SLM'de tasarım aşamaları, SLA'da reçine aileleri) ---------- */
.ms-kartlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px clamp(20px, 3vw, 40px); }
.ms-kartlar li { min-width: 0; padding: 20px 22px 22px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 10px; background: rgba(255, 255, 255, 0.04); display: grid; align-content: start; gap: 8px; }
.ms-kartlar .ms-ust { margin: 0; font-family: var(--yazi-mono); font-size: 12.5px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--vurgu-acik); }
.ms-kartlar h3 { margin: 0; font-family: var(--yazi-baslik); font-size: 27px; font-weight: 600; line-height: 1.1; color: var(--beyaz); }
.ms-kartlar p:last-child { margin: 0; font-size: 15px; line-height: 1.6; color: var(--giris-yazi); }
.ms-kartlar .ms-kullanim { margin: 4px 0 0; font-size: 13.5px; line-height: 1.5; color: rgba(255, 255, 255, 0.62); }
.ms-kartlar .ms-kullanim strong { font-weight: 600; color: rgba(255, 255, 255, 0.85); }

/* ---------- Malzeme bölümü: iki eşit kutu ---------- */
.ms-sayfa .lf-ikili.ms-esit { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ms-alasim .md-ana-liste div { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); }
.ms-alasim dd small, .ms-teknik dd small { display: block; font-size: 13px; color: var(--soluk); margin-top: 2px; }

/* ---------- Dar ekranlar ---------- */
@media (max-width: 1099px) { .ms-sayfa .lf-ikili.ms-esit { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 899px) { .ms-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 599px) { .ms-kartlar { grid-template-columns: minmax(0, 1fr); } }

/* Kapak fotoğrafı (9 Kasım, sürüm 189): parça fotoğrafı koyu lacivert zeminde, parça sağda, sol yarı boş.
   Masaüstünde kapağın sağ %68'ini kaplar, sol kenarı lacivert zemine erir (MJF kapağı gibi); metin parçanın üstüne binmez.
   Dar ekranda tam genişlik, parça sağda, üstünde koyu perde. */
.ms-sayfa .lf-kapak-foto { left: 32%; width: 68%; object-position: 100% 50%; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28%); mask-image: linear-gradient(90deg, transparent 0, #000 28%); }
.ms-sayfa .lf-kapak { background: #04101E; }
@media (max-width: 1099px) {
  .ms-sayfa .lf-kapak-foto { left: 0; width: 100%; object-position: 78% 50%; -webkit-mask-image: none; mask-image: none; }
  .ms-sayfa .lf-kapak-perde { background: rgba(4, 16, 30, 0.78); }
}
/* SLA kapağı: şeffaf gövde daha geniş; başlıkla çakışmasın diye fotoğraf biraz daha sağda başlar */
@media (min-width: 1100px) { .ms-sayfa[data-tek="sla"] .lf-kapak-foto { left: 38%; width: 62%; } }
/* Kısa başlık ve metinle kapak alçalmasın: masaüstünde en az 480 px, metin dikeyde ortalı; parça fotoğrafı tam görünür */
@media (min-width: 1100px) { .ms-sayfa .lf-kapak-ic { min-height: 480px; align-content: center; } }
