/* Siluet ana sayfa B1 açılış. Sahibi WP2 (lider). Şartname: ANA-SAYFA-KURGU.md 2.1 ve 4. */
/* ---------- açılış: ad gök ile ön katman arasında; lamel perdesi; fotoğraf hep kenardan kenara (R60), tanıtım gökte ---------- */
/* bölümün kendisi izdir (ORTAK.md 4): sahne 100svh yapışık, 130vh kendi yolu, devam eden projeler eş kareyle üstüne biner (G1) */
.acilis { position: relative; height: calc(100svh + var(--devir-giris, 0px) + 130vh + var(--devir-cikis, 0px)); }
.acilis__sahne { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; background: #F5EFE8; } /* zemin: gün batımı fotoğrafının açık tonu (Kurallar 17a) */
.acilis__cerceve { position: absolute; inset: 0; overflow: hidden; background: #E9D6BE; perspective: 1600px; transform-origin: 62% 56%; }
.acilis__kamera { position: absolute; inset: 0; transform-origin: 62% 56%; }
.acilis__kat { position: absolute; inset: -2%; }
.acilis__kat img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--op, 58% 50%); }
.acilis__ad { position: absolute; left: 0; top: 0; margin: 0; font-weight: 700; font-size: var(--ad-fs, 12vw); line-height: .8; letter-spacing: -.05em; white-space: nowrap; color: var(--metin); transform: translate(var(--ad-x, 30vw), var(--ad-y, 32vh)); }
.acilis__ad-ic { display: block; }
.acilis__ad .k { display: inline-block; padding-bottom: .08em; }
.acilis__ad .k-i { display: inline-block; }
.acilis__etiket { position: absolute; z-index: 3; left: var(--kenar); bottom: 24px; margin: 0; font-size: 13px; color: var(--metin); background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(12px) saturate(160%); backdrop-filter: blur(12px) saturate(160%); padding: 6px 12px; border-radius: 999px; }
.acilis__giris { position: absolute; z-index: 4; left: var(--kenar); top: var(--alt-t, 54%); max-width: 15em; }
.acilis__alt { margin: 0; font-weight: 500; font-size: clamp(20px, 1.9vw, 28px); line-height: 1.2; letter-spacing: -.018em; color: var(--metin); }
.acilis__alt > span { display: block; }
.acilis__alt-1 { text-wrap: balance; }                         /* "bu yana." bölünmez boşlukla bağlı; dul kelime kalmaz (Kurallar 10b) */
.acilis__alt-2 { margin-top: 8px; font-weight: 400; font-size: .7em; line-height: 1.35; letter-spacing: -.01em; color: #2C2622; }
/* düğme kendi maskesinde çıkar; odak halkası için maske düğmeden geniştir */
.acilis__dugme-m { display: block; overflow: clip; margin: 14px -8px -8px; padding: 8px; }
/* binanın solundaki gök dar (900-1180 px, yatay telefon): blok menünün altına çıkar, adın solundaki sütunda ya da adın üstünde; ikinci satır gizli (betik yerleştirir) */
.acilis__giris.acilis__giris--ust { top: var(--alt-t, 76px); right: auto; max-width: var(--giris-w, 15em); }
.acilis__giris--ust .acilis__alt-2 { display: none; }
.acilis__alt, .acilis__giris .satir-m-mask, .acilis__tanitim .satir-m-mask { pointer-events: none; } /* yazı satırları ve SplitText maskeleri düğmeyi örtmesin */
/* tanıtım: gökte, sol kenarda; dikey yeri JS'te çatı profilinden (--tn-t), bloğun altı çatının üstünde biter */
.acilis__tanitim { position: absolute; z-index: 4; left: var(--kenar); top: var(--tn-t, 150px); width: min(46vw, 640px); visibility: hidden; pointer-events: none; }
.acilis__cumle { margin: 0; font-weight: 500; font-size: clamp(30px, 3.2vw, 46px); line-height: 1.06; letter-spacing: -.03em; color: var(--metin); }
.acilis__govde { margin: 20px 0 0; font-size: 17px; line-height: 1.5; color: #2C2622; max-width: 44ch; }
/* telefon G1: geri çekilen sahnenin alt kenarı sayfa zeminine erir */
.acilis__erime { position: absolute; left: 0; right: 0; bottom: 0; height: 18vh; z-index: 5; pointer-events: none; opacity: 0; background: linear-gradient(to bottom, rgba(245, 239, 232, 0), #F5EFE8 82%); }
.acilis__lamel { position: absolute; inset: 0; z-index: 9; display: none; pointer-events: none; }
/* perde ilk boyamada kapalıdır (html.js head betiğinde); açılış görselleri çözülünce açılır (en geç 0,7 sn). Betik çalışmazsa 3,5 sn sonra kendiliğinden kalkar (jüri 3: soğuk yüklemede 6 sn uzundu). */
html.js .acilis__lamel { display: flex; animation: lamel-guvenlik 0s linear 3.5s forwards; }
@keyframes lamel-guvenlik { to { visibility: hidden; } }
.acilis__lamel i { flex: 1 0 auto; margin-right: -1px; background: #F5EFE8; }
@media (max-width: 899px) { .acilis__lamel i:nth-child(n+8) { display: none; } }
@media (prefers-reduced-motion: reduce) { html.js .acilis__lamel { display: none; } }
html.js-yok .acilis__lamel, html.az-hareket .acilis__lamel { display: none; }
@media (max-width: 899px) {
  /* telefon: kadraj binanın ortasına kayar; ad ekran genişliğinde; giriş satırı göğün üstünde; tanıtım menünün altında gökte (gövde gizli) */
  .acilis { height: calc(100svh + 110vh); }
  .acilis__kat img { object-position: var(--op, 64% 50%); }
  .acilis__giris { top: 92px; right: var(--kenar); max-width: none; }
  .acilis__alt { font-size: 19px; }
  .acilis__dugme-m { margin-top: 10px; }
  .acilis__dugme { min-height: 44px; font-size: 16px; }
  .acilis__tanitim { width: auto; right: var(--kenar); }
  .acilis__cumle { font-size: 26px; }
  .acilis__govde { display: none; }
}
html.az-hareket .acilis { height: auto; }
html.az-hareket .acilis__sahne { position: relative; height: auto; overflow: visible; }
html.az-hareket .acilis__cerceve { position: relative; height: 100svh; }
html.az-hareket .acilis__tanitim { position: relative; visibility: visible; left: auto; top: auto; width: auto; padding: 72px var(--kenar); max-width: 900px; pointer-events: auto; }
html.az-hareket .acilis__govde { display: block; }
html.az-hareket .acilis__erime { display: none; }