/* ============================================================
   FLY — Autonomy Without Limits  (Novix Air alt sayfası)
   ============================================================ */
:root{
  --fly-bg:#070809;
  --fly-panel:#0c0e12;
  --fly-line:rgba(255,255,255,0.10);
  --fly-muted:rgba(255,255,255,0.62);
  --fly-muted2:rgba(255,255,255,0.40);
}
.fly{background:var(--fly-bg);color:#fff;font-family:'Montserrat',sans-serif;overflow-x:hidden;}
.fly *{box-sizing:border-box;}
.fly img{display:block;}

/* ---------- HERO ---------- */
.fly-hero{
  position:relative;
  min-height:100vh;
  padding:clamp(90px,12vh,140px) clamp(20px,5vw,80px) clamp(30px,5vh,60px);
  display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;
}
.fly-hero::before{ /* arka plan görsel (drone sahnesi) */
  content:"";position:absolute;inset:0;z-index:0;
  background:url('posters/thor.jpg') center right/cover no-repeat;
  opacity:0.9;
}
.fly-hero::after{ /* okunabilirlik için koyu degrade */
  content:"";position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(90deg, rgba(7,8,9,0.96) 0%, rgba(7,8,9,0.75) 38%, rgba(7,8,9,0.25) 70%, rgba(7,8,9,0.55) 100%),
    linear-gradient(to top, rgba(7,8,9,0.95) 0%, transparent 40%);
}
.fly-hero-inner{position:relative;z-index:2;width:100%;max-width:1360px;margin:0 auto;}
.fly-title{
  font-weight:800;font-size:clamp(96px,20vw,300px);line-height:0.8;
  letter-spacing:-0.04em;margin:0 0 clamp(24px,4vh,48px);
  text-shadow:0 8px 60px rgba(0,0,0,0.5);
}
.fly-lead{max-width:430px;}
.fly-eyebrow{
  font-weight:300;font-size:clamp(20px,2.4vw,30px);letter-spacing:0.32em;
  text-transform:uppercase;line-height:1.5;margin:0 0 22px;
}
.fly-rule{width:54px;height:1px;background:rgba(255,255,255,0.5);margin:0 0 22px;}
.fly-desc{color:var(--fly-muted);font-weight:300;font-size:clamp(14px,1.1vw,16px);line-height:1.75;margin:0 0 34px;max-width:360px;}
.fly-cta{
  display:inline-flex;align-items:center;gap:16px;color:#fff;text-decoration:none;
  font-size:12px;letter-spacing:0.24em;text-transform:uppercase;font-weight:500;
}
.fly-cta .ln{width:60px;height:1px;background:#fff;transition:width .3s ease;}
.fly-cta:hover .ln{width:90px;}

/* sağ kenar sayfalama + scroll ipucu */
.fly-pager{
  position:absolute;right:clamp(16px,2.5vw,40px);top:50%;transform:translateY(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:14px;
  font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--fly-muted2);letter-spacing:0.1em;
}
.fly-pager .pg-line{width:1px;height:90px;background:linear-gradient(to bottom,transparent,rgba(255,255,255,0.4),transparent);}
.fly-pager .on{color:#fff;}
.fly-scroll{
  position:absolute;right:clamp(20px,5vw,80px);bottom:clamp(26px,5vh,46px);z-index:3;
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.28em;text-transform:uppercase;color:var(--fly-muted2);
}

/* ---------- 3 KART ---------- */
.fly-cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--fly-line);border-top:1px solid var(--fly-line);border-bottom:1px solid var(--fly-line);
}
.fly-card{
  position:relative;background:var(--fly-panel);padding:clamp(28px,3vw,46px);
  min-height:clamp(300px,34vw,420px);display:flex;flex-direction:column;justify-content:space-between;
  overflow:hidden;text-decoration:none;color:#fff;
}
.fly-card::before{
  content:"";position:absolute;inset:0;z-index:0;opacity:0.5;
  background-size:cover;background-position:center;transition:transform .8s cubic-bezier(.2,1,.3,1),opacity .6s;
}
.fly-card.c1::before{background-image:url('kart1.jpg');background-position:center;}
.fly-card.c2::before{background-image:url('kart2.jpg');background-position:center;}
.fly-card.c3::before{background-image:url('kart3.jpg');background-position:center;}
.fly-card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(120deg,rgba(8,9,12,0.92) 0%,rgba(8,9,12,0.55) 60%,rgba(8,9,12,0.3) 100%);}
.fly-card:hover::before{transform:scale(1.06);opacity:0.7;}
.fly-card>*{position:relative;z-index:2;}
.fly-card .c-num{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--fly-muted2);letter-spacing:0.14em;}
.fly-card .c-head{
  font-weight:300;font-size:clamp(20px,2vw,28px);letter-spacing:0.16em;text-transform:uppercase;
  line-height:1.25;margin:14px 0 0;
}
.fly-card .c-mid{flex:1;}
.fly-card .c-desc{color:var(--fly-muted);font-weight:300;font-size:13.5px;line-height:1.7;margin:18px 0 0;max-width:300px;}
.fly-card .c-go{
  display:inline-flex;align-items:center;gap:14px;margin-top:26px;
  font-size:11px;letter-spacing:0.24em;text-transform:uppercase;color:rgba(255,255,255,0.85);
}
.fly-card .c-go .ln{width:46px;height:1px;background:rgba(255,255,255,0.7);transition:width .3s;}
.fly-card:hover .c-go .ln{width:70px;}

