/* NOVETA — sinematik giriş (scroll-scrub kare dizisi) — canlı site sürümü.
   Laboratuvardan (hero-morph-lab.html) taşındı.
   Eski intro perdesi ve eski hero sahnesi bu dosyayla devre dışı bırakılır. */

:root { --nv-ease-out: cubic-bezier(.23,1,.32,1); }

/* --- Eski girişi kapat --- */
.noveta-intro-overlay { display: none !important; }

/* 26.07.2026 — kapatma kaldırıldı.
   Buradaki `.nv-site / .nv-capture / .nv-wa / .nv-skip-link` kapatmaları, giriş
   inşa edilirken geçiciydi ("sitenin içi ayrı kurulacak"). Ama canlıda kalınca
   sayfa yalnızca girişten ibaret oluyordu: giriş bittikten sonra hiçbir şey
   gelmiyor, mobilde kaydırma boşluğa çıkıyordu. Bölümlerin stilleri
   sections.css / capture.css'te hazır olduğu için kapatma silindi.

   `.noveta-main-hero` KAPALI kalıyor: sinematik giriş onun yerini aldı,
   açılırsa iki hero üst üste biner. Nav, `.nv-site` içindeki #nvHeader'dan gelir. */
.noveta-main-hero { display: none !important; }  /* eski hero — yerini giriş aldı */

/* --- Yeni giriş --- */
.nvi-hero {
  position: relative;
  height: 100svh;
  overflow: hidden;
  /* Poster zemin: ilk kare yuklenene kadar siyah ekran gorunmesin */
  background: #0B0B0F url("hero-poster.webp") center/cover no-repeat;
}

#nviCanvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }

/* Okunabilirlik perdesi — dağılma fazında kareler metnin üstüne taşıyor */
.nvi-scrim {
  position: absolute; inset: 0; z-index: 15; pointer-events: none;
  background: linear-gradient(100deg,
    rgba(11,11,15,.94) 0%,
    rgba(11,11,15,.82) 20%,
    rgba(11,11,15,.34) 36%,
    rgba(11,11,15,0) 48%);
}

.nvi-copy {
  position: absolute; left: clamp(20px,5vw,64px); top: 50%;
  transform: translateY(-50%); z-index: 20;
  width: min(660px,46vw); max-height: 76svh;
}

.nvi-phase {
  position: absolute; top: 0; left: 0; opacity: 0; transform: translateY(14px);
  /* Cikan metin HIZLI soner (.18s), giren yavas belirir (.42s) — ikisi ayni anda
     okunur halde ust uste binmesin. */
  transition: opacity .18s var(--nv-ease-out), transform .18s var(--nv-ease-out);
  pointer-events: none;
}
.nvi-phase.is-on {
  opacity: 1; transform: translateY(0);
  transition: opacity .42s var(--nv-ease-out) .06s, transform .42s var(--nv-ease-out) .06s;
}

.nvi-tag {
  display: inline-block; font-family: 'Space Grotesk', sans-serif;
  font-size: 10px; letter-spacing: .2em; color: #0B0B0F; background: #EDEBE3;
  padding: 5px 9px; margin-bottom: 14px;
}