/* ---------- İSTATİSTİK BAR ---------- */
.fly-stats{display:grid;grid-template-columns:repeat(6,1fr);}
.fly-stat{
  display:flex;align-items:center;gap:16px;
  padding:clamp(22px,2.4vw,32px) clamp(16px,1.8vw,28px);
  border-right:1px solid var(--fly-line);
}
.fly-stat:last-child{border-right:none;}
.fly-stat svg{flex:none;width:30px;height:30px;stroke:rgba(255,255,255,0.78);}
.fly-stat .st-t{font-size:13px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;line-height:1.35;}
.fly-stat .st-s{display:block;font-weight:300;color:var(--fly-muted2);font-size:12px;letter-spacing:0.06em;}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
  .fly-cards{grid-template-columns:1fr;}
  .fly-stats{grid-template-columns:repeat(3,1fr);}
  .fly-stat:nth-child(3n){border-right:none;}
  .fly-stat{border-bottom:1px solid var(--fly-line);}
}
@media (max-width:767px){
  .fly-hero{min-height:90vh;padding-top:120px;}
  .fly-hero::before{background-position:center;}
  .fly-hero::after{background:linear-gradient(to top,rgba(7,8,9,0.96) 0%,rgba(7,8,9,0.55) 55%,rgba(7,8,9,0.4) 100%);}
  .fly-title{font-size:clamp(84px,32vw,150px);}
  .fly-lead{max-width:100%;}
  .fly-pager{display:none;}
  .fly-scroll{left:50%;right:auto;transform:translateX(-50%);}
  .fly-stats{grid-template-columns:repeat(2,1fr);}
  .fly-stat:nth-child(3n){border-right:1px solid var(--fly-line);}
  .fly-stat:nth-child(2n){border-right:none;}
}

/* ============ FLY HERO: siyah stüdyo arka plan + nav çizgisi fix ============ */
/* Nav'ın üstteki yarı saydam gradient'i kaldır → menü altındaki düz çizgi gider */
.fly nav.nav:not(.scrolled){
  background:transparent !important;
  border-bottom-color:transparent !important;
}
/* Arka planı siyaha çek (2. referans: black studio) */
.fly-hero::before{
  filter:brightness(0.72) contrast(1.15) saturate(0.95);
  opacity:1 !important;
  background-color:#050608;
}
.fly-hero::after{
  background:
    linear-gradient(90deg, #050608 0%, rgba(5,6,8,0.88) 36%, rgba(5,6,8,0.25) 66%, rgba(5,6,8,0.55) 100%),
    linear-gradient(to top, #050608 0%, rgba(5,6,8,0.2) 50%, transparent 100%),
    radial-gradient(120% 95% at 76% 55%, transparent 0%, rgba(5,6,8,0.35) 70%) !important;
}

/* ============ HERO: FLY KAPAK1.jpg tam kompozisyon görseli ============ */
.fly-hero::before{
  background:#000 url('fly-kapak.jpg') center center/cover no-repeat !important;
  filter:none !important;
  opacity:1 !important;
}
.fly-hero::after{ background:transparent !important; }

/* Masaüstü: görselde yazılar gömülü → HTML overlay'i gizle (çift yazı olmasın) */
@media (min-width:768px){
  .fly-hero-inner, .fly-pager, .fly-scroll{ display:none !important; }
  .fly-hero{ min-height:100vh; padding:0 !important; }
}

/* Mobil: görselin drone kısmını göster (gömülü yazıları kırp), responsive HTML yazıyı bindir */
@media (max-width:767px){
  .fly-hero::before{ background-position:74% center !important; }
  .fly-hero::after{
    background:
      linear-gradient(to right, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.6) 48%, rgba(0,0,0,0.25) 100%),
      linear-gradient(to top, rgba(0,0,0,0.85) 0%, transparent 55%) !important;
  }
  .fly-title{ color:#fff; }
}

/* ============ HERO: YAZISIZ drone görseli + HTML yazı overlay (bizim fontlar) ============ */
.fly-hero::before{
  background:#000 url('fly-bg.jpg') center center/cover no-repeat !important;
  filter:none !important;
  opacity:1 !important;
}
.fly-hero::after{
  background:
    linear-gradient(90deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 34%, rgba(0,0,0,0.12) 60%, rgba(0,0,0,0) 75%),
    linear-gradient(to top, rgba(0,0,0,0.6) 0%, transparent 45%) !important;
}
/* Overlay yazılarını tekrar göster (görsel artık yazısız) */
@media (min-width:768px){
  .fly-hero-inner{ display:block !important; }
  .fly-scroll{ display:block !important; }
  .fly-hero{
    min-height:100vh;
    padding:clamp(90px,12vh,140px) clamp(20px,5vw,80px) clamp(30px,5vh,60px) !important;
  }
}
/* Pager görselde gömülü → HTML pager gizli (çift olmasın) */
.fly-pager{ display:none !important; }
/* Mobil: drone ortalansın, overlay yazılar görünür kalsın */
@media (max-width:767px){
  .fly-hero::before{ background-position:center !important; }
}

/* ============ FLY başlık küçült ============ */
.fly-title{ font-size:clamp(64px,11vw,170px) !important; }
@media (max-width:767px){ .fly-title{ font-size:clamp(60px,22vw,110px) !important; } }

/* ============ "AUTONOMY WITHOUT LIMITS" eyebrow küçült (FLY ile orantılı) ============ */
.fly-eyebrow{ font-size:clamp(14px,1.5vw,20px) !important; letter-spacing:0.28em !important; }
@media (max-width:767px){ .fly-eyebrow{ font-size:clamp(13px,3.4vw,17px) !important; } }

/* ============ FLY KAPAK: sinematik low-key / negative-fill ışık animasyonu (sadece hero) ============ */
/* drone arka planında yavaş Ken Burns nefesi */
@keyframes flyKenBurns{
  0%   { transform:scale(1.0)  translate3d(0,0,0); }
  100% { transform:scale(1.07) translate3d(-1.4%,-1%,0); }
}
.fly-hero::before{
  animation: flyKenBurns 30s ease-in-out infinite alternate;
  will-change: transform;
}
/* sürüklenen yumuşak key-light parıltısı (negative fill içinde tek yönlü ışık) */
.fly-fx{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  mix-blend-mode:screen;
  background:
    radial-gradient(46% 60% at 70% 42%, rgba(150,175,215,0.16), rgba(150,175,215,0) 62%),
    radial-gradient(30% 40% at 30% 70%, rgba(90,110,150,0.10), transparent 65%);
  animation: flyKeyDrift 16s ease-in-out infinite alternate;
  will-change: transform, opacity;
}
@keyframes flyKeyDrift{
  0%   { transform:translate3d(-5%,-3%,0) scale(1);    opacity:.45; }
  50%  { opacity:.85; }
  100% { transform:translate3d(6%,4%,0)   scale(1.12); opacity:.5; }
}
/* nefes alan kenar karartması — negative fill (low-key) */
@keyframes flyNegFill{
  0%,100% { box-shadow: inset 0 0 230px 50px rgba(0,0,0,0.80); }
  50%     { box-shadow: inset 0 0 320px 90px rgba(0,0,0,0.90); }
}
.fly-hero{
  animation: flyNegFill 13s ease-in-out infinite;
  will-change: box-shadow;
}
@media (prefers-reduced-motion: reduce){
  .fly-hero, .fly-hero::before, .fly-fx{ animation:none !important; }
}

/* ============ PERF: FLY kapak kasmasını gider (box-shadow animasyonu KALDIR) ============ */
/* Pahalı box-shadow animasyonu repaint yaratıp kasmaya yol açıyordu → statik negative fill */
.fly-hero{
  animation: none !important;
  box-shadow: inset 0 0 260px 70px rgba(0,0,0,0.85) !important;
}
/* sadece compositor üzerinde çalışan (transform/opacity) animasyonlar kalsın */
.fly-hero::before{
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.fly-fx{ will-change: transform, opacity; }

/* ============ FLY: hero görseli SABİT (boyut değişmez) + sadece scroll reveal ============ */
/* drone görseli hiç ölçeklenmesin/büyümesin — orijinal boyut */
.fly-hero::before{ animation: none !important; transform: none !important; }
/* tek animasyon: içerik scroll'da belirir (reveal pages.css + pages.js zaten var) */
.fly-cards .reveal:nth-child(2){ transition-delay: .10s; }
.fly-cards .reveal:nth-child(3){ transition-delay: .20s; }

/* ============ FLY kart reveal: 06 — Yanlardan kayma (sol / orta / sağ, kademeli) ============ */
.fly-cards .fly-card.reveal{
  opacity:0;
  transition: opacity .8s var(--ease, cubic-bezier(.16,1,.3,1)), transform .9s var(--ease, cubic-bezier(.16,1,.3,1));
  will-change: transform, opacity;
}
.fly-cards .fly-card.c1.reveal{ transform: translateX(-55px); }
.fly-cards .fly-card.c2.reveal{ transform: translateY(30px); transition-delay:.10s; }
.fly-cards .fly-card.c3.reveal{ transform: translateX(55px); transition-delay:.20s; }
.fly-cards .fly-card.reveal.in{ opacity:1; transform: none !important; }
@media (prefers-reduced-motion: reduce){
  .fly-cards .fly-card.reveal{ opacity:1; transform:none; }
}

/* ============ FLY kartları CANLI: görsel tam parlaklık + hafif overlay ============ */
.fly-card::before{ opacity:1 !important; }
.fly-card:hover::before{ opacity:1 !important; transform:scale(1.06); }
.fly-card::after{
  background:
    linear-gradient(105deg, rgba(6,8,12,0.86) 0%, rgba(6,8,12,0.45) 44%, rgba(6,8,12,0.10) 72%, rgba(6,8,12,0) 100%),
    linear-gradient(to top, rgba(6,8,12,0.82) 0%, rgba(6,8,12,0.12) 46%, transparent 70%) !important;
}

/* ============ FLY hero yazıları: yüklenince yavaş kademeli beliriş ============ */
@keyframes flyHeroIn{ from{ opacity:0; transform:translateY(34px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: no-preference){
  .fly-hero .fly-lead{ opacity:1 !important; transform:none !important; }  /* reveal'i etkisizleştir, kendi girişimiz */
  .fly-hero .fly-title,
  .fly-hero .fly-eyebrow,
  .fly-hero .fly-rule,
  .fly-hero .fly-desc,
  .fly-hero .fly-cta,
  .fly-hero .fly-scroll{ animation: flyHeroIn 1.3s cubic-bezier(.16,1,.3,1) both; }
  .fly-hero .fly-title  { animation-delay:.20s; }
  .fly-hero .fly-eyebrow{ animation-delay:.60s; }
  .fly-hero .fly-rule   { animation-delay:.78s; }
  .fly-hero .fly-desc   { animation-delay:.95s; }
  .fly-hero .fly-cta    { animation-delay:1.15s; }
  .fly-hero .fly-scroll { animation-delay:1.4s; }
}