.nvi-phase h1 {
  font-family: 'Space Grotesk', sans-serif; font-weight: 700;
  font-size: clamp(30px,4.2vw,56px); line-height: 1.02; letter-spacing: -.03em;
  margin: 0 0 12px; color: #EDEBE3; text-wrap: balance;
}
.nvi-phase h1 em,
.nvi-phase h1 .nvi-em { font-style: normal; color: #FF5A2C; }

/* Maskeli kelime yapısı — motion.css'teki `.m-word` deseninin bu sayfaya taşınmış hâli.
   Kelime maskesi taşmayı keser, içteki span aşağıdan yukarı sürülür. */
.nvi-phase h1 .m-word { display: inline-block; overflow: hidden; vertical-align: top; }
.nvi-phase h1 .m-word > span { display: inline-block; will-change: transform; }

@media (prefers-reduced-motion: reduce) {
  .nvi-phase h1 .m-word > span { transform: none !important; }
}

.nvi-phase p {
  font-family: 'Manrope', sans-serif; font-size: clamp(14px,1.5vw,16px);
  line-height: 1.6; color: #8B8A97; margin: 0; max-width: 44ch;
}

/* --- Sağ kenar rayı: hizmetler + projelere çıkış ---
   Referanstaki editoryal mikro-etiket rayının bizim içeriğimizle karşılığı.
   Merkezdeki morph ile yarışmaz: küçük punto, sönük renk, tek vurgu köz linkte. */
.nvi-rail {
  position: absolute; top: 50%; right: clamp(20px, 3vw, 40px);
  transform: translateY(-50%); z-index: 20;
  display: grid; gap: 26px; text-align: right; max-width: 210px;
}

.nvi-rail-group { display: grid; gap: 6px; }

.nvi-rail-label {
  font-family: 'Space Grotesk', sans-serif; font-size: 9.5px; letter-spacing: .2em;
  color: #8B8A97; text-transform: uppercase;
}

.nvi-rail-list {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 3px;
}
.nvi-rail-list li {
  font-family: 'Manrope', sans-serif; font-size: 12.5px; line-height: 1.35; color: #EDEBE3;
}

.nvi-rail-value {
  font-family: 'Manrope', sans-serif; font-size: 12.5px; color: #EDEBE3;
}

.nvi-rail-note {
  font-family: 'Manrope', sans-serif; font-size: 11px; color: #8B8A97;
}

/* Tek eylem çağrısı — rayda köz rengini yalnızca bu taşır */
.nvi-rail-cta {
  display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px;
  font-family: 'Space Grotesk', sans-serif; font-weight: 600; font-size: 13px;
  letter-spacing: .01em; color: #FF5A2C; text-decoration: none;
  padding: 4px 0; border-bottom: 1px solid rgba(255,90,44,.35);
  transition: color .18s var(--nv-ease-out), border-color .18s var(--nv-ease-out),
              transform .18s var(--nv-ease-out);
}
.nvi-rail-cta span { transition: transform .18s var(--nv-ease-out); }
.nvi-rail-cta:hover { color: #EDEBE3; border-color: rgba(237,235,227,.5); }
.nvi-rail-cta:hover span { transform: translate(2px,-2px); }
.nvi-rail-cta:active { transform: scale(.98); }
.nvi-rail-cta:focus-visible { outline: 2px solid #FF5A2C; outline-offset: 3px; }

.nvi-scrollcue {
  position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); z-index: 20;
  font-family: 'Space Grotesk', sans-serif; font-size: 10px; letter-spacing: .22em;
  color: #8B8A97; pointer-events: none;
}

@media (max-width: 768px) {
  .nvi-copy { width: min(92vw, 560px); }
  .nvi-rail {
    top: 22px; right: 16px; transform: none; max-width: none;
    gap: 0; justify-items: end;
  }
  .nvi-rail-group:not(:nth-child(2)) { display: none; }  /* mobilde yalnızca projelere çıkış */
  .nvi-rail-label, .nvi-rail-note { display: none; }
  /* Perde eskiden yüzün tam üstünde (%45) .72 karartma yapıyordu; görüntü
     soluklaşıyor, kare kalitesindeki kazanç görünmez oluyordu.
     Artık üst yarı neredeyse açık, karartma yalnızca metnin oturduğu
     alt üçte birde toplanıyor — okunabilirlik korunur, yüz canlı kalır. */
  .nvi-scrim {
    background: linear-gradient(180deg,
      rgba(11,11,15,.12) 0%,
      rgba(11,11,15,.06) 38%,
      rgba(11,11,15,.40) 60%,
      rgba(11,11,15,.86) 80%,
      rgba(11,11,15,.96) 100%);
  }
  .nvi-copy { top: auto; bottom: 14svh; transform: none; }

  /* .nvi-phase mutlak konumlu ve `top:0` idi. .nvi-copy'nin tüm çocukları
     mutlak olduğu için yüksekliği 0; metin alt çapadan AŞAĞI doğru büyüyüp
     ekranın dışına taşıyor, başlığın son satırı kesiliyordu.
     Mobilde alttan hizala — metin yukarı doğru büyüsün. */
  .nvi-phase { top: auto; bottom: 0; }

  /* Kaydırma ipucu başlığın üstüne biniyordu */
  .nvi-scrollcue { bottom: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .nvi-phase { transition: none; }
}
