/* ============================================================
   QANATONE — RED NOIR
   Siyah zemin, kızıl aksan, Manrope başlık / Inter gövde.
   Tek zemin: bölümler renk değiştirmez, katmanlar üstte durur.
   ============================================================ */
:root{
  --bg:#050505;
  --ink:#000000;
  --card:#0D0D0D;
  --card2:#131313;
  --line:rgba(255,255,255,.08);
  --line2:rgba(255,255,255,.16);

  --red:#ef233c;
  --red-soft:#ff4d63;
  --red-dim:rgba(239,35,60,.12);
  --red-glow:rgba(239,35,60,.45);

  --tx:#ffffff;
  --tx2:rgba(255,255,255,.62);
  /* Kontrast — siyah zemine (#050505) göre ölçülmüş değerler:
       --tx  %100  20,4:1
       --tx2 %62    7,8:1
       --tx3 %50    5,3:1
       --tx4 %48    5,0:1     (eskiden %40 = 3,7:1, AA eşiği 4,5'in altındaydı)
     tx4 için "yalnız dekoratif etiketlerde kullanılsın" diye bir not vardı
     ama tutmadı: ölçtüğümüzde 121 kuralda kullanılıyordu ve px verilmiş
     54 kuralın hepsi 12px altındaydı (en küçüğü 7px). Kural yazmak yerine
     rengin kendisi AA'ya çekildi; tx3 ile arasında hâlâ görünür bir fark
     var ama artık ikisi de küçük metinde okunabilir.
     DİKKAT: bu değer DATA.theme.colors.tx4 tarafından da yazılıyor
     (applyTheme). İkisi birlikte değişmeli, yoksa panel eskisine döndürür. */
  --tx3:rgba(255,255,255,.50);
  --tx4:rgba(255,255,255,.48);

  --max:1280px;
  --gut:clamp(20px,4vw,40px);
  --r:18px; --r-lg:26px; --r-xl:34px;
  --e:cubic-bezier(.22,1,.36,1);
  --e2:cubic-bezier(.4,0,.2,1);
}
*{margin:0;padding:0;box-sizing:border-box}
/* 2026-08 MOBIL KAYDIRMA HATASI: burada 'smooth' vardı ve yalnız
   html.lenis ile (yani innerWidth>880'de) 'auto'ya dönüyordu. Lenis
   mobilde hiç kurulmadığı için smooth SADECE mobilde açık kalıyordu:
   her programatik scrollTo bir animasyona dönüşüyor, açılış sırasındaki
   düzen değişikliği onu yarıda kesince sayfa rastgele bir noktada
   duruyordu ("her sayfa farklı yerden başlıyor"). Varsayılan artık
   anlık; yumuşak kaydırma gereken yerde scrollToY zaten
   behavior:'smooth' ile açıkça istiyor.                              */
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}

/* ============ KARŞILAMA EKRANI ============
   Görsel logo yok: yalnızca QANATONE yazısı ve devre izleri.
   Harfler yukarıdan ortaya dökülür; izler kenar pedlerinden çıkıp
   içeri doğru çizilir. Çıkış "süpürme": önce harfler yukarı uçar,
   milisaniyeler sonra perdenin tamamı alttan yukarı kendini süpürerek
   sayfayı açar — süpüren kenarı ışıyan bir tarama çizgisi götürür.
   Gerçek yükleme sinyallerine bağlı, oturumda bir kez, hareket
   azaltma açıksa yalın bir solmayla geçer.                           */
html.booting,html.booting body{overflow:hidden}
#boot{position:fixed;inset:0;z-index:999;display:grid;place-items:center;
  transition:opacity .7s cubic-bezier(.22,1,.36,1),visibility .7s}
#boot.done{opacity:0;visibility:hidden;pointer-events:none}
html:not(.boot-on) #boot{display:none}
/* perde süpürmesi: kırpma değil KAYDIRMA — clip-path her karede tam ekran
   yeniden boyama demekti (şerit şerit kırmızı artefaktın kaynağı buydu);
   translateY kompozitörde koşar. CSS kural yedek, asıl hareket JS/WAAPI. */
#boot.out{will-change:transform}
#boot:not(.js).out{animation:bwipe .62s .14s var(--e2) forwards}
@keyframes bwipe{to{transform:translateY(-102%)}}

/* karanlık kabuk */
#boot .bskin{position:absolute;inset:0;z-index:1;
  background:radial-gradient(120% 100% at 50% 45%,#160609 0%,#070708 55%,#040405 100%)}

/* süpüren kenar çizgisi: perdenin alt kenarına yapışık, perdeyle yükselir */
#boot .bscan{position:absolute;left:0;right:0;bottom:-1px;height:2px;z-index:5;
  background:linear-gradient(90deg,transparent,#ff4d63 18%,#ffb3bd 50%,#ff4d63 82%,transparent);
  box-shadow:0 0 14px rgba(239,35,60,.9),0 0 44px rgba(239,35,60,.5);
  opacity:0;pointer-events:none}
#boot.out .bscan{animation:bscanf .62s .1s forwards}
@keyframes bscanf{0%{opacity:0}22%{opacity:1}85%{opacity:1}100%{opacity:0}}

/* anakart izleri: pedler kenarda belirir, izler kenardan içeri çizilir */
#boot .bcirc{position:absolute;left:50%;top:50%;z-index:2;width:min(680px,94vw);
  transform:translate(-50%,-50%);pointer-events:none;opacity:.9}
#boot .bcirc .tr{stroke:rgba(239,35,60,.28);stroke-width:1;fill:none;opacity:0}
#boot:not(.js) .bcirc .tr{animation:bfade .6s .2s forwards}
#boot .bcirc .pd{fill:rgba(239,35,60,.5);opacity:0}
#boot:not(.js) .bcirc .pd{animation:bfade .3s .06s forwards}
#boot .bcirc .sig{stroke:#ff4d63;stroke-width:1.4;fill:none;
  stroke-dasharray:24 340;stroke-dashoffset:0;opacity:0;
  filter:drop-shadow(0 0 4px rgba(239,35,60,.8));
  animation:bsig 2.8s linear infinite}
#boot:not(.js) .bcirc .sig{animation:bfade .4s 1.05s forwards,bsig 2.8s linear 1.05s infinite}
#boot:not(.js) .bcirc .sig.s2{animation-delay:1.65s}
#boot:not(.js) .bcirc .sig.s3{animation-delay:2.25s}
@keyframes bsig{to{stroke-dashoffset:-364}}

#boot .bc{position:absolute;width:28px;height:28px;border:1px solid rgba(239,35,60,.42);
  z-index:2;opacity:0}
#boot:not(.js) .bc{animation:bfade .5s .1s var(--e) forwards}
#boot .bc.a{left:22px;top:22px;border-right:0;border-bottom:0}
#boot .bc.b{right:22px;top:22px;border-left:0;border-bottom:0}
#boot .bc.c{left:22px;bottom:22px;border-right:0;border-top:0}
#boot .bc.d{right:22px;bottom:22px;border-left:0;border-top:0}

.bwrap{position:relative;z-index:3;display:grid;justify-items:center;width:100%}
.bword{display:flex;justify-content:center;gap:.1em;
  font-family:Manrope;font-weight:800;
  font-size:clamp(1.35rem,4.4vw,2rem);color:#fff}
/* marka kilidi: QANAT kırmızı, ONE beyaz */
.bword span:nth-child(-n+5){color:var(--red-soft);
  text-shadow:0 0 16px rgba(239,35,60,.55)}
/* harfler yukarıdan ortaya dökülür — asıl hareket motion/WAAPI'de */
.bword span{opacity:0;transform:translateY(-46px)}
#boot:not(.js) .bword span{animation:bletter .58s var(--e2) both;
  animation-delay:calc(.34s + var(--i) * .07s)}
/* çıkış: harfler perde süpürmesinden milisaniyeler önce yukarı süpürülür */
#boot:not(.js).out .bword span{animation:bletterout .34s var(--e2) forwards;
  animation-delay:calc(var(--i) * .026s)}
#boot.js .bmeta{animation:none;opacity:0}
#boot.out .bmeta{opacity:0;transition:opacity .18s}
.bmeta{margin-top:22px;display:flex;justify-content:center;
  animation:bfade .7s .7s var(--e) both}
.bbar{width:min(168px,42vw);height:2px;border-radius:2px;
  background:rgba(255,255,255,.12);position:relative;overflow:hidden}
.bbar::after{content:'';position:absolute;inset:0;transform-origin:left;
  transform:scaleX(var(--p,0));border-radius:2px;
  background:linear-gradient(90deg,#c31732,#ff4d63 60%,#ff8b98);
  box-shadow:0 0 10px rgba(239,35,60,.95)}
@keyframes bfade{from{opacity:0}to{opacity:1}}
@keyframes bletter{
  0%{opacity:0;transform:translateY(-46px)}
  62%{opacity:1;transform:translateY(5px)}
  100%{opacity:1;transform:none}}
@keyframes bletterout{to{opacity:0;transform:translateY(-74px)}}
@media(prefers-reduced-motion:reduce){
  #boot *{animation:none!important}
  .bword span,.bmeta{opacity:1;transform:none;filter:none}
  #boot .bcirc .tr{stroke-dashoffset:0}
  #boot .bcirc .pd,#boot .bc{opacity:1}
}
/* ---- MOBİL PERDE: saf CSS, kütüphanesiz, 0,8 sn'lik pencereye sığar ----
   Mobilde `.js` sınıfı HİÇ eklenmiyor (perde kapısına bak), yani perdenin
   girişini de çıkışını da aşağıdaki `#boot:not(.js)` kuralları taşıyor.
   Masaüstü zaman çizelgesi buraya sığmaz: orada harfler 1,41 sn'de
   oturuyor, 0,8 sn'lik pencerede perde harfler hâlâ düşerken çekilir ve
   hareket yarıda kesilmiş görünür. Bu blok aynı hareketi sıkıştırıyor —
   en geç 0,72 sn'de her şey yerinde:
     harfler .06 + 7×.04 = .34 başlangıç + .38 süre = 0,72 sn
     sinyaller .46 gecikme + .26 süre           = 0,72 sn
   Kırılma noktası 900px: perde kapısındaki matchMedia ile AYNI sayı.  */
@media(max-width:900px){
  #boot:not(.js) .bc{animation-duration:.28s;animation-delay:.04s}
  #boot:not(.js) .bcirc .pd{animation-duration:.2s;animation-delay:.03s}
  #boot:not(.js) .bcirc .tr{animation-duration:.34s;animation-delay:.06s}
  #boot:not(.js) .bcirc .sig{animation:bfade .26s .34s forwards,bsig 2.8s linear .34s infinite}
  #boot:not(.js) .bcirc .sig.s2{animation-delay:.4s}
  #boot:not(.js) .bcirc .sig.s3{animation-delay:.46s}
  #boot:not(.js) .bword span{animation-duration:.38s;animation-delay:calc(.06s + var(--i) * .04s)}
  #boot:not(.js) .bmeta{animation:bfade .28s .22s var(--e) both}
  /* çıkış da kısalıyor: harfler .22 sn'de uçar, perde .5 sn'de süpürür */
  #boot:not(.js).out .bword span{animation-duration:.22s;animation-delay:calc(var(--i) * .018s)}
  #boot:not(.js).out{animation:bwipe .5s .1s var(--e2) forwards}
  #boot.out .bscan{animation:bscanf .5s .08s forwards}
}
html.lenis{scroll-behavior:auto}
body{background:var(--bg);color:var(--tx);font-family:Inter,system-ui,sans-serif;
  font-size:16.5px;line-height:1.66;overflow-x:hidden;-webkit-font-smoothing:antialiased;
  font-weight:400}

img,svg,canvas{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4,h5{font-family:Manrope,system-ui,sans-serif;font-weight:700;
  letter-spacing:-.045em;line-height:1.04}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.mono{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;
  letter-spacing:.22em;text-transform:uppercase;color:var(--tx3)}

/* ---------- global arka plan ---------- */
#bg{position:fixed;inset:0;z-index:0;pointer-events:none}
#bg .fade{position:absolute;inset:0;background:linear-gradient(180deg,#170406 0%,#050505 46%)}
#bg .orb{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);
  width:min(900px,120vw);height:min(900px,120vw);border-radius:50%;
  background:rgba(239,35,60,.055);filter:blur(130px)}
#bg .grid{position:absolute;inset:0;
  /* Eski 1px'lik kare ızgara "kareli defter" gibi okunuyordu. Yerine:
     ince nokta kafesi (mühendislik ızgarası hissi) + her 5. kesişimde
     hafif vurgu + tepeden süzülen kızıl ışık banyosu. Tek statik boya. */
  background-image:
    radial-gradient(circle at 1px 1px,rgba(255,255,255,.05) 1px,transparent 1.6px),
    radial-gradient(circle at 1px 1px,rgba(255,120,140,.06) 1.4px,transparent 2.2px),
    linear-gradient(180deg,rgba(239,35,60,.05),transparent 34%);
  background-size:28px 28px,140px 140px,100% 100%;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 30%,#000 26%,transparent 76%);
  mask-image:radial-gradient(120% 90% at 50% 30%,#000 26%,transparent 76%)}
#stars{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.55}
#noise{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:.055;
  background-repeat:repeat;background-size:128px 128px}
html.lowfx #stars,html.lowfx #noise{display:none}
/* ---- panelden gelen görünüm anahtarları ---- */
html.t-nograin #noise{display:none}
html.t-nostars #stars{display:none}
html.t-notubes #tubes{display:none!important}
html.t-noagent #bit,html.t-noagent #bitsay,html.t-noagent #bittip,
html.t-noagent #bitback{display:none!important}
html.t-mo-soft #noise,html.t-mo-soft #stars,html.t-mo-soft #tubes{display:none}
html.t-mo-soft #hero .hfloat,html.t-mo-soft .void .ring::before,
html.t-mo-soft #bit .ring,html.t-mo-soft .tkdrift{animation:none}
html.t-mo-off *,html.t-mo-off *::before,html.t-mo-off *::after{
  animation:none!important;transition-duration:.01ms!important;
  scroll-behavior:auto!important}
/* Tam ekran feTurbulence + overlay karışımı, üstüne on ayrı backdrop-filter:
   masaüstünde sorun değil, dokunmatik ekranda kaydırmayı takıyor. Dokunmatik
   ve dar ekranlarda tanecik katmanını tamamen kapatıyoruz.              */
@media(pointer:coarse),(max-width:900px){
  /* 2026-08: yıldız tuvali de statik garantiyle yok — betik geç kalsa
     ya da patlasa bile süs katmanı doğmaz (JS yolu ayrıca lowfx'te). */
  #stars,#noise{display:none}
}
main{position:relative;z-index:2}

/* ---------- üst blur perdesi + nav ---------- */
.topfade{position:fixed;top:0;left:0;right:0;height:110px;z-index:44;pointer-events:none;
  background:linear-gradient(180deg,rgba(5,5,5,.92),rgba(5,5,5,.4) 55%,transparent);
  -webkit-mask-image:linear-gradient(180deg,#000 42%,transparent);
  mask-image:linear-gradient(180deg,#000 42%,transparent)}
nav{position:fixed;top:0;left:0;right:0;z-index:50;padding:20px var(--gut);transition:padding .4s var(--e)}
nav.stuck{padding:12px var(--gut)}
.navin{max-width:1180px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;
  gap:20px;padding:11px 12px 11px 20px;border-radius:999px;
  background:rgba(10,10,10,.6);backdrop-filter:blur(20px);
  border:1px solid var(--line);transition:.4s var(--e)}
nav.stuck .navin{background:rgba(8,8,8,.86);border-color:var(--line2)}
.logo{display:flex;align-items:center;gap:10px;flex-shrink:0}
.logo i{display:block;font-style:normal;flex:none;line-height:0;
  filter:drop-shadow(0 0 14px rgba(239,35,60,.4))}
.logo i img{height:29px;width:auto;display:block}
.logo b{font-family:Manrope;font-size:1.06rem;font-weight:700;letter-spacing:-.04em;
  color:var(--red-soft)}
.logo span{color:var(--tx);font-weight:700}
footer .logo i img{height:33px}
.nlinks{display:flex;gap:30px;align-items:center}
.nlinks a{font-family:Manrope,system-ui,sans-serif;font-size:.92rem;font-weight:500;
  letter-spacing:-.015em;color:var(--tx2);transition:color .26s;
  position:relative;white-space:nowrap}
.nlinks a:hover{color:var(--tx)}
.nlinks a.here{color:var(--tx)}
.nlinks a.here::after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:1.5px;
  background:var(--red);border-radius:2px}
/* --- açılır menü grupları: tetik + yüzen panel --- */
.ndd{position:relative}
.ndt{display:flex;align-items:center;gap:5px;font-family:Manrope,system-ui,sans-serif;
  font-size:.92rem;font-weight:500;letter-spacing:-.015em;color:var(--tx2);
  transition:color .26s;white-space:nowrap}
.ndt svg{width:13px;height:13px;opacity:.65;transition:transform .3s var(--e)}
.ndt:hover,.ndd.open .ndt{color:var(--tx)}
.ndd.open .ndt svg{transform:rotate(180deg)}
.ndp{position:absolute;top:calc(100% + 15px);left:50%;
  transform:translateX(-50%) translateY(8px) scale(.98);
  min-width:280px;padding:8px;border-radius:16px;border:1px solid var(--line2);
  background:rgba(12,12,13,.97);backdrop-filter:blur(18px);
  box-shadow:0 30px 70px -22px rgba(0,0,0,.75);
  opacity:0;visibility:hidden;pointer-events:none;transition:.3s var(--e);z-index:60}
.ndp::before{content:'';position:absolute;top:-17px;left:0;right:0;height:17px} /* hover köprüsü */
.ndd.open .ndp{opacity:1;visibility:visible;pointer-events:auto;
  transform:translateX(-50%) translateY(0) scale(1)}
.ndp-g{display:grid;grid-template-columns:1fr 1fr;gap:2px;width:530px}
.ndi{display:flex;align-items:flex-start;gap:11px;padding:10px 11px;border-radius:11px;
  transition:background .22s}
.ndi:hover{background:rgba(255,255,255,.05)}
.ndi .ni{width:30px;height:30px;border-radius:9px;flex:none;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--tx3);
  transition:.24s var(--e)}
.ndi .ni svg{width:14px;height:14px}
.ndi:hover .ni{background:var(--red-dim);border-color:rgba(239,35,60,.4);color:var(--red-soft)}
.ndi b{display:block;font-family:Manrope,system-ui,sans-serif;font-size:.82rem;
  font-weight:600;letter-spacing:-.015em;color:var(--tx);line-height:1.32}
.ndi .nds{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  font-size:.7rem;color:var(--tx4);line-height:1.45;margin-top:2px}
.ndi em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:8.5px;
  letter-spacing:.14em;text-transform:uppercase;color:var(--tx4);margin-top:3px;display:block}
.ndf{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:7px;
  margin-top:4px;padding:9px;border-top:1px solid var(--line);
  font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tx3);transition:color .22s}
.ndf:hover{color:var(--red-soft)}
.ndf svg{width:11px;height:11px}
.nright .btn{font-family:Manrope,system-ui,sans-serif;font-weight:600;letter-spacing:-.01em}
@media(max-width:1100px){.ndp-g{width:330px;grid-template-columns:1fr}}
.nright{display:flex;align-items:center;gap:10px}
.langs{display:flex;background:rgba(255,255,255,.05);border-radius:999px;padding:3px;gap:2px}
.langs button{padding:5px 10px;border-radius:999px;font-family:'JetBrains Mono',monospace;
  font-size:9.5px;letter-spacing:.12em;color:var(--tx3);transition:.24s}
.langs button.on{background:rgba(255,255,255,.1);color:var(--tx)}
.burger{display:none;width:38px;height:34px;border-radius:9px;border:1px solid var(--line);
  align-items:center;justify-content:center}
.burger i{position:relative;width:15px;height:1.5px;background:var(--tx);font-style:normal;
  transition:.3s var(--e)}
.burger i::before,.burger i::after{content:'';position:absolute;left:0;width:15px;height:1.5px;
  background:var(--tx);transition:.3s var(--e)}
.burger i::before{top:-5px}.burger i::after{top:5px}
.burger.on i{background:transparent}
.burger.on i::before{top:0;transform:rotate(45deg)}
.burger.on i::after{top:0;transform:rotate(-45deg)}

/* ---------- düğmeler ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  padding:14px 26px;border-radius:999px;font-size:.92rem;font-weight:600;
  transition:.3s var(--e);white-space:nowrap;letter-spacing:-.01em}
.btn svg{width:15px;height:15px;transition:transform .3s var(--e)}
.btn:hover svg{transform:translateX(3px)}
.btn-p{background:var(--red);color:#fff;box-shadow:0 0 0 rgba(239,35,60,0)}
.btn-p:hover{background:#ff2f47;box-shadow:0 12px 40px -10px var(--red-glow);transform:translateY(-2px)}
.btn-g{background:rgba(255,255,255,.045);border:1px solid var(--line2);color:var(--tx)}
.btn-g:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.28)}
.btn-sm{padding:10px 18px;font-size:.82rem}

/* dönen kenarlıklı CTA */
@property --ga{syntax:"<angle>";initial-value:0deg;inherits:false}
.shiny{position:relative;isolation:isolate;border-radius:999px;padding:15px 32px;
  font-family:Manrope;font-weight:700;font-size:.95rem;color:#fff;
  background:linear-gradient(#0a0a0a,#0a0a0a) padding-box,
    conic-gradient(from var(--ga),transparent 0%,var(--red) 6%,var(--red) 18%,transparent 34%,transparent 100%) border-box;
  border:2px solid transparent;animation:gaspin 3s linear infinite;
  display:inline-flex;align-items:center;gap:10px;transition:transform .3s var(--e)}
.shiny:hover{transform:translateY(-2px)}
.shiny svg{width:16px;height:16px;transition:transform .3s var(--e)}
.shiny:hover svg{transform:translateX(4px)}
@keyframes gaspin{to{--ga:360deg}}

/* ---------- bölüm başlıkları ---------- */
section{position:relative;padding:clamp(66px,8.6vw,122px) 0}
.shead{margin-bottom:clamp(40px,5vw,66px);max-width:920px}
.shead .mono{display:inline-flex;align-items:center;gap:10px;margin-bottom:20px}
.shead .mono::before{content:'';width:26px;height:1px;background:var(--red)}
.shead h1,.shead h2{font-size:clamp(2.3rem,5.6vw,4.15rem);margin-bottom:18px}
.shead h1 em,.shead h2 em{font-style:normal;color:var(--red)}
.shead h1 .thin,.shead h2 .thin{font-weight:300;color:var(--tx3)}
.shead p{font-size:clamp(1.02rem,1.5vw,1.18rem);color:var(--tx2);font-weight:400;
  line-height:1.7;max-width:62ch}
.cnt{font-family:'JetBrains Mono',monospace;font-size:.9rem;color:var(--tx4);
  vertical-align:super;margin-left:10px;letter-spacing:0}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--e),transform .9s var(--e)}
.rv.in{opacity:1;transform:none}
.rv[data-d="1"]{transition-delay:.07s}.rv[data-d="2"]{transition-delay:.14s}
.rv[data-d="3"]{transition-delay:.21s}.rv[data-d="4"]{transition-delay:.28s}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}}

/* ============ HERO ============ */
#hero{min-height:100svh;display:flex;align-items:center;justify-content:center;
  padding:150px 0 110px;overflow:hidden;text-align:center}
/* kızıl atmosfer — referanstaki sisli derinlik */
#hero .atmo{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
#hero .atmo .a1{position:absolute;left:50%;top:34%;transform:translate(-50%,-50%);
  width:min(1500px,150vw);height:min(1100px,120vw);border-radius:50%;
  background:radial-gradient(closest-side,rgba(190,22,44,.13) 0 26%,rgba(203,26,52,.44) 56%,
             rgba(120,12,28,.19) 73%,transparent 87%);
  filter:blur(70px)}
#hero .atmo .a2{position:absolute;left:-10%;top:-14%;width:70vw;height:60vw;border-radius:50%;
  background:radial-gradient(closest-side,rgba(239,35,60,.34),transparent 70%);filter:blur(90px)}
#hero .atmo .a3{position:absolute;right:-14%;bottom:-20%;width:66vw;height:58vw;border-radius:50%;
  background:radial-gradient(closest-side,rgba(160,16,36,.4),transparent 72%);filter:blur(100px)}
#hero .atmo .a4{position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 34%,rgba(5,5,5,.6) 78%,#050505 100%)}
#tubes{position:absolute;inset:0;z-index:1;width:100%;height:100%;
  opacity:0;transition:opacity 1.8s var(--e);mix-blend-mode:screen}
#tubes.on{opacity:.5}
/* ============ HERO ELLERİ ============
   Üç katman, her katmanın tek bir transform sahibi var:
   .hand   → GSAP (kaydırma yPercent + fare x/y)
   .hfloat → CSS  (sakin salınım)
   img     → CSS  (giriş animasyonu)

   ÖNEMLİ: katman hero'nun tamamına değil ilk ekrana (100svh) sabitlenir.
   #hero min-height:100svh, ama section{position:relative} olduğu için
   inset:0 hero'nun GERÇEK yüksekliğini alıyordu; içerik uzunsa hero
   100svh'yi aşıyor ve alta yaslı robot eli katlamanın altına düşüyordu. */
#hero .hands{position:absolute;left:0;right:0;top:0;
  height:100vh;height:100svh;z-index:2;pointer-events:none;overflow:hidden;
  /* eller merkeze doğru sise karışır → başlık her ekranda temiz kalır */
  -webkit-mask-image:radial-gradient(ellipse 48% 46% at 50% 50%,
    transparent 0 var(--h-mask,10%),rgba(0,0,0,.6) calc(var(--h-mask,10%) + 32%),#000 90%);
  mask-image:radial-gradient(ellipse 48% 46% at 50% 50%,
    transparent 0 var(--h-mask,10%),rgba(0,0,0,.6) calc(var(--h-mask,10%) + 32%),#000 90%)}
#hero .hand{position:absolute;will-change:transform}
#hero .hfloat{position:relative;display:block;will-change:transform}
#hero .hand img{display:block;width:100%;height:auto;opacity:0;position:relative;z-index:1;
  animation:handIn 1.6s var(--e) forwards}
/* Eski hali: img üzerinde 56px + 80px iki drop-shadow vardı ve görsel hem CSS
   salınımı hem GSAP paralaksıyla hareket ettiği için filtreli dev katman her
   karede yeniden rasterize oluyordu — giriş kasmasının ana kaynağı. Aynı ışık
   artık görselin ARKASINDA iki statik gradyan: kızıl hale + zemin gölgesi.
   Katman görselle birlikte taşınır ama hiç yeniden boyanmaz.               */
#hero .hfloat::before{content:'';position:absolute;inset:-14%;z-index:0;pointer-events:none;
  background:radial-gradient(58% 58% at 50% 52%,rgba(239,35,60,.2),transparent 72%);
  opacity:0;animation:bfade 1.6s var(--e) .2s forwards}
#hero .hfloat::after{content:'';position:absolute;left:6%;right:6%;top:16%;bottom:-6%;
  z-index:0;pointer-events:none;
  background:radial-gradient(52% 46% at 50% 62%,rgba(0,0,0,.55),transparent 74%);
  opacity:0;animation:bfade 1.6s var(--e) .2s forwards}
/* 2026-08: bu satır .hand ve .hfloat'a will-change'i İKİNCİ KEZ
   veriyordu (395-396 zaten veriyor) — yinelenen bildirim kaldırıldı. */

/* --- çapraz yerleşim: insan eli üstte-solda, robot altta-sağda;
       parmak uçları ekranın köşegeni boyunca birbirine bakar --- */
#hero .hand-h{left:var(--hh-x,-2vw);top:var(--hh-y,-2vw);width:var(--hh-w,33vw)}
#hero .hand-r{right:var(--hr-x,-2vw);bottom:var(--hr-y,-2vw);width:var(--hr-w,33vw)}

/* --- dönüş merkezi omuz tarafında: kol dışarıdan sallanıyormuş gibi --- */
#hero .hand-h .hfloat{transform-origin:0 6%;animation:handFloatA 13s ease-in-out infinite}
#hero .hand-r .hfloat{transform-origin:100% 94%;animation:handFloatB 17.5s ease-in-out -4s infinite}
#hero .hand-h img{transform-origin:0 0;animation-delay:.28s}
#hero .hand-r img{transform-origin:100% 100%;animation-delay:.5s}

@keyframes handIn{from{opacity:0;transform:scale(1.055)}to{opacity:.94;transform:scale(1)}}
@keyframes handFloatA{0%,100%{transform:translate3d(0,0,0) rotate(0)}
  50%{transform:translate3d(3px,-8px,0) rotate(-1deg)}}
@keyframes handFloatB{0%,100%{transform:translate3d(0,0,0) rotate(0)}
  50%{transform:translate3d(-5px,12px,0) rotate(.8deg)}}

html.lowfx #hero .hfloat{animation:none}
html.lowfx #hero .hfloat::before,html.lowfx #hero .hfloat::after{display:none}
@media(prefers-reduced-motion:reduce){
  #hero .hfloat{animation:none}
  #hero .hand img{animation:none;opacity:.94}}
#hero .wrap{position:relative;z-index:4}
/* boyama kapsaması: bir bölümdeki değişiklik diğerlerini boyatmaz.
   #sektor bilinçli dışarıda — harita mobilde kenardan taşarak büyüyor. */
#projeler,#tespit,#hizmet,#surec,#sozler,#kurucu,#sss,#iletisim{contain:layout paint}
.heroin{position:relative;max-width:940px;margin:0 auto}
/* metnin altındaki zemin koyulaşır: kızıl sis yazının içinden değil çevresinden
   geçer, böylece beyaz beyaz kırmızı kırmızı okunur */
.heroin::before{content:'';position:absolute;left:50%;top:47%;z-index:-1;
  transform:translate(-50%,-50%);width:min(1220px,124%);height:120%;pointer-events:none;
  background:radial-gradient(closest-side,rgba(3,3,4,.56),rgba(3,3,4,.3) 54%,transparent 78%)}
.pill{display:inline-flex;align-items:center;gap:10px;padding:8px 18px;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);
  backdrop-filter:blur(14px);margin-bottom:34px}
.pill .dot{position:relative;display:flex;width:7px;height:7px}
.pill .dot i{position:absolute;inset:0;border-radius:50%;background:var(--red);font-style:normal}
/* Nabız kaldırıldı: 7px'lik nokta zaten kırmızı ve "canlı" diyor; atması
   ilk ekranda sürekli hareket eden bir şey daha demekti. */
.pill .dot i:first-child{opacity:.75}
.pill span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:rgba(255,255,255,.78)}
/* referans tipografisi: serif, ince, ışıklı */
#hero h1{font-family:'Playfair Display',Georgia,serif;font-weight:500;
  font-size:clamp(2.8rem,7.6vw,5.9rem);line-height:1.06;letter-spacing:-.028em;
  color:#fff;margin-bottom:26px;
  text-shadow:0 1px 22px rgba(0,0,0,.5),0 0 34px rgba(255,198,204,.28)}
#hero h1 .l{display:block;overflow:hidden;padding-bottom:.16em;margin-bottom:-.16em}
#hero h1 .l i{display:block;font-style:normal;transform:translateY(114%);
  animation:rise 1.2s var(--e) forwards}
#hero h1 .l:nth-child(2) i{animation-delay:.12s}
#hero h1 em{font-style:italic;font-weight:400;color:rgba(255,255,255,.8)}
#hero h1 b{font-weight:500;color:#ff2f4d;font-style:italic;
  text-shadow:0 0 10px rgba(255,47,77,.55),0 0 46px rgba(239,35,60,.8)}
@keyframes rise{to{transform:translateY(0)}}
.lede{font-size:clamp(.98rem,1.5vw,1.12rem);color:rgba(255,255,255,.78);font-weight:300;
  line-height:1.75;max-width:600px;margin:0 auto 44px;opacity:0;
  animation:fadeup 1s var(--e) .68s forwards;text-shadow:0 1px 16px rgba(0,0,0,.55)}
@keyframes fadeup{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hcta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:center;opacity:0;
  animation:fadeup 1s var(--e) .84s forwards}
/* referanstaki ince çerçeveli ana düğme */
/* Tipografi .btn ile birebir aynı — hero'daki iki düğme aynı ailede okunsun.
   Ayırt edici olan yazı değil, yüzey: cam zemin + kenarda dolaşan ışık.       */
.void{--ring-w:var(--t-ring-w,2px);--ring-spd:var(--t-ring-spd,3.6s);--ring-tail:var(--t-ring-tail,56%);--ring-glow:var(--t-ring-glow,7px);
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  padding:14px 30px;border-radius:999px;border:1px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.05);backdrop-filter:blur(10px);
  font-size:.92rem;font-weight:600;letter-spacing:-.01em;white-space:nowrap;
  color:var(--tx);transition:.34s var(--e)}
.void::before{content:'';position:absolute;inset:0;border-radius:999px;
  background:radial-gradient(60% 100% at 50% 100%,rgba(239,35,60,.55),transparent 72%);
  opacity:0;transition:opacity .45s var(--e)}
.void:hover{border-color:rgba(239,35,60,.7);transform:translateY(-2px);
  box-shadow:0 14px 44px -14px var(--red-glow)}
.void:hover::before{opacity:1}
.void span{position:relative;z-index:1}
/* --- kenarda dolaşan kırmızı ışık ---
   Dönen bir koni gradyanı, maske farkıyla yalnızca 2px'lik kenar bandına
   kırpılıyor. Cam zemin bozulmasın diye içeriye dolgu koymuyoruz.            */
.void .ring{position:absolute;inset:-1px;border-radius:999px;padding:var(--ring-w);
  pointer-events:none;z-index:0;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
  filter:drop-shadow(0 0 var(--ring-glow) rgba(239,35,60,.7));transition:filter .34s var(--e)}
.void .ring::before{content:'';position:absolute;left:50%;top:50%;
  width:260%;aspect-ratio:1;transform:translate(-50%,-50%);
  background:conic-gradient(from 0deg,
    transparent 0 calc(100% - var(--ring-tail)),
    rgba(239,35,60,.30) calc(100% - var(--ring-tail)*.72),
    rgba(255,77,99,.88) calc(100% - var(--ring-tail)*.34),
    #ffe6ea calc(100% - var(--ring-tail)*.15),
    rgba(255,77,99,.85) calc(100% - var(--ring-tail)*.04),
    transparent 100%);
  /* 2026-08 SÜREKLİ DÖNÜŞ (Enes'in düzeltilmiş kararı): önce "taramalı"
     seçilmişti — tur at, sön, bekle. Canlıda görünce fikrini değiştirdi:
     kuyruklu kıvılcım DURMADAN dönsün. Bekleme evresi kaldırıldı, bölen
     kalktı: TUR SÜRESİ artık doğrudan --ring-spd (panelden ayarlanır) ve
     döngü süresiyle aynı — iki yerde yaşayan oran ortadan kalktığı için
     ayrışma riski de bitti. Hız ayarı tek yerden: --ring-spd (3.6s).    */
  animation:voidring var(--ring-spd) linear infinite}
@keyframes voidring{
  from{transform:translate(-50%,-50%) rotate(0turn)}
  to{transform:translate(-50%,-50%) rotate(1turn)}}
.void:hover .ring{filter:drop-shadow(0 0 calc(var(--ring-glow)*1.7) rgba(239,35,60,.95))}
/* maske farkı desteklenmiyorsa halkayı hiç gösterme — yoksa düğmeyi doldurur */
@supports not ((-webkit-mask-composite:xor) or (mask-composite:exclude)){
  .void .ring{display:none}}
/* 2026-08 HALKA LOWFX'TE SUSUYORDU: burada `animation:none` vardı ve
   Enes'in 8 çekirdekli makinesinde bile lowfx açıldığı için (Chrome'un
   deviceMemory'yi ≤2 bildirmesi yeterli) halka HİÇ dönmüyordu — canlıda
   ölçüldü: lowfx:true, anim:none, sure:0s, reduce:false. Oysa dönen şey
   bir sözde-elemanın transform'u; derleyici katmanında koşar, düzen ve
   boyama üretmez. Pahalı olan kısım halkanın üstündeki drop-shadow
   parıltısıydı — her karede yeniden boyama ister. Artık lowfx animasyonu
   değil PARILTIYI kaldırıyor: efekt görünür kalıyor, maliyet düşüyor.  */
html.lowfx .void .ring{filter:none}
@media(prefers-reduced-motion:reduce){.void .ring::before{animation:none}}
.hmeta{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:52px;
  flex-wrap:wrap;opacity:0;animation:fadeup 1s var(--e) 1s forwards;
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(255,255,255,.34)}
.hmeta i{width:1px;height:11px;background:rgba(255,255,255,.2);font-style:normal}
.hmeta b{color:rgba(255,255,255,.56);font-weight:400}
.scrollcue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:4;
  display:flex;flex-direction:column;align-items:center;gap:9px;opacity:0;
  animation:fadeup 1s var(--e) 1.35s forwards;pointer-events:none}
.scrollcue span{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.26em;
  text-transform:uppercase;color:rgba(255,255,255,.3)}
.scrollcue i{position:relative;width:1px;height:44px;font-style:normal;overflow:hidden;
  background:linear-gradient(180deg,rgba(239,35,60,.22),rgba(239,35,60,.04))}
.scrollcue i::after{content:'';position:absolute;left:0;right:0;height:16px;
  background:linear-gradient(180deg,transparent,var(--red-soft),transparent);
  animation:cueflow 2.1s var(--e2) infinite}
@keyframes cueflow{0%{transform:translateY(-18px);opacity:0}
  22%{opacity:1}78%{opacity:1}100%{transform:translateY(46px);opacity:0}}
html.lowfx .scrollcue i::after{animation-duration:3.4s}
@media(max-width:900px){.scrollcue{display:none}
  #hero .hands{-webkit-mask-image:radial-gradient(ellipse 62% 42% at 50% 50%,
      transparent 0 12%,rgba(0,0,0,.55) 44%,#000 90%);
    mask-image:radial-gradient(ellipse 62% 42% at 50% 50%,
      transparent 0 12%,rgba(0,0,0,.55) 44%,#000 90%)}
  #hero .hand-h{left:-5vw;top:82px;width:57vw}
  #hero .hand-r{right:-4vw;bottom:-3vw;width:64vw}}

/* ============ TICKER (yatay kayan cümle) ============ */
/* Üstteki "Birlikte çalıştıklarımız" başlığı kaldırıldı; o başlığa yer
   açan geniş dolgu da gitti. Şerit artık yalnızca isimlerin yüksekliği
   kadar yer kaplıyor.                                                  */
#ticker{padding:clamp(30px,3.4vw,52px) 0;overflow:hidden;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tkpin{display:flex;align-items:center;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.tkrow{display:flex;align-items:center;gap:clamp(30px,4.4vw,74px);white-space:nowrap;
  padding-left:6vw;will-change:transform}
.tkdrift{display:flex;align-items:center;gap:clamp(30px,4.4vw,74px);
  animation:tkdrift 84s linear infinite}
@keyframes tkdrift{to{transform:translateX(calc(-50% - clamp(15px,2.2vw,37px)))}}

html.lowfx .tkdrift{animation-duration:140s}
@media(prefers-reduced-motion:reduce){.tkdrift{animation:none}}
.tkw{font-family:Manrope;font-size:clamp(1.9rem,5.4vw,4.4rem);font-weight:700;
  letter-spacing:-.05em;line-height:1;color:var(--tx);flex-shrink:0}
.tkw.dim{color:var(--tx4);font-weight:300}
.tkw.red{color:var(--red-soft);opacity:.9}
/* powered-by şeridi: etiket çipi + logo görselleri */
.tkpb{flex:none;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--red-soft);
  padding:9px 18px;border:1px solid rgba(239,35,60,.32);border-radius:999px;
  background:rgba(239,35,60,.06)}
.tklg{flex:none;display:flex;align-items:center}
.tklg img{height:clamp(24px,3vw,34px);width:auto;display:block;opacity:.92}
.tksvg{flex-shrink:0;width:clamp(60px,9vw,130px);height:auto;color:var(--red);opacity:.85}
@media(max-width:760px){.tkw{font-size:clamp(1.35rem,5.6vw,2rem)}
  .tkrow{padding-left:4vw}}

/* ============ HİZMET DETAY ============ */
a.card{display:block;color:inherit}
.svgo{display:inline-flex;align-items:center;gap:7px;margin-top:14px;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--red-soft)}
.svgo svg{width:12px;height:12px;transition:transform .3s var(--e)}
.card:hover .svgo svg{transform:translateX(4px)}
.sdsec{margin-top:clamp(44px,6vw,72px)}
.sdsec>.mono{display:block;margin-bottom:18px}
.fnstage{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);
  padding:clamp(20px,3vw,34px);display:flex;flex-direction:column;gap:14px}
.fnrow{display:grid;grid-template-columns:minmax(120px,180px) 1fr 62px;gap:14px;align-items:center}
.fnrow b{font-size:.86rem;font-weight:600;color:var(--tx2)}
.fnbar{height:30px;border-radius:8px;background:rgba(255,255,255,.045);
  border:1px solid var(--line);overflow:hidden}
.fnbar i{display:block;height:100%;width:0;font-style:normal;border-radius:7px;
  background:linear-gradient(90deg,rgba(239,35,60,.28),var(--red));
  box-shadow:0 0 18px rgba(239,35,60,.35)}
.fnrow em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:12px;
  color:var(--red-soft);text-align:right;font-variant-numeric:tabular-nums}
.fnnote{font-family:'JetBrains Mono',monospace;font-size:.68rem;letter-spacing:.06em;
  color:var(--tx4);margin-top:6px}
.sddel{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.sddel span{display:flex;gap:10px;align-items:flex-start;font-size:.86rem;color:var(--tx2);
  line-height:1.5;padding:12px 14px;border:1px solid var(--line);border-radius:12px;
  background:var(--card)}
.sddel svg{width:14px;height:14px;color:var(--red);flex:none;margin-top:2px}
.sdfaq{display:flex;flex-direction:column;gap:10px;max-width:74ch}
.sdfaq details{border:1px solid var(--line);border-radius:12px;background:var(--card);
  padding:14px 18px}
.sdfaq summary{cursor:pointer;font-weight:600;font-size:.92rem;color:var(--tx)}
.sdfaq summary::-webkit-details-marker{display:none}
.sdfaq p{margin-top:10px;font-size:.88rem;color:var(--tx2);line-height:1.7}
.sdcta{margin-top:clamp(48px,6vw,80px);border:1px solid rgba(239,35,60,.32);
  border-radius:var(--r-lg);padding:clamp(26px,4vw,44px);text-align:center;
  background:linear-gradient(180deg,rgba(239,35,60,.07),rgba(239,35,60,.02))}
.sdcta h3{font-family:Manrope;font-size:clamp(1.5rem,3.4vw,2.3rem);font-weight:700;
  letter-spacing:-.035em;margin-bottom:12px}
.sdcta p{color:var(--tx2);max-width:56ch;margin:0 auto 24px;font-size:.98rem;line-height:1.7}
.sdbtns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
@media(max-width:700px){
  .fnrow{grid-template-columns:92px 1fr 48px;gap:10px}
  .fnrow b{font-size:.74rem}}

/* --- genişleyen kart (xcard) --- */
.xc{display:flex}
.xc .xco{flex:1;text-align:left;cursor:pointer;position:relative;
  display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;
  transition:transform .38s var(--e),border-color .38s var(--e),box-shadow .38s var(--e)}
/* <button> UA stili içeriği dikeyde ortalar; kısa/uzun paragraflar
   başlıkları kaydırıyordu — tepeye sabitlendi (sektör kartı dersi). */
@media(hover:hover){
  .xc .xco:hover{transform:translateY(-4px);border-color:rgba(239,35,60,.4);
    box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}}
.xc .xco:active{transform:translateY(-1px)}
.xc-open .xco{opacity:.25}
.xcimg{width:100%;max-height:260px;object-fit:cover;border-radius:12px;
  border:1px solid var(--line);margin-bottom:18px}
.sdimg{width:100%;border-radius:var(--r-lg);border:1px solid var(--line);display:block}
#xcOv{position:fixed;inset:0;z-index:120;background:rgba(5,5,6,.55);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  opacity:0;transition:opacity .35s var(--e)}
#xcOv.on{opacity:1}
#xcPanel{position:fixed;z-index:121;background:#0c0c0d;border:1px solid var(--line2);
  border-radius:18px;overflow:hidden;box-shadow:0 40px 90px -30px rgba(0,0,0,.85);
  transition:top .42s var(--e),left .42s var(--e),width .42s var(--e),height .42s var(--e)}
#xcPanel.ins{transition:none}
.xcin{height:100%;overflow:auto;padding:30px 32px 26px;scrollbar-width:thin}
.xcin h4{font-family:Manrope;font-size:1.35rem;font-weight:700;letter-spacing:-.03em;
  margin-bottom:8px;padding-right:44px}
.xcin .xcs{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--red-soft);margin-bottom:18px}
.xcin p{font-size:.94rem;color:var(--tx2);line-height:1.75;margin-bottom:13px}
.xcx{position:absolute;top:14px;right:14px;z-index:2;width:34px;height:34px;border-radius:50%;
  display:grid;place-items:center;border:1px solid var(--line2);
  background:rgba(255,255,255,.05);color:var(--tx2);transition:.3s var(--e)}
.xcx svg{width:15px;height:15px;transform:rotate(45deg)}
.xcx:hover{color:#fff;border-color:rgba(239,35,60,.5)}

/* --- akış sahnesi (flow ailesi) --- */
.flstage{position:relative;display:flex;gap:14px;border:1px solid var(--line);
  border-radius:var(--r-lg);background:var(--card);padding:clamp(20px,3vw,32px)}
.flstage::before{content:'';position:absolute;left:7%;right:7%;top:50%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(239,35,60,.35),transparent)}
.fln{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;gap:9px;
  padding:16px 14px;border:1px solid var(--line);border-radius:14px;background:#0c0c0d;
  transition:.45s var(--e);opacity:.55}
.fln .ni{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--tx3);
  transition:.45s var(--e)}
.fln .ni svg{width:16px;height:16px}
.fln b{font-family:Manrope;font-size:.9rem;font-weight:600;letter-spacing:-.01em}
.fln>span:last-child{font-size:.74rem;color:var(--tx4);line-height:1.5}
.fln.lit{opacity:1;border-color:rgba(239,35,60,.4)}
.fln.lit .ni{background:var(--red-dim);border-color:rgba(239,35,60,.45);color:var(--red-soft)}
.flpk{position:absolute;z-index:2;width:9px;height:9px;border-radius:50%;background:var(--red);
  box-shadow:0 0 14px var(--red-glow);transform:translate(-50%,-50%);opacity:0;
  transition:opacity .3s;font-style:normal;pointer-events:none}
@media(max-width:760px){
  .flstage{flex-direction:column}
  .flstage::before{left:27px;right:auto;top:8%;bottom:8%;width:1px;height:auto;
    background:linear-gradient(180deg,transparent,rgba(239,35,60,.35),transparent)}}

/* --- SERP tırmanış sahnesi (SEO) --- */
.clstage{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);
  padding:clamp(18px,2.6vw,28px);overflow:hidden}
.clsearch{display:flex;align-items:center;gap:11px;padding:12px 16px;margin-bottom:18px;
  border:1px solid var(--line2);border-radius:999px;background:#0c0c0d}
.clsearch svg{width:16px;height:16px;color:var(--tx3);flex:none}
.clsearch span{font-size:.9rem;color:var(--tx2);font-family:'JetBrains Mono',monospace}
.clpos{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:12px;
  color:var(--red-soft);border:1px solid rgba(239,35,60,.35);border-radius:8px;
  padding:4px 10px;background:rgba(239,35,60,.07);font-variant-numeric:tabular-nums}
.cllist{display:flex;flex-direction:column;gap:10px}
.clr{border:1px solid var(--line);border-radius:12px;background:#0c0c0d;
  padding:14px 16px;min-height:56px;display:flex;align-items:center;gap:12px;
  transition:border-color .4s var(--e)}  /* 2026-08: will-change kaldırıldı — bu blokta transform animasyonu yok, yalnız border-color geçişi var */
.clsk{display:flex;flex-direction:column;gap:7px;flex:1}
.clsk i{display:block;height:8px;border-radius:4px;background:rgba(255,255,255,.07)}
.clr.you{border-color:rgba(239,35,60,.45);background:linear-gradient(90deg,rgba(239,35,60,.10),rgba(239,35,60,.02));
  position:relative;z-index:2;box-shadow:0 12px 34px -14px rgba(239,35,60,.45)}
.clr.you.top{border-color:var(--red)}
.clfav{width:22px;height:22px;border-radius:6px;background:var(--red);flex:none;
  box-shadow:0 0 12px rgba(239,35,60,.6)}
.clyt{display:flex;flex-direction:column;gap:3px;min-width:0}
.clyt em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.08em;color:var(--red-soft)}
.clyt b{font-family:Manrope;font-size:.94rem;font-weight:600;letter-spacing:-.01em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* --- AI cevap sahnesi (GEO) --- */
.aistage{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);
  padding:clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:16px}
.aim{display:flex;gap:12px;align-items:flex-start;opacity:.12;
  transition:opacity .3s}
.aim.a{opacity:.12}
.aiav{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;
  font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--tx2);
  background:rgba(255,255,255,.06);border:1px solid var(--line2)}
.aiav.ai{color:var(--red-soft);border-color:rgba(239,35,60,.4);background:rgba(239,35,60,.08)}
.aim.u .aitxt{font-size:.93rem;color:var(--tx);background:rgba(255,255,255,.05);
  border:1px solid var(--line2);border-radius:4px 16px 16px 16px;
  padding:12px 16px;line-height:1.6;max-width:58ch;min-height:0}
.aim.a .aitxt{font-size:.95rem;color:var(--tx2);line-height:1.75;min-height:52px;
  background:#0c0c0d;border:1px solid var(--line);border-radius:4px 16px 16px 16px;
  padding:13px 17px;max-width:66ch;flex:1}
.gb{color:var(--tx);font-weight:600;transition:.4s var(--e)}
.gb.lit{color:var(--red-soft);text-shadow:0 0 16px rgba(239,35,60,.4)}
.aicur{display:inline-block;width:2px;height:1em;background:var(--red);
  vertical-align:text-bottom;margin-left:2px;font-style:normal;
  animation:ping2 1s steps(2) infinite}
.aisrc{display:flex;align-items:center;gap:8px;margin-left:44px;opacity:0;
  transform:translateY(6px);transition:.5s var(--e);
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em}
.aisrc.on{opacity:1;transform:none}
.aisrc span{color:var(--tx4);text-transform:uppercase}
.aisrc b{color:var(--red-soft);border:1px solid rgba(239,35,60,.35);border-radius:999px;
  padding:3px 10px;background:rgba(239,35,60,.06)}
@media(max-width:700px){.clyt b{font-size:.82rem}.clsearch span{font-size:.78rem}}
.clfav.g{background:rgba(255,255,255,.14);box-shadow:none}
.clms{font-size:.66rem;color:var(--tx4);font-family:'JetBrains Mono',monospace;
  letter-spacing:.06em}
.clrt{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.clrt b{font-family:Manrope;font-size:.84rem;font-weight:600;letter-spacing:-.01em;
  color:var(--tx3)}
.clrt i{display:block;height:7px;border-radius:4px;background:rgba(255,255,255,.07)}
.clr.you{overflow:visible}
.clr.you::after{content:'#1';position:absolute;top:-9px;right:12px;
  font-family:'JetBrains Mono',monospace;font-size:10px;color:#fff;
  background:var(--red);border-radius:7px;padding:2px 8px;opacity:0;
  transform:translateY(4px) scale(.8);transition:.35s var(--e);
  box-shadow:0 0 14px rgba(239,35,60,.55)}
.clr.you.top::after{opacity:1;transform:translateY(0) scale(1)}
.stimg.real{background-size:cover;background-position:center top;
  filter:saturate(.92);border-color:var(--line2)}
.stsec.lit .stimg.real{opacity:1}

/* --- canlı site yerleştirme --- */
.stopen{margin-left:auto;display:inline-flex;align-items:center;gap:6px;
  font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tx3);transition:color .25s}
.stopen:hover{color:var(--red-soft)}
.stopen svg{width:11px;height:11px}
.stlive .stlv{position:relative;height:clamp(340px,42vw,480px);overflow:hidden;
  background:#0a0a0b}
.stlvw{width:1280px;transform-origin:0 0}  /* 2026-08: will-change kaldırıldı — ölçek bir kez kurulup sabit kalıyor, her karede değişmiyor */
.stlvw iframe{width:1280px;height:100%;border:0;display:block;background:#0a0a0b}
.stopts{display:none}
.stlive.nofr .stlv{height:auto}
.stlive.nofr .stopts{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:14px}
.stlive.nofr .stpost{position:relative;display:flex;align-items:flex-end;height:236px;
  border-radius:14px;overflow:hidden;border:1px solid var(--line2);
  background-size:cover;background-position:center top;background-color:#0c0c0d;
  transition:transform .4s var(--e),border-color .4s var(--e)}
.stlive.nofr .stpost:hover{transform:translateY(-4px);border-color:rgba(239,35,60,.45)}
.stlive.nofr .stpost::before{content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(5,5,6,0) 30%,rgba(5,5,6,.86))}
.stlive.nofr .stpost span{position:relative;z-index:1;display:inline-flex;align-items:center;
  gap:8px;margin:0 auto 16px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.15em;text-transform:uppercase;color:#fff;
  border:1px solid rgba(239,35,60,.5);border-radius:999px;padding:9px 16px;
  background:rgba(239,35,60,.16);backdrop-filter:blur(6px)}
.stlive.nofr .stpost svg{width:12px;height:12px}
@media(max-width:700px){.stlive.nofr .stopts{grid-template-columns:1fr}
  .stlive.nofr .stpost{height:160px}}
.stmore{color:var(--red-soft);display:inline-flex;align-items:center;gap:5px}
.stmore svg{width:10px;height:10px}
.stmore:hover{color:var(--red)}
@media(max-width:760px){
  .stlvw{display:none}
  .stlive .stlv{height:auto}
  .stopts{display:flex;flex-direction:column;gap:10px;padding:12px}
  .stpost{position:relative;display:flex;align-items:flex-end;height:150px;
    border-radius:14px;overflow:hidden;border:1px solid var(--line2);
    background-size:cover;background-position:center top;background-color:#0c0c0d}
  .stpost::before{content:'';position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(5,5,6,0) 26%,rgba(5,5,6,.88))}
  .stpost span{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;
    margin:0 auto 14px;font-family:'JetBrains Mono',monospace;font-size:10px;
    letter-spacing:.14em;text-transform:uppercase;color:#fff;
    border:1px solid rgba(239,35,60,.5);border-radius:999px;padding:8px 15px;
    background:rgba(239,35,60,.16);backdrop-filter:blur(6px)}
  .stpost svg{width:12px;height:12px}
  .stmore{display:none}
}

/* --- hizmet sayfaları mobil ölçek denetimi --- */
@media(max-width:760px){
  .sdsec{margin-top:clamp(36px,9vw,52px)}
  .sdhit p{font-size:clamp(1.02rem,4.6vw,1.2rem)}
  .fnstage,.flstage,.clstage,.aistage{padding:16px 14px}
  .clsearch{padding:10px 13px;gap:8px}
  .clr{padding:11px 12px;min-height:50px;gap:10px}
  .clrt b{font-size:.76rem}
  .clyt b{font-size:.8rem}
  .aim{gap:9px}
  .aiav{width:27px;height:27px;font-size:10px}
  .aim.u .aitxt,.aim.a .aitxt{max-width:100%;font-size:.86rem;padding:11px 13px}
  .aisrc{margin-left:36px}
  .xcin{padding:22px 18px 20px}
  .xcin h4{font-size:1.15rem}
  .sdcta{padding:24px 16px}
  .sdbtns .btn{width:100%;justify-content:center}
  .strow{gap:8px}
}
.clpos.hit{animation:clhit .7s var(--e)}
@keyframes clhit{0%{transform:scale(1)}35%{transform:scale(1.22);
  box-shadow:0 0 22px rgba(239,35,60,.55)}100%{transform:scale(1)}}
.fncn{display:flex;justify-content:center;margin:-4px 0;color:var(--tx4);
  opacity:.25;transition:.4s var(--e)}
.fncn svg{width:14px;height:14px}
.fncn.on{opacity:1;color:var(--red-soft);transform:translateY(2px)}
.fnrow{transition:opacity .4s var(--e)}
.fln{position:relative}
.fln::after{content:'✓';position:absolute;top:10px;right:10px;width:17px;height:17px;
  border-radius:50%;display:grid;place-items:center;font-size:9px;color:#fff;
  background:var(--red);opacity:0;transform:scale(.4);transition:.35s var(--e)}
.fln.lit::after{opacity:1;transform:scale(1)}
.aidots{display:inline-flex;gap:5px;padding:4px 2px}
.aidots i{width:6px;height:6px;border-radius:50%;background:var(--tx3);font-style:normal;
  animation:aidot 1s ease-in-out infinite}
.aidots i:nth-child(2){animation-delay:.15s}
.aidots i:nth-child(3){animation-delay:.3s}
@keyframes aidot{0%,100%{transform:translateY(0);opacity:.4}50%{transform:translateY(-4px);opacity:1}}
.aim.a.typing .aiav{animation:ping2 1.4s ease-in-out infinite}
.strail{position:absolute;top:10px;bottom:10px;right:7px;width:3px;border-radius:2px;
  background:rgba(255,255,255,.06);z-index:3;font-style:normal}
.strail b{display:block;width:100%;height:0;border-radius:2px;background:var(--red);
  box-shadow:0 0 10px rgba(239,35,60,.5)}
.stsec:last-child.lit .stbtn2{animation:stcta 2.2s var(--e) .5s infinite}
@keyframes stcta{0%,100%{box-shadow:0 0 0 rgba(239,35,60,.0)}
  50%{box-shadow:0 0 22px rgba(239,35,60,.45)}}

/* --- 3 vuruş --- */
.sdhits{display:flex;flex-direction:column;gap:14px;max-width:66ch}
.sdhit{display:flex;gap:16px;align-items:baseline}
.sdhit span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;
  color:var(--red-soft);flex:none}
.sdhit p{font-family:Manrope;font-size:clamp(1.12rem,2.1vw,1.55rem);font-weight:600;
  letter-spacing:-.022em;line-height:1.32;color:var(--tx)}

/* --- xcard panel içi zengin bloklar --- */
.xstp{display:flex;gap:14px;margin-bottom:16px}
.xstp b{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--red-soft);
  flex:none;padding-top:3px}
.xstp h5{font-family:Manrope;font-size:1rem;font-weight:600;letter-spacing:-.015em;
  margin-bottom:4px}
.xstp p{font-size:.88rem;color:var(--tx2);line-height:1.65;margin:0}
.xdel{display:flex;flex-direction:column;gap:9px}
.xdel span{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--tx2);
  line-height:1.55}
.xdel svg{width:14px;height:14px;color:var(--red);flex:none;margin-top:3px}
.xmet{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:14px;
  margin-bottom:6px}
.xmet b{display:block;font-family:Manrope;font-size:1.6rem;font-weight:700;
  letter-spacing:-.035em;color:var(--red);margin-bottom:4px}
.xmet p{font-size:.78rem;color:var(--tx3);line-height:1.5;margin:0}
.xcin details{border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.02);
  padding:12px 15px;margin-bottom:9px}
.xcin summary{cursor:pointer;font-weight:600;font-size:.9rem;color:var(--tx)}
.xcin summary::-webkit-details-marker{display:none}
.xcin details p{margin:9px 0 0}

/* --- hikâye şeridi sahnesi (craft) --- */
.ststage{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);
  overflow:hidden}
.stbar{display:flex;align-items:center;gap:6px;padding:11px 15px;
  border-bottom:1px solid var(--line);background:#0c0c0d}
.stbar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.13);font-style:normal}
.stbar i:first-child{background:rgba(239,35,60,.75)}
.stbar span{margin-left:10px;font-family:'JetBrains Mono',monospace;font-size:10px;
  letter-spacing:.08em;color:var(--tx4)}
.stview{height:clamp(300px,38vw,420px);overflow:hidden;position:relative}
/* 2026-08: .stpage'in will-change'i kaldırıldı — konum durum
   değişiminde bir kez ayarlanıyor, sürekli animasyon yok. */
.stsec{padding:clamp(22px,3vw,36px) clamp(20px,3.4vw,40px);border-bottom:1px solid var(--line);
  display:flex;flex-direction:column;gap:12px;min-height:64%}
.stsec:not(.tl-act) i{display:block;border-radius:6px;background:rgba(255,255,255,.07);font-style:normal;
  width:0;transition:width .8s var(--e) .1s,opacity .6s var(--e)}
.stnav{height:8px;max-width:34%;opacity:.6}
.stttl{height:18px}
.stttl.red{background:linear-gradient(90deg,rgba(239,35,60,.5),var(--red));
  box-shadow:0 0 16px rgba(239,35,60,.25)}
.stln{height:8px;opacity:.65}
.stbtn2{height:26px;max-width:118px;border-radius:999px;
  background:linear-gradient(90deg,rgba(239,35,60,.35),rgba(239,35,60,.7))}
.w40{max-width:40%}.w44{max-width:44%}.w46{max-width:46%}.w58{max-width:58%}
.w60{max-width:60%}.w72{max-width:72%}
.stlab{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.22em;
  color:var(--tx4)}
.strow{display:flex;gap:12px}
.stcard,.stimg{flex:1;border:1px solid var(--line);background:rgba(255,255,255,.04);
  border-radius:12px;height:0;transition:height .8s var(--e) .12s,opacity .6s}
.stimg{background:linear-gradient(135deg,rgba(239,35,60,.14),rgba(255,255,255,.05))}
.stin{height:24px;border:1px solid var(--line2);background:#0c0c0d!important;max-width:70%}
.stres{font-family:'JetBrains Mono',monospace;font-size:14px;color:var(--red-soft)}
.stsec:not(.lit) :is(.stnav,.stttl,.stln,.stlb,.stcar,.stln2){width:12%!important;opacity:.13}
.stsec:not(.lit) .stbtn2{width:44px!important;opacity:.15}
.stsec:not(.lit) .stcard,.stsec:not(.lit) .stimg{height:18px;opacity:.12}
.stsec:not(.lit) :is(.stbx,.strng,.stcal,.sthrs,.strows,.stbars,.strow2){opacity:.12}
.stsec.lit :is(.stbx,.strng,.stcal,.sthrs,.strows,.stbars,.strow2){opacity:1;transition:opacity .5s var(--e)}

/* --- araç hikâyesi perdeleri (el çizimi) --- */
.stfld{display:flex;align-items:center;gap:12px}
.stlb{height:8px;border-radius:4px;background:rgba(255,255,255,.09)}
.stbx{flex:1;height:30px;border:1px solid var(--line2);border-radius:9px;
  background:#0a0a0b;display:flex;align-items:center;padding:0 10px;max-width:62%}
.stcar{height:8px;border-radius:4px;background:rgba(255,255,255,.16);position:relative;
  transition:width .9s var(--e) .15s}
.stcar::after{content:'';position:absolute;right:-6px;top:-3px;width:2px;height:14px;
  background:var(--red);opacity:0}
.stsec.lit .stcar::after{opacity:1;animation:ping2 1s steps(2) infinite}
.strng{position:relative;height:18px;display:flex;align-items:center;max-width:76%}
.strk{flex:1;height:5px;border-radius:3px;background:rgba(255,255,255,.09);overflow:hidden}
.strk::before{content:'';display:block;height:100%;width:0;border-radius:3px;
  background:linear-gradient(90deg,rgba(239,35,60,.4),var(--red));
  transition:width 1s var(--e) .3s}
.stsec.lit .strk::before{width:64%}
.stth{position:absolute;left:0;top:50%;width:15px;height:15px;border-radius:50%;
  background:#fff;border:3px solid var(--red);transform:translate(-50%,-50%);
  transition:left 1s var(--e) .3s;box-shadow:0 0 12px rgba(239,35,60,.5)}
.stsec.lit .stth{left:64%}
.strow2{display:flex;align-items:center;gap:16px}
.stres{font-family:'JetBrains Mono',monospace;font-size:15px;color:var(--red-soft);
  font-variant-numeric:tabular-nums}
.stcal{display:grid;grid-template-columns:repeat(5,1fr);gap:7px;max-width:74%}
.stcal i{aspect-ratio:1.5;border:1px solid var(--line);border-radius:7px;
  background:rgba(255,255,255,.04);transition:.4s var(--e)}
.stcal i.sel{position:relative}
.stsec.lit .stcal i.sel{background:var(--red);border-color:var(--red);
  box-shadow:0 0 16px rgba(239,35,60,.5);transform:scale(1.08)}
.sthrs{display:flex;gap:8px}
.sthrs i{width:52px;height:20px;border:1px solid var(--line);border-radius:999px;
  background:rgba(255,255,255,.04);transition:.4s var(--e) .35s}
.stsec.lit .sthrs i.on{border-color:rgba(239,35,60,.55);background:rgba(239,35,60,.16);
  box-shadow:0 0 10px rgba(239,35,60,.3)}
.strows{display:flex;flex-direction:column;gap:9px;max-width:82%}
.strows span{display:flex;align-items:center;gap:10px;
  transform:translateX(-14px);opacity:0;transition:.5s var(--e)}
.stsec.lit .strows span{transform:none;opacity:1}
.stsec.lit .strows span:nth-child(2){transition-delay:.12s}
.stsec.lit .strows span:nth-child(3){transition-delay:.24s}
.stdot{width:8px;height:8px;border-radius:50%;background:var(--red);flex:none;
  box-shadow:0 0 8px rgba(239,35,60,.45)}
.stln2{height:8px;border-radius:4px;background:rgba(255,255,255,.1)}
.strows em{margin-left:auto;width:34px;height:12px;border-radius:6px;
  background:rgba(239,35,60,.18);border:1px solid rgba(239,35,60,.35)}
.stbars{display:flex;gap:9px;align-items:flex-end;height:56px;max-width:56%;margin-top:4px}

/* ===== ARAÇLAR SAHNESİ (tl*) — çalışan araç, iskelet değil =====
   ÖNEMLİ: bu perdelerdeki çip/gün/saat/işaret öğeleri <i> etiketi. Eski
   iskelet kuralları (.stsec i, .stsec.lit i) çıplak <i> hedeflediği için
   :not(.tl-act) ile dışarıda bırakıldı — o kural sızınca hepsi tam genişlik
   gri çubuğa dönüyordu. Bu yüzden burada display'i AÇIKÇA bildiriyoruz;
   miras alınacak bir kural artık yok. */
.sttools .stview{height:clamp(268px,28vw,338px)}
.sttools .strail{background:rgba(255,255,255,.05)}
/* Gerçek tarayıcı kaydırma çubuğu: BÜYÜYEN çubuk "yükleniyor" der,
   HAREKET EDEN başlık "sayfayı kaydırıyorsun" der. İkincisi doğru olan. */
.sttools .strail b{height:26%;box-shadow:0 0 8px rgba(239,35,60,.35)}
.tl-act{min-height:clamp(216px,25vw,292px);gap:9px;
  padding:clamp(15px,2.05vw,25px) clamp(17px,2.5vw,31px)}
.tl-act.tl-site{min-height:clamp(172px,20vw,232px)}
.tl-act .stlab{margin-bottom:1px}
.tlsay{margin:1px 0 0;font-size:clamp(10.8px,.96vw,12.2px);line-height:1.45;color:var(--tx3);
  opacity:0;transform:translateY(4px);transition:opacity .45s var(--e),transform .45s var(--e)}
.tl-act.lit .tlsay{opacity:1;transform:none}

/* perde 0 — sitenin kendisi */
.tlnav{display:flex;align-items:center;gap:14px;padding-bottom:9px;
  border-bottom:1px solid var(--line);font-size:clamp(10px,.88vw,11.4px);color:var(--tx3)}
.tlnav b{color:var(--tx);font-weight:650;letter-spacing:-.01em;font-size:clamp(11.5px,1.02vw,13px);
  margin-right:auto;text-transform:capitalize}
.tlh{margin:0;font-size:clamp(15px,1.62vw,21px);line-height:1.2;font-weight:600;
  letter-spacing:-.02em;color:var(--tx);text-wrap:balance}
.tlh em{color:var(--red-soft);font-style:normal}
.tlbtn{align-self:flex-start;padding:8px 15px;border-radius:999px;background:var(--red);
  color:#fff;font-size:clamp(10.5px,.92vw,11.8px);font-weight:600;
  box-shadow:0 9px 22px -14px var(--red)}

/* perde 1 — teklif hesaplayıcı */
.tlrow{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.tlk{font-size:clamp(10.5px,.92vw,11.8px);color:var(--tx3);min-width:56px}
.tlchips{display:flex;gap:6px;flex-wrap:wrap}
.tlch{display:inline-block;width:auto;padding:5px 11px;border-radius:999px;
  border:1px solid var(--line2);background:transparent;
  font-size:clamp(10px,.88vw,11.4px);color:var(--tx3);font-style:normal;white-space:nowrap;
  transition:background .28s var(--e),border-color .28s var(--e),color .28s var(--e)}
.tlch.on{background:var(--red);border-color:var(--red);color:#fff}
.tlnum{font-family:'JetBrains Mono',monospace;font-size:clamp(13px,1.32vw,17px);
  color:var(--tx);font-variant-numeric:tabular-nums}
.tlrng{position:relative;height:5px;border-radius:3px;background:rgba(255,255,255,.09);margin:1px 0}
.tlfill{display:block;position:absolute;inset:0 auto 0 0;width:0;border-radius:3px;
  background:var(--red);transition:none}
.tlknob{position:absolute;top:50%;left:0;width:14px;height:14px;border-radius:50%;
  background:#fff;transform:translate(-50%,-50%);box-shadow:0 3px 9px rgba(0,0,0,.5)}
.tlout{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding-top:9px;border-top:1px solid var(--line)}
.tlout span{font-size:clamp(10.5px,.92vw,11.8px);color:var(--tx3)}
.tlprice{font-family:'JetBrains Mono',monospace;font-size:clamp(15px,1.75vw,23px);
  font-weight:600;color:var(--red-soft);font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* perde 2 — rezervasyon takvimi */
.tlcal{border:1px solid var(--line);border-radius:11px;padding:9px 10px;background:rgba(255,255,255,.02)}
.tlhead,.tlgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.tldh{text-align:center;font-family:'JetBrains Mono',monospace;font-size:8.5px;
  letter-spacing:.08em;color:var(--tx4);padding-bottom:5px}
.tldd{display:flex;width:auto;align-items:center;justify-content:center;
  height:clamp(18px,1.95vw,24px);border-radius:6px;font-size:clamp(9.4px,.84vw,10.8px);
  color:var(--tx2);font-style:normal;background:rgba(255,255,255,.04);
  opacity:0;transform:translateY(3px);transition:opacity .3s var(--e),transform .3s var(--e),
  background .24s var(--e),color .24s var(--e),box-shadow .24s var(--e)}
.tldd.seen{opacity:1;transform:none}
.tldd.full{color:var(--tx4);background:transparent;text-decoration:line-through}
.tldd.pick{background:var(--red);color:#fff;font-weight:650;box-shadow:0 0 0 3px rgba(239,35,60,.2)}
.tlslots{display:flex;gap:7px;flex-wrap:wrap}
.tlsl{display:inline-block;width:auto;padding:6px 11px;border-radius:8px;
  border:1px solid var(--line2);background:transparent;font-style:normal;
  font-family:'JetBrains Mono',monospace;font-size:clamp(10px,.88vw,11.4px);color:var(--tx3);
  opacity:0;transform:translateY(4px);
  transition:opacity .28s var(--e),transform .28s var(--e),border-color .24s var(--e),
             background .24s var(--e),color .24s var(--e)}
.tlsl.seen{opacity:1;transform:none}
.tlsl.on{border-color:var(--red);background:rgba(239,35,60,.14);color:var(--red-soft)}
.tlok{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:9px;
  background:rgba(239,35,60,.1);border:1px solid rgba(239,35,60,.3);color:var(--red-soft);
  font-size:clamp(10.5px,.92vw,11.8px);font-weight:550;align-self:flex-start;white-space:nowrap;
  opacity:0;transform:translateY(5px);transition:opacity .35s var(--e),transform .35s var(--e)}
.tlok.on{opacity:1;transform:none}
.tlok i{display:block;width:14px;height:14px;border-radius:50%;background:var(--red);
  position:relative;flex:none;transition:none}
.tlok i::after{content:'';position:absolute;left:3.7px;top:6px;width:4px;height:2px;
  border-left:1.6px solid #fff;border-bottom:1.6px solid #fff;transform:rotate(-45deg)}

/* perde 3 — müşteri paneli */
.tlprj{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.tlprj b{font-size:clamp(11.6px,1.06vw,13.6px);font-weight:600;color:var(--tx);letter-spacing:-.01em}
.tlpct{font-family:'JetBrains Mono',monospace;font-size:clamp(12px,1.2vw,15px);
  color:var(--red-soft);font-style:normal;font-variant-numeric:tabular-nums}
.tlbar{height:6px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
.tlbarf{display:block;height:100%;width:0;border-radius:4px;transition:none;
  background:linear-gradient(90deg,var(--red),var(--red-soft))}
.tlsteps{display:flex;flex-direction:column;gap:6px}
.tlst{display:flex;align-items:center;gap:9px;font-size:clamp(10.4px,.92vw,11.9px);
  color:var(--tx4);transition:color .3s var(--e)}
.tlst.done,.tlst.now{color:var(--tx2)}
.tltick{display:block;width:15px;height:15px;border-radius:50%;flex:none;position:relative;
  border:1px solid var(--line2);background:transparent;transition:background .3s var(--e),
  border-color .3s var(--e),box-shadow .3s var(--e)}
.tlst.done .tltick{background:var(--red);border-color:var(--red)}
.tlst.done .tltick::after{content:'';position:absolute;left:4px;top:6.3px;width:4px;height:2px;
  border-left:1.5px solid #fff;border-bottom:1.5px solid #fff;transform:rotate(-45deg)}
.tlst.now .tltick{border-color:var(--red);box-shadow:0 0 0 3px rgba(239,35,60,.16)}
.tlst.now .tltick::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--red)}

/* SİMÜLE FARE — animasyonların ANLAMI budur: her değişimin sebebi görünür.
   Ziyaretçi ekranda "birisi bu siteyi kullanıyor" diye okur. */
.tlptr{position:absolute;left:0;top:0;width:14px;height:19px;z-index:4;pointer-events:none;
  opacity:0;margin:-1px 0 0 -1px;transition:opacity .28s var(--e)}
.tlptr::before{content:'';position:absolute;inset:0;background:#fff;
  clip-path:polygon(0 0,0 74%,25% 57%,43% 97%,61% 89%,43% 51%,76% 47%);
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.65))}
.tlrip{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;
  border-radius:50%;border:2px solid var(--red);opacity:0;transform:scale(.3)}

@media (max-width:640px){
  .sttools .stview{height:250px}
  .tl-act{min-height:206px;gap:8px}
  .tl-act.tl-site{min-height:168px}
  .tlnav span:nth-child(3),.tlnav span:nth-child(4){display:none}
  .tlptr{display:none}
}
@media (prefers-reduced-motion:reduce){
  .tlsay,.tldd,.tlsl,.tlok{opacity:1;transform:none;transition:none}
  .tlptr{display:none}
}
.stbars i{flex:1;height:0;border-radius:5px 5px 2px 2px;
  background:linear-gradient(180deg,var(--red),rgba(239,35,60,.35));
  transition:height .8s var(--e) .2s}
.stsec.lit .stbars i{height:var(--h)}
.stsec.lit:not(.tl-act) i{width:100%}
/* :not(.tl-act) ŞART. Bu iki kural iskelet çubukları için yazılmıştı ve çıplak
   <i> hedefliyor. Araç perdelerindeki çip, gün, saat, onay ve adım işaretleri de
   <i> — özgüllük (0,2,1) benim (0,1,0) sınıflarımı eziyor, hepsi tam genişlik
   griye dönüyordu. jsdom DOM testi bunu GÖREMEZ; test/css.js bunun için var.
.stsec.lit .stnav{width:34%}
.stsec.lit .stttl.w72{width:72%}.stsec.lit .stttl.w44{width:44%}
.stsec.lit .stttl.w46{width:46%}.stsec.lit .stln.w58{width:58%}
.stsec.lit .stln.w60{width:60%}.stsec.lit .stin.w60{width:60%}
.stsec.lit .stin{width:70%}
.stsec.lit .stbtn2{width:118px}
.stsec.lit .stcard{height:74px;opacity:1}
.stsec.lit .stimg{height:96px;opacity:1}

/* ============ KARTLAR / BENTO ============ */
.card{position:relative;border:1px solid var(--line);border-radius:var(--r-lg);
  background:linear-gradient(180deg,rgba(255,255,255,.028),rgba(255,255,255,.008));
  padding:clamp(24px,2.8vw,36px);overflow:hidden;transition:.42s var(--e)}
.card:hover{border-color:rgba(255,255,255,.2);transform:translateY(-3px)}
.card::after{content:'';position:absolute;inset:0;opacity:0;transition:opacity .5s var(--e);
  pointer-events:none;background:radial-gradient(70% 60% at 80% 0%,rgba(239,35,60,.14),transparent 70%)}
.card:hover::after{opacity:1}
.card .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--red);
  margin-bottom:20px;transition:.4s var(--e)}
.card:hover .ic{background:var(--red-dim);border-color:rgba(239,35,60,.34)}
.card .ic svg{width:20px;height:20px}
.card h3{font-size:clamp(1.14rem,1.9vw,1.5rem);margin-bottom:11px;letter-spacing:-.035em}
.card p{font-size:.93rem;color:var(--tx3);line-height:1.68;font-weight:300}
.card .num{position:absolute;top:24px;right:26px;font-family:'JetBrains Mono',monospace;
  font-size:10px;letter-spacing:.16em;color:var(--tx4);
  border:1px solid var(--line);padding:5px 11px;border-radius:999px}
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.bento .b2{grid-column:span 2}
.bento .b2x2{grid-column:span 2;grid-row:span 2}
.bento .card.hi{background:var(--red);border-color:var(--red)}
.bento .card.hi h3,.bento .card.hi p{color:#fff}
.bento .card.hi p{opacity:.82}
.bento .card.hi .ic{background:rgba(0,0,0,.16);border-color:rgba(0,0,0,.2);color:#fff}
.bento .card.hi::after{display:none}
.bento .card.hi .num{color:rgba(255,255,255,.7);border-color:rgba(255,255,255,.3)}
@media(max-width:1000px){.bento{grid-template-columns:repeat(2,1fr)}
  .bento .b2x2{grid-row:span 1}}
@media(max-width:620px){.bento{grid-template-columns:1fr}
  .bento .b2,.bento .b2x2{grid-column:span 1}}

/* ============ YAPIŞKAN PROJE DESTESİ ============ */
.deck{position:relative;max-width:1120px;margin:0 auto}
.deckall{display:flex;justify-content:center;margin-top:clamp(30px,4vw,52px)}
body.sub .deckall{display:none}
/* ana sayfada deste daha derli toplu */
body:not(.sub) .dk{top:calc(96px + var(--i,0)*13px)}
body:not(.sub) .dkin{border-radius:clamp(20px,2.4vw,30px)}
.dk{position:sticky;top:calc(88px + var(--i,0)*16px);margin-bottom:clamp(24px,3.4vw,44px)}
.dkin{display:grid;grid-template-columns:.92fr 1.08fr;gap:0;overflow:hidden;
  border-radius:var(--r-xl);border:1px solid var(--line);background:var(--card);
  box-shadow:0 46px 100px -50px #000;transform:scale(var(--s,1));transform-origin:top center;
  will-change:transform,opacity}
.dkimg{position:relative;min-height:clamp(260px,32vw,440px);overflow:hidden;background:#0b0b0c}
/* zemin ayrı katmanda: fotoğraf olmayan kartta da zoom hissi olsun diye */
.dkimg::before{content:'';position:absolute;inset:0;z-index:0;
  background:linear-gradient(150deg,var(--g1,rgba(239,35,60,.16)),transparent 60%),
             radial-gradient(96% 84% at 80% 98%,var(--g2,rgba(255,255,255,.04)),transparent 68%),
             linear-gradient(150deg,rgba(239,35,60,.08),rgba(255,255,255,.03));
  transition:transform 1s var(--e)}
/* 2026-08 KART BOYUTU GÖRSELE GÖRE DEĞİŞİYORDU: img burada
   position:relative + height:100% idi. .dkimg'in yüksekliği belirsiz
   olduğunda (mobilde tek sütun; masaüstünde de ızgara satırı içeriğe
   göre büyürken) height:100% "auto"ya çözülür ve görsel KENDİ DOĞAL
   yüksekliğiyle akışa katkı verir → kart, görselin boyutuna göre
   büyüyüp küçülür. absolute + inset:0 görseli intrinsik hesaplamadan
   tamamen çıkarır: yüksekliği artık yalnız .dkimg'in min-height'ı ve
   metin sütunu belirler, görsel object-fit:cover ile o alana
   ölçeklenir — Enes'in istediği davranış.                           */
.dkimg img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover;
  filter:grayscale(1) contrast(1.1);transition:transform 1s var(--e),filter .6s var(--e)}
.dkimg .mk{position:absolute;inset:0;z-index:1;display:grid;place-items:center;
  font-family:Manrope;font-size:clamp(2.4rem,5vw,4rem);font-weight:700;
  letter-spacing:-.05em;color:rgba(255,255,255,.07);
  transition:transform 1s var(--e),color .6s var(--e)}
/* karta girince hafif, doğrudan görselin üstüne gelince biraz daha */
.dkin:hover .dkimg::before,.dkin:hover .dkimg img,.dkin:hover .dkimg .mk{transform:scale(1.035)}
.dkimg:hover::before,.dkimg:hover img,.dkimg:hover .mk{transform:scale(1.075)}
.dkin:hover .dkimg img{filter:grayscale(.4) contrast(1.08)}
/* Görsel odak noktaları: cover kırpması logolu/metinli bölgeyi pencereden
   atmasın diye slug bazlı hizalar (kart + liste + detay hero'su). */
[data-pj="mercedes-benz"] img{object-position:4% 50%}
[data-pj="skyclinics"] img{object-position:10% 50%}
[data-pj="cmblu-energy"] img{object-position:12% 50%}
[data-pj="terawulf"] img{object-position:70% 50%}
[data-pj="bab-ic-mimarlik"] img{object-position:50% 50%}
/* bab kart logosu: contain + saf siyah zemin — pencere oranı ne olursa
   olsun logo tam, ortalı ve tutarlı ölçekte (%82). Hero'ya dokunmaz. */
.dkimg[data-pj="bab-ic-mimarlik"] img,.mv[data-pj="bab-ic-mimarlik"] img{
  object-fit:contain;background:#000;padding:9%;box-sizing:border-box}
#pdHero[data-pj="kononenko-group"] img{object-position:50% 20%}
#pdHero[data-pj="bab-ic-mimarlik"] img{object-position:15% 60%}
.dkin:hover .dkimg .mk{color:rgba(255,255,255,.12)}
.dkimg .yr{position:absolute;top:20px;left:20px;font-family:'JetBrains Mono',monospace;
  font-size:10px;letter-spacing:.16em;padding:7px 13px;border-radius:999px;
  background:rgba(5,5,5,.66);backdrop-filter:blur(8px);border:1px solid var(--line2);
  color:var(--tx2)}
.dktx{position:relative;padding:clamp(28px,3.6vw,52px);display:flex;flex-direction:column;
  justify-content:center}
/* sol üst köşede karta özel renk — her kartta farklı ton */
.dktx::before{content:'';position:absolute;left:0;top:0;width:66%;height:60%;z-index:0;
  pointer-events:none;
  background:radial-gradient(92% 88% at 0% 0%,var(--g1,rgba(239,35,60,.24)),transparent 68%),
             radial-gradient(66% 64% at 30% 8%,var(--g2,rgba(239,35,60,.12)),transparent 72%);
  opacity:.92;transition:opacity .6s var(--e)}
.dkin:hover .dktx::before{opacity:1}
.dktx>*{position:relative;z-index:1}
.dknum{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  color:var(--tx4);margin-bottom:18px;display:flex;align-items:center;gap:12px}
.dknum::after{content:'';flex:1;height:1px;background:var(--line)}
.dktag{font-size:.82rem;font-weight:500;color:var(--red);margin-bottom:12px}
.dktx h3{font-size:clamp(1.6rem,3vw,2.4rem);margin-bottom:15px}
.dktx p{font-size:.98rem;color:var(--tx2);line-height:1.72;font-weight:300;
  margin-bottom:26px;max-width:50ch}
.dkres{display:flex;gap:30px;flex-wrap:wrap;margin-bottom:30px}
.dkres b{display:block;font-family:Manrope;font-size:1.6rem;font-weight:700;
  letter-spacing:-.04em;color:var(--red);margin-bottom:4px}
.dkres span{font-size:.76rem;color:var(--tx4);line-height:1.4}
.dkgo{display:inline-flex;align-items:center;gap:10px;font-size:.9rem;font-weight:600;
  color:var(--tx);align-self:flex-start;padding-bottom:5px;
  border-bottom:1px solid var(--line2);transition:.32s var(--e)}
.dkgo:hover{color:var(--red);border-color:var(--red);gap:16px}
.dkgo svg{width:15px;height:15px}
@media(max-width:900px){
  /* KART GEÇİLİRKEN KARE BAŞINA GPU İŞİ — deste kaydırılırken `.dkin`in
     ölçeği ve opaklığı HER KAREDE değişiyor (deck(), scroll+rAF). Bir
     katmanın opaklığı değişirken içindeki `filter` ve `backdrop-filter`
     yeniden koşmak zorunda; dört kart aynı anda sahnede olduğu için bu
     maliyet dörde katlanıyor.
     · filter: mobilde `imgk` görseli ZATEN gri pişmiş geliyor, yani bu
       satır aynı sonucu ikinci kez hesaplıyordu — kaldırıldı, görünüm
       birebir aynı.
     · backdrop-filter: yıl rozeti arkasındaki bulanıklık her karede
       arka planı okuyup yeniden bulanıklaştırıyordu. Rozetin altında
       zaten rgba(5,5,5,.66) zemin var; okunurluk bundan geliyor.
     Masaüstünde ikisi de duruyor: hover'da renge dönüş ve buzlu cam
     orada tasarımın parçası, sorun da orada değil.                    */
  .dkimg img{filter:none}
  /* Dokunmatikte :hover TAKILI KALIR (karta bir kez dokunduktan sonra
     kart hover'da sayılır). Bu satır olmadan daha yüksek özgüllükteki
     hover kuralı filtreyi mobilde geri açardı — tam da kaldırdığımız
     kare başına maliyeti, üstelik yalnız dokunulan kartta. */
  .dkin:hover .dkimg img{filter:none}
  .dkimg .yr{backdrop-filter:none}
  /* mobilde de deste hissi: kartlar üst üste kayarak biner (masaüstüyle aynı ruh) */
  .dk{position:sticky;top:calc(72px + var(--i,0)*10px);margin-bottom:18px}
  body:not(.sub) .dk{top:calc(72px + var(--i,0)*10px)}
  .dkin{grid-template-columns:1fr}
  /* 2026-08 KART GEÇİŞİNDE YENİDEN RASTERLEŞME — DOĞRULANDI: gölge
     ölçeklenen elemanın KENDİSİNDE, ebeveyninde değil. `.dkin` tek
     bildirimde üçünü birden taşıyordu: `transform:scale(var(--s,1))`,
     `will-change:transform,opacity`, `box-shadow:0 46px 100px -50px #000`.
     deck() de aynı elemana yazıyor (`it.querySelector('.dkin')` →
     `card.style.transform='scale(...)'`), yani ölçek HER KAREDE değişiyor.
     will-change kalıcı bir kompozit katman ayırtıyor; gölge o katmanın
     içeriği, dolayısıyla ölçek her değiştiğinde 100px bulanıklı gölge
     yeni ölçekte baştan rasterleşiyor. Mobilde dört kart aynı anda
     sahnede olduğu için maliyet dörde katlanıyor.
     İkisi de mobilde kalkıyor; kartın sınırı zaten 1px `--line` çizgisi
     ve kırmızı degradeyle okunuyor. MASAÜSTÜ DEĞİŞMEDİ — orada gölge
     tasarımın parçası, kasma da orada ölçülmedi.                      */
  .dkin{will-change:auto;box-shadow:none}
  .dkimg{min-height:186px}
  .dktx{padding:20px 20px 24px;justify-content:flex-start}
  .dknum{margin-bottom:12px}
  .dktx h3{font-size:1.42rem;margin-bottom:9px}
  .dktx p{font-size:.9rem;line-height:1.58;margin-bottom:15px;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .dkres{gap:12px 20px;margin-bottom:16px}
  .dkres b{font-size:1.28rem;margin-bottom:2px}
  .dkres span{font-size:.68rem}
  .dkimg .yr{top:12px;left:12px}}


/* ============ İŞ AKIŞI (n8n tarzı, sektöre göre) ============ */
.flow{position:relative;margin-bottom:clamp(28px,4vw,52px);
  border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);
  overflow:hidden}
.flow .fh{display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.flow .fh .lb{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx3);display:flex;align-items:center;gap:10px}
.flow .fh .lb i{width:7px;height:7px;border-radius:50%;background:var(--red);font-style:normal;
  box-shadow:0 0 10px var(--red-glow);animation:ping2 2.2s ease-in-out infinite}
.flow .fh .sect{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  color:var(--tx4)}
.flow .fh .sect b{color:var(--red-soft);font-weight:500}
.fstage{position:relative;padding:clamp(22px,3vw,38px) clamp(16px,2.4vw,32px);min-height:420px}
.fsvg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.fwire{fill:none;stroke:rgba(255,255,255,.13);stroke-width:1.4}
.fwire.lit{stroke:rgba(239,35,60,.55)}
.fcols{position:relative;display:grid;grid-template-columns:1fr 1.12fr 1fr;
  gap:clamp(18px,4vw,64px);align-items:center;z-index:2}
.fcol{display:flex;flex-direction:column;gap:11px}
.fnode{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:14px;
  border:1px solid var(--line);background:#101010;opacity:0;transform:translateY(10px) scale(.96);
  transition:.6s var(--e)}
.fnode.on{opacity:1;transform:none}
.fnode.hot{border-color:rgba(239,35,60,.5);background:#161010;
  box-shadow:0 0 26px -8px var(--red-glow)}
.fnode .ni{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex-shrink:0;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--tx3);
  transition:.4s var(--e)}
.fnode.hot .ni{background:var(--red-dim);border-color:rgba(239,35,60,.45);color:var(--red-soft)}
.fnode .ni svg{width:15px;height:15px}
.fnode .nt{flex:1;min-width:0}
.fnode .nt b{display:block;font-size:.83rem;font-weight:600;letter-spacing:-.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fnode .nt span{font-size:.68rem;color:var(--tx4);font-family:'JetBrains Mono',monospace;
  letter-spacing:.08em}
.fnode .nd{width:7px;height:7px;border-radius:50%;background:var(--line2);flex-shrink:0;
  transition:.4s var(--e)}
.fnode.hot .nd{background:var(--red);box-shadow:0 0 9px var(--red-glow)}
/* merkez ajan düğümü */
.fbrain{border:1px solid rgba(239,35,60,.34);border-radius:20px;
  background:linear-gradient(180deg,rgba(239,35,60,.1),rgba(255,255,255,.02));
  padding:20px;opacity:0;transform:scale(.9);transition:.7s var(--e)}
.fbrain.on{opacity:1;transform:none}
.fbrain .bh{display:flex;align-items:center;gap:12px;margin-bottom:15px}
.fbrain .bi{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:var(--red);color:#fff;flex-shrink:0;box-shadow:0 0 24px -4px var(--red-glow);
  animation:brainPulse 2.6s ease-in-out infinite}
@keyframes brainPulse{0%,100%{box-shadow:0 0 24px -4px rgba(239,35,60,.5)}
  50%{box-shadow:0 0 40px 0 rgba(239,35,60,.8)}}
.fbrain .bi svg{width:20px;height:20px}
.fbrain .bt b{display:block;font-family:Manrope;font-size:1rem;font-weight:700;letter-spacing:-.03em}
.fbrain .bt span{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tx4)}
.fsteps{display:flex;flex-direction:column;gap:7px}
.fstep{display:flex;align-items:center;gap:10px;padding:8px 11px;border-radius:10px;
  background:rgba(255,255,255,.03);border:1px solid transparent;
  font-size:.76rem;color:var(--tx3);transition:.4s var(--e)}
.fstep.on{color:var(--tx);border-color:rgba(239,35,60,.3);background:rgba(239,35,60,.08)}
.fstep i{width:16px;height:16px;border-radius:50%;border:1px solid var(--line2);flex-shrink:0;
  display:grid;place-items:center;font-size:8px;font-style:normal;color:transparent;
  transition:.4s var(--e)}
.fstep.on i{border-color:var(--red);color:var(--red-soft);background:var(--red-dim)}
.fstep em{margin-left:auto;font-style:normal;font-family:'JetBrains Mono',monospace;
  font-size:9px;color:var(--tx4)}
.fstep.on em{color:var(--red-soft)}
.fpkt{fill:var(--red)}
.fjoin{fill:var(--red);opacity:.9;filter:drop-shadow(0 0 5px rgba(239,35,60,.5))}
.fglab,.fbadge{display:none}
.fflab{position:absolute;top:12px;left:0;right:0;display:grid;
  grid-template-columns:1fr 1.12fr 1fr;gap:clamp(18px,4vw,64px);
  padding:0 clamp(16px,2.4vw,32px);z-index:1;pointer-events:none}
.fflab span{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);text-align:center}
.flow .ff{padding:12px 20px;border-top:1px solid var(--line);display:flex;
  justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tx4)}
.flow .ff b{color:var(--tx2);font-weight:500}
@media(max-width:900px){
  
    .fcols{display:flex;flex-direction:column;gap:0}
  .fflab{display:none}
  .fstage{min-height:0;padding:24px 14px 26px}
  .fglab{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;
    letter-spacing:.22em;text-transform:uppercase;color:var(--tx4);margin:0 4px 10px}
  #flowIn{margin-bottom:78px}
  .fbrain{margin-bottom:68px;padding:18px 16px 16px;border-radius:18px}
  .fnode{padding:15px;border-radius:16px;gap:12px}
  .fnode .ni{width:42px;height:42px;border-radius:12px}
  .fnode .ni svg{width:18px;height:18px}
  .fnode .nt b{font-size:.95rem;white-space:normal}
  .fnode .nt span{font-size:.72rem}
  .fnode .nd{width:8px;height:8px}
  .fbadge{display:inline-flex;align-items:center;gap:6px;margin-left:auto;
    font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.16em;
    text-transform:uppercase;color:var(--red-soft);border:1px solid rgba(239,35,60,.4);
    border-radius:999px;padding:4px 9px;background:rgba(239,35,60,.08)}
  .fbadge i{width:6px;height:6px;border-radius:50%;background:var(--red);font-style:normal;
    box-shadow:0 0 8px var(--red-glow);animation:ping2 2.2s ease-in-out infinite}
  .fstep{padding:11px 12px;font-size:.84rem;border-radius:12px;gap:11px}
  .fstep i{width:18px;height:18px;font-size:9px}
  .fstep em{font-size:10px}
  .flow .ff{font-size:9px;padding:11px 14px;gap:10px}
}

/* ============ SÜREÇ HATTI ============ */
.chan{position:relative;height:clamp(96px,12vw,150px);margin-bottom:clamp(30px,4vw,54px)}
.chan svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.cbg{fill:none;stroke:rgba(255,255,255,.09);stroke-width:2;stroke-linecap:round}
.cln{fill:none;stroke:url(#cg);stroke-width:2.4;stroke-linecap:round;
  filter:drop-shadow(0 0 7px rgba(239,35,60,.4))}
.cdot{fill:var(--red);filter:drop-shadow(0 0 9px var(--red-glow))}
.cnode{fill:var(--bg);stroke:var(--line2);stroke-width:1.6;transition:.45s var(--e)}
.cnode.on{stroke:var(--red);fill:rgba(239,35,60,.16)}
.clab{font-family:Inter;font-size:11px;font-weight:500;fill:rgba(255,255,255,.34);
  transition:.45s var(--e)}
.clab.on{fill:#fff}
@media(max-width:700px){.chan{height:78px}.clab{font-size:9px}}

/* ============ SÜREÇ AŞAMALARI ============ */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px}
.step{border:1px solid var(--line);border-radius:var(--r);background:var(--card);
  padding:22px 22px 24px;transition:.36s var(--e);cursor:default}
.step:hover{border-color:rgba(239,35,60,.36);background:var(--card2)}
.step .sn{width:34px;height:34px;border-radius:50%;border:1px solid var(--line2);
  display:grid;place-items:center;font-family:'JetBrains Mono',monospace;font-size:11px;
  color:var(--tx3);margin-bottom:16px;transition:.36s var(--e)}
.step:hover .sn{border-color:var(--red);color:var(--red);background:var(--red-dim)}
.step h4{font-size:1.02rem;margin-bottom:8px;letter-spacing:-.03em}
.step p{font-size:.84rem;color:var(--tx3);line-height:1.62;font-weight:300}
.step ul{list-style:none;margin-top:14px;display:flex;flex-wrap:wrap;gap:6px}
.step li{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.1em;
  text-transform:uppercase;padding:5px 9px;border-radius:999px;
  border:1px solid var(--line);color:var(--tx4)}



/* ============ QANATONE AJANI (imleç) ============ */
/* Nokta tamamen dekoratif: pointer-events:auto olduğu için imleç durunca
   noktanın altına giriyor ve sitedeki her tıklamayı/hover'ı yutuyordu. */
#bit{position:fixed;left:0;top:0;z-index:140;width:10px;height:10px;margin:-5px 0 0 -5px;
  pointer-events:none;opacity:0;transition:opacity .6s var(--e);will-change:transform}
#bit.on{opacity:1}
#bit .core{position:absolute;inset:0;border-radius:50%;
  background:radial-gradient(circle at 34% 30%,#ff8b98,var(--red) 62%,#8d0f20);
  box-shadow:0 0 10px 2px rgba(239,35,60,.55);transition:transform .3s var(--e)}
#bit .ring{position:absolute;inset:-4px;border-radius:50%;border:1px solid rgba(239,35,60,.4);
  animation:bitr 2.6s ease-in-out infinite}
@keyframes bitr{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.35);opacity:.15}}
#bit.link .core{transform:scale(1.55)}
#bit.open .core{transform:scale(1.3)}
/* A seçeneği: sistem imleci sitede kapalı, yerini nokta alıyor.
   Bedeli, bağlantılarda el imleci işaretinin kaybolması. Bunu telafi eden
   iki şey var: nokta etkileşimli öğenin üstünde büyüyor (#bit.link) ve
   #bittip hassas ucu gösteriyor — imleç gizliyken nişan alınacak nokta
   belli olsun diye. Metin alanlarında sistem imleci geri geliyor, yoksa
   yazarken nereye tıkladığını göremiyorsun.                              */
#bittip{position:fixed;left:0;top:0;z-index:141;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;
  border-radius:50%;background:var(--red-soft);pointer-events:none;opacity:0;
  transition:opacity .4s var(--e);will-change:transform}
html.bitcursor #bittip.on{opacity:.9}
@media(hover:hover) and (pointer:fine){
  html.bitcursor,html.bitcursor *{cursor:none!important}
  html.bitcursor input,html.bitcursor textarea,
  html.bitcursor select,html.bitcursor [contenteditable]{cursor:auto!important}
}
/* Nokta (140) ve hassas uç (141) balondan (121) YUKARIDA duruyor.
   Eskiden altındaydılar: balon açılınca imleç görünmez oluyor,
   kullanıcı düğmeleri körlemesine aramak zorunda kalıyordu.        */
#bitsay{position:fixed;left:0;top:0;z-index:121;width:min(300px,74vw);
  background:rgba(12,12,12,.94);backdrop-filter:blur(18px);
  border:1px solid rgba(239,35,60,.28);border-radius:16px;padding:15px 16px;
  box-shadow:0 26px 60px -28px #000;opacity:0;transform:translateY(8px) scale(.96);
  transform-origin:top left;pointer-events:none;transition:.34s var(--e)}
#bitsay.on{opacity:1;transform:none;pointer-events:auto}
#bitsay .who{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--red-soft);margin-bottom:9px;display:flex;
  align-items:center;gap:8px}
#bitsay .who i{width:6px;height:6px;border-radius:50%;background:var(--red);font-style:normal;
  box-shadow:0 0 8px var(--red-glow)}
#bitsay p{font-size:.86rem;line-height:1.6;color:var(--tx);margin-bottom:13px;min-height:2.6em}
#bitsay .acts{display:flex;gap:7px;flex-wrap:wrap}
#bitsay .acts button{font-size:.76rem;font-weight:600;padding:8px 14px;border-radius:999px;
  border:1px solid var(--line2);color:var(--tx2);transition:.24s var(--e)}
#bitsay .acts button:hover{border-color:var(--red);color:var(--red-soft);background:var(--red-dim)}
#bitsay .acts button.p{background:var(--red);border-color:var(--red);color:#fff}
#bitsay .acts button.q{border-color:transparent;color:var(--tx4);padding-left:4px;padding-right:4px}
#bitsay .acts button.q:hover{border-color:transparent;background:none;color:var(--tx3)}
#bitback{position:fixed;right:20px;bottom:20px;z-index:118;width:38px;height:38px;
  border-radius:50%;display:grid;place-items:center;cursor:pointer;
  background:rgba(12,12,12,.75);border:1px solid rgba(239,35,60,.3);backdrop-filter:blur(10px);
  opacity:0;transform:translateY(8px);transition:.4s var(--e)}
#bitback.on{opacity:.6;transform:none}
#bitback:hover{opacity:1;border-color:var(--red)}
#bitback span{width:9px;height:9px;border-radius:50%;background:var(--red);
  box-shadow:0 0 10px var(--red-glow)}
@media(max-width:900px),(pointer:coarse){#bit,#bitsay,#bittip,#bitback{display:none!important}}

/* ============ DÜNYA TALEP AĞI (sektör seçilmeden) ============ */
/* ============ TALEP AKIŞ HARİTASI ============
   Referans yerleşim: sol raf + alt şerit + sağ olay akışı.
   Panellerin tamamı DOM — metin cam gibi net kalsın ve her karede
   yeniden çizilmesin diye. Sadece harita, kıvılcımlar ve grafikler canvas. */
#globe{margin-top:clamp(30px,4vw,56px);border:1px solid var(--line);border-radius:var(--r-lg);
  background:radial-gradient(120% 90% at 50% 42%,rgba(239,35,60,.035),transparent 58%),
             linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.004));
  overflow:hidden;position:relative}
#globe.hide{display:none}

/* ---- üst şerit ---- */
#globe .gh{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
#globe .gh .lab{display:flex;align-items:center;gap:10px;
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx2)}
#globe .gh .lab i{width:7px;height:7px;border-radius:50%;background:var(--red);font-style:normal;
  box-shadow:0 0 0 0 rgba(239,35,60,.5);animation:gpulse 2.4s var(--e2) infinite}
@keyframes gpulse{0%{box-shadow:0 0 0 0 rgba(239,35,60,.5)}
  70%{box-shadow:0 0 0 8px rgba(239,35,60,0)}100%{box-shadow:0 0 0 0 rgba(239,35,60,0)}}
#globe .gh .lab em{font-style:normal;font-size:8.5px;letter-spacing:.16em;padding:3px 7px;
  border-radius:5px;border:1px solid rgba(239,35,60,.32);color:var(--red-soft);
  background:rgba(239,35,60,.08)}
#globe .gh .lab .sec{font-weight:500;letter-spacing:.1em;color:var(--tx);
  padding-left:10px;margin-left:2px;border-left:1px solid var(--line2)}
#globe .gh .st{display:flex;gap:0;flex-wrap:wrap;align-items:stretch}
#globe .gh .st>span{display:flex;flex-direction:column;gap:2px;padding:0 16px;
  border-left:1px solid var(--line);font-family:'JetBrains Mono',monospace}
#globe .gh .st>span:first-child{border-left:0}
#globe .gh .st span span{font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--tx4)}
#globe .gh .st b{font-size:14px;font-weight:500;color:var(--tx);
  font-variant-numeric:tabular-nums;line-height:1.1}
#globe .gh .st b em{font-style:normal;font-size:9px;color:var(--red-soft);margin-left:5px}

/* ---- harita kadrajı ---- */
#globe .wrapc{position:relative;aspect-ratio:12/6.4;min-height:300px}
#globe .wrapc::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(115% 90% at 50% 50%,transparent 46%,rgba(5,5,5,.78) 100%)}
#globe canvas#gcv{position:absolute;inset:0;width:100%;height:100%}

/* ---- panel kabuğu ---- */
#globe .gov{position:absolute;z-index:2;pointer-events:none;
  background:linear-gradient(180deg,rgba(13,13,14,.93),rgba(8,8,9,.95));
  border:1px solid var(--line);border-radius:14px;padding:12px 14px;
  opacity:0;transform:translateY(10px);transition:opacity .8s var(--e),transform .8s var(--e)}
#globe.live .gov{opacity:1;transform:none}
#globe .gov h6{display:flex;align-items:baseline;gap:8px;
  font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);margin-bottom:9px;font-weight:400}
#globe .gov h6 em{font-style:normal;letter-spacing:.1em;color:rgba(255,255,255,.16)}

/* sol üst — akan talep */
#globe .gov-a{left:16px;top:16px;width:196px;transition-delay:.1s}
#globe .gov-a .big{display:flex;align-items:baseline;gap:8px}
#globe .gov-a .big b{font-family:'JetBrains Mono',monospace;font-size:23px;font-weight:500;
  color:var(--tx);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
#globe .gov-a .big em{font-style:normal;font-size:10px;color:var(--red-soft);
  font-family:'JetBrains Mono',monospace}
#globe .gov-a canvas{display:block;width:100%;height:32px;margin-top:8px}
#globe .gov-a .sub{display:block;font-family:'JetBrains Mono',monospace;font-size:8.5px;
  letter-spacing:.12em;color:var(--tx4);margin-top:4px}

/* sol orta — en yoğun rotalar */
#globe .gov-r{left:16px;top:154px;width:196px;transition-delay:.25s}
#globe .gov-r .rt{display:block;margin-bottom:9px}
#globe .gov-r .rt:last-child{margin-bottom:0}
#globe .gov-r .rt .l{display:flex;justify-content:space-between;align-items:baseline;gap:8px;
  font-size:9.5px;color:var(--tx2);letter-spacing:.02em}
#globe .gov-r .rt .l b{font-family:'JetBrains Mono',monospace;font-weight:400;color:var(--tx3);
  font-variant-numeric:tabular-nums;flex:none}
#globe .gov-r .rt canvas{display:block;width:100%;height:14px;margin-top:3px}

/* sol alt — sistem durumu */
#globe .gov-s{left:16px;bottom:16px;width:196px;transition-delay:.4s}
#globe .gov-s .sbody{display:flex;align-items:center;gap:12px}
#globe .gov-s .donut{position:relative;flex:none;width:66px;height:66px}
#globe .gov-s .donut canvas{width:66px;height:66px;display:block}
#globe .gov-s .donut span{position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:1px}
#globe .gov-s .donut b{font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:500;
  color:var(--tx);font-variant-numeric:tabular-nums;line-height:1}
#globe .gov-s .donut em{font-style:normal;font-size:7px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--tx4)}
#globe .gov-s .srows{flex:1;min-width:0}
#globe .gov-s .srows div{display:flex;justify-content:space-between;gap:6px;
  font-size:9px;color:var(--tx3);padding:2.5px 0}
#globe .gov-s .srows b{font-family:'JetBrains Mono',monospace;font-weight:400;color:var(--tx2);
  font-variant-numeric:tabular-nums}

/* sağ alt — olay akışı */
#globe .gov-b{right:16px;bottom:16px;width:262px;transition-delay:.55s}
#globe .gev{display:flex;align-items:center;gap:8px;font-size:9.5px;letter-spacing:.02em;
  padding:2.5px 0;opacity:0;transform:translateX(9px);
  transition:opacity .45s var(--e),transform .45s var(--e)}
#globe .gev.in{opacity:1;transform:none}
#globe .gev i{width:5px;height:5px;border-radius:50%;background:var(--red);flex:none;
  box-shadow:0 0 7px rgba(239,35,60,.8)}
#globe .gev.miss i{background:rgba(255,255,255,.26);box-shadow:none}
#globe .gev b{font-weight:400;color:var(--tx2);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
#globe .gev.miss b{color:var(--tx4)}
#globe .gev span{color:var(--tx4);margin-left:auto;white-space:nowrap;font-size:8.5px;
  font-family:'JetBrains Mono',monospace;flex:none}

/* sağ üst — kapsanan pazarlar */
#globe .gov-m{right:16px;top:16px;width:174px;transition-delay:.7s}
#globe .gov-m .mk{display:flex;justify-content:space-between;align-items:center;gap:8px;
  font-size:9.5px;color:var(--tx2);padding:2.5px 0}
#globe .gov-m .mk i{flex:1;height:2px;border-radius:2px;background:rgba(255,255,255,.08);
  position:relative;overflow:hidden}
#globe .gov-m .mk i b{position:absolute;inset:0 auto 0 0;border-radius:2px;
  background:linear-gradient(90deg,rgba(239,35,60,.5),var(--red-soft));
  transition:width 1.1s var(--e)}
#globe .gov-m .mk em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:8.5px;
  color:var(--tx4);flex:none;font-variant-numeric:tabular-nums}

/* alt şerit — talep yoğunluğu */
#globe .gov-c{left:50%;transform:translate(-50%,10px);bottom:16px;width:min(430px,38%);
  transition-delay:.5s}
#globe.live .gov-c{transform:translate(-50%,0)}
#globe .gov-c canvas{display:block;width:100%;height:52px}
#globe .gov-c .ax{display:flex;justify-content:space-between;
  font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.1em;
  color:var(--tx4);margin-top:3px}

/* gösterge */
#globe .glg{position:absolute;left:50%;transform:translateX(-50%);top:16px;z-index:2;
  pointer-events:none;display:flex;gap:16px;font-family:'JetBrains Mono',monospace;
  font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx4);
  opacity:0;transition:opacity 1s var(--e) .85s}
#globe.live .glg{opacity:1}
#globe .glg span{display:flex;align-items:center;gap:6px}
#globe .glg i{width:5px;height:5px;border-radius:50%;background:var(--red);
  box-shadow:0 0 7px rgba(239,35,60,.75)}
#globe .glg span.b i{background:rgba(255,255,255,.26);box-shadow:none}

/* ---- alt bilgi ---- */
#globe .gfoot{padding:12px 20px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.1em;color:var(--tx4)}

/* ---- daraltmalar: küçük ekranda panel kalabalığı okunmaz olur ---- */
@media(max-width:1120px){
  #globe .gov-m{display:none}
  #globe .gov-c{width:min(360px,44%)}}
@media(max-width:900px){
  /* mobil: veri panelleri kalabalık ediyor — sahnede yalnızca harita */
  #globe .gov,#globe .glg{display:none}
  #globe .gh .st{display:none}
  #globe .wrapc{aspect-ratio:4/3.6}}
@media(max-width:560px){
  /* harita kenardan kenara taşar ve büyür */
  #globe{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
    border-radius:0;border-left:0;border-right:0}
  #globe .wrapc{aspect-ratio:1/1.04;min-height:340px}}

html.lowfx #globe .gov{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(9,9,10,.86)}

/* ============ TÜM PROJELER (masonry arşiv) ============
   Kartlar mutlak konumlu; yerleşimi JS hesaplıyor, GSAP taşıyor.
   Yükseklik ölçülerek alınıyor — sabit yükseklik dayatmıyoruz ki
   metin uzunluğu değişince kutu bozulmasın.                       */
#prjall .msf{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:clamp(22px,3vw,36px)}
.mc{display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:999px;
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--tx3);
  font-size:.82rem;cursor:pointer;transition:.28s var(--e);white-space:nowrap}
.mc:hover{color:var(--tx2);border-color:var(--line2)}
.mc.on{background:rgba(239,35,60,.12);border-color:rgba(239,35,60,.42);color:#fff}
.mc em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--tx4)}
.mc.on em{color:var(--red-soft)}

.msn{position:relative;width:100%;min-height:320px}
/* Parıltılı kart (referans: glare-cards): dış .mi konum/masonry katmanı
   (GSAP x-y transformları ona ait), iç .mi-t eğim + parıltı katmanı.
   İkisi ayrılmasa GSAP'in translate'i ile tilt'in rotate'i çakışırdı. */
/* 2026-08 LAYERIZE %21,5 (ölçüldü: 3.325 ms / 24,3 sn kayıt): burada
   `will-change:transform,opacity,filter` vardı ve bu HER arşiv kartına
   kalıcı, filtre destekli bir kompozit katman ayırtıyordu — kartlar
   hareket etmediği anlarda bile. will-change bir SÖZ değil, kalıcı bir
   maliyet: tarayıcıya "bunu şimdiden ayır" der. Kartlar zaman zaman
   (hover, reveal) hareket ediyor; o anda tarayıcı katmanı kendisi
   ayırıyor. Özellikle `filter` en pahalı olanı. Kaldırıldı; görünüm
   değişmez, kompozitör her karede daha az katman yönetir.            */
.mi{position:absolute;left:0;top:0;display:block;opacity:0;color:inherit;
  perspective:900px}
.mi-t{position:relative;display:flex;flex-direction:column;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.006));
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:border-color .35s var(--e),box-shadow .35s var(--e)}
.mi:hover .mi-t{border-color:rgba(239,35,60,.45);box-shadow:0 26px 64px -32px var(--red-glow)}
/* katman 1: imleci izleyen kızıl parıltı */
.mi-t::before{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),
    rgba(239,35,60,.2),transparent 72%);
  mix-blend-mode:screen;opacity:0;transition:opacity .5s var(--e)}
.mi:hover .mi-t::before{opacity:1}
/* katman 2: imlecin baktığı noktadan doğan kenar ışığı — 1px halkaya maskeli */
.mi-t::after{content:'';position:absolute;inset:-1px;z-index:4;pointer-events:none;
  border-radius:19px;padding:1px;
  background:conic-gradient(from 0deg at var(--gx,50%) var(--gy,50%),
    transparent,rgba(255,120,140,.8),transparent 32%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
  opacity:0;transition:opacity .5s var(--e)}
.mi:hover .mi-t::after{opacity:1}

/* görsel alanı — fotoğraf yoksa üretilmiş bir yüzey, boş kutu değil */
.mv{position:relative;display:block;height:var(--vh,220px);overflow:hidden;
  background:radial-gradient(120% 100% at 28% 0%,var(--g1,rgba(239,35,60,.17)),transparent 62%),
             radial-gradient(80% 70% at 86% 100%,var(--g2,transparent),transparent 70%),
             linear-gradient(158deg,#150609,#0a0a0b 64%)}
.mv img{width:100%;height:100%;object-fit:cover;filter:grayscale(.22) contrast(1.05);
  transition:transform .7s var(--e)}
.mi:hover .mv img{transform:scale(1.05)}
.mv .mk{position:absolute;inset:0;display:grid;place-items:center;
  font-family:'Playfair Display',Georgia,serif;font-size:clamp(2.4rem,4.6vw,3.6rem);
  letter-spacing:-.03em;color:rgba(255,255,255,.09);transition:.6s var(--e)}
.mi:hover .mv .mk{color:rgba(255,122,140,.22);transform:scale(1.07)}
.mv .yr{position:absolute;left:15px;top:14px;z-index:2;font-family:'JetBrains Mono',monospace;
  font-size:9px;letter-spacing:.2em;color:var(--tx4)}
.mv::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 52%,rgba(5,5,5,.8))}

.mb{padding:16px 17px 18px;display:flex;flex-direction:column;gap:9px}
.mt{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--red-soft)}
.mi h3{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:1.16rem;
  letter-spacing:-.01em;line-height:1.22}
.mi p{font-size:.83rem;line-height:1.62;color:var(--tx3);font-weight:300}
.mr{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.mr>span{display:flex;flex-direction:column;gap:1px;padding:7px 10px;border-radius:9px;
  background:rgba(255,255,255,.03);border:1px solid var(--line)}
.mr b{font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:500;color:#fff;
  font-variant-numeric:tabular-nums}
.mr em{font-style:normal;font-size:9px;letter-spacing:.04em;color:var(--tx4)}
.mgo{display:inline-flex;align-items:center;gap:7px;margin-top:5px;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--tx3);transition:color .3s var(--e)}
.mgo svg{width:13px;height:13px;transition:transform .3s var(--e)}
.mi:hover .mgo{color:var(--red-soft)}
.mi:hover .mgo svg{transform:translateX(4px)}
.msempty{padding:60px 0;text-align:center;color:var(--tx4);
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase}
@media(max-width:600px){.mv{height:calc(var(--vh,220px)*.82)}}

/* ============ SEKTÖR SEÇİMİ ============ */
.secs{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}
.sc{position:relative;display:flex;flex-direction:column;align-items:flex-start;
  justify-content:flex-start;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--card);padding:24px 20px 22px;text-align:left;overflow:hidden;
  transition:.38s var(--e)}
/* <button> içeriğini tarayıcı dikeyde ortalar; ızgara kartları eşit boya
   gerilince kısa içerikli kartın ikonu/başlığı aşağı kayıyordu — tepeye
   sabitledik. 6'lı sırada isimler 1-2 satır arası değişince açıklamalar
   da kayıyordu; masaüstünde başlığa iki satırlık yer ayrıldı. */
.sc::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--red);
  transform:scaleX(0);transform-origin:left;transition:transform .5s var(--e)}
.sc:hover{transform:translateY(-4px);border-color:rgba(239,35,60,.34);background:var(--card2)}
.sc:hover::after,.sc.on::after{transform:scaleX(1)}
.sc.on{border-color:var(--red);background:linear-gradient(180deg,rgba(239,35,60,.09),var(--card2))}
.sc .ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--tx3);
  margin-bottom:16px;transition:.38s var(--e)}
.sc:hover .ic,.sc.on .ic{background:var(--red-dim);border-color:rgba(239,35,60,.4);color:var(--red)}
.sc .ic svg{width:19px;height:19px}
.sc b{display:block;font-family:Manrope;font-size:1rem;font-weight:700;letter-spacing:-.03em;
  margin-bottom:7px;line-height:1.24}
.sc span{font-size:.79rem;color:var(--tx3);line-height:1.5;font-weight:300}
.sc .ck{position:absolute;top:16px;right:16px;width:20px;height:20px;border-radius:50%;
  background:var(--red);display:grid;place-items:center;opacity:0;transform:scale(.4);
  transition:.34s var(--e)}
.sc.on .ck{opacity:1;transform:none}
.sc .ck svg{width:11px;height:11px;color:#fff}
@media(min-width:1101px){.sc b{min-height:2.5em}}
@media(max-width:1100px){.secs{grid-template-columns:repeat(3,1fr)}}
@media(max-width:660px){.secs{grid-template-columns:repeat(2,1fr);gap:9px}
  .sc{padding:18px 15px 17px}.sc .ic{width:36px;height:36px;margin-bottom:12px}}

/* sektör panosu */
#sekpanel{display:none}
#sekpanel.on{display:block;padding-top:0}
.skwrap{border:1px solid var(--line);border-radius:var(--r-xl);background:var(--card);
  padding:clamp(26px,3.4vw,46px);position:relative;overflow:hidden}
.skwrap::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(80% 70% at 12% 0%,rgba(239,35,60,.1),transparent 62%)}
.skwrap>*{position:relative}
.skh{display:flex;align-items:flex-start;gap:18px;flex-wrap:wrap;margin-bottom:28px}
.skh .ic{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  background:var(--red-dim);border:1px solid rgba(239,35,60,.34);color:var(--red);flex-shrink:0}
.skh .ic svg{width:21px;height:21px}
.skh .t{flex:1;min-width:230px}
.skh .lb{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--red);margin-bottom:8px}
.skh h3{font-size:clamp(1.3rem,2.7vw,1.9rem);margin-bottom:9px}
.skh p{font-size:.92rem;color:var(--tx3);line-height:1.66;font-weight:300;max-width:62ch}
.skm{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:11px;
  margin-bottom:14px}
.skm div{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.02);
  padding:18px 19px;opacity:0;transform:translateY(9px);transition:.55s var(--e)}
.skm div.on{opacity:1;transform:none}
.skm b{display:block;font-family:Manrope;font-size:1.62rem;font-weight:700;
  letter-spacing:-.04em;margin-bottom:6px;line-height:1}
.skm .warn b{color:var(--red)}
.skm .good b{color:#fff}
.skm span{font-size:.76rem;color:var(--tx4);line-height:1.45}
.skcols{display:grid;grid-template-columns:1.05fr 1fr;gap:11px;margin-bottom:22px}
.skbox{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.02);
  padding:20px;opacity:0;transform:translateY(9px);transition:.55s var(--e)}
.skbox.on{opacity:1;transform:none}
.skbt{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);margin-bottom:15px}
.skch{display:flex;align-items:center;gap:12px;padding:8px 0}
.skch .ci{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--red);flex-shrink:0}
.skch .ci svg{width:12px;height:12px}
.skch .cn{font-size:.85rem;flex:1;font-weight:500}
.skch .cb{width:74px;height:4px;border-radius:3px;background:rgba(255,255,255,.07);overflow:hidden}
.skch .cb i{display:block;height:100%;width:0;border-radius:3px;background:var(--red);
  transition:width 1s var(--e)}
.skch .cp{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--tx4);
  width:34px;text-align:right}
.skq{border-left:2px solid var(--red);padding:3px 0 3px 15px;margin-bottom:18px}
.skq p{font-size:.95rem;color:var(--tx);margin-bottom:8px;line-height:1.5}
.skq span{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red)}
.skact{list-style:none}
.skact li{display:flex;gap:11px;padding:7px 0;font-size:.85rem;color:var(--tx2);
  line-height:1.55;font-weight:300}
.skact b{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--tx4);
  flex-shrink:0;padding-top:3px}
.skcta{display:flex;gap:11px;align-items:center;flex-wrap:wrap}
@media(max-width:880px){.skcols{grid-template-columns:1fr}}


/* ---- kişisel finans hesabı ---- */
.skcalc{border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.02);
  padding:20px;margin-bottom:14px;opacity:0;transform:translateY(9px);transition:.55s var(--e)}
.skcalc.on{opacity:1;transform:none}
.skcalc .ct{display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin-bottom:16px;flex-wrap:wrap}
.skcalc .ct .t{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4)}
.skcalc .ct .hint{font-size:.72rem;color:var(--tx4);font-weight:300}
.sl{margin-bottom:16px}
.sl:last-child{margin-bottom:0}
.sl label{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  font-size:.78rem;color:var(--tx2);margin-bottom:9px;font-weight:500}
.sl label b{font-family:'JetBrains Mono',monospace;font-size:.92rem;color:#fff;font-weight:500}
.sl input[type=range]{width:100%;-webkit-appearance:none;appearance:none;height:3px;
  border-radius:3px;outline:0;cursor:pointer;
  background:linear-gradient(90deg,var(--red) var(--p,50%),rgba(255,255,255,.11) var(--p,50%))}
.sl input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;
  border-radius:50%;background:var(--red);cursor:pointer;border:3px solid #0d0d0d;
  box-shadow:0 0 0 1px rgba(239,35,60,.6),0 0 14px rgba(239,35,60,.45)}
.sl input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;
  background:var(--red);cursor:pointer;border:3px solid #0d0d0d}
.slp{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.slp button{flex:1;min-width:56px;font-family:'JetBrains Mono',monospace;font-size:9.5px;
  letter-spacing:.1em;padding:7px 5px;border-radius:9px;border:1px solid var(--line);
  background:var(--card2);color:var(--tx4);transition:.2s var(--e)}
.slp button:hover{color:var(--tx2);border-color:var(--line2)}
.slp button.on{color:var(--red-soft);border-color:rgba(239,35,60,.5);background:var(--red-dim)}
.skdelta{border:1px solid rgba(239,35,60,.34);border-radius:16px;
  background:linear-gradient(120deg,rgba(239,35,60,.12),rgba(255,255,255,.02));
  padding:18px 20px;margin-bottom:14px;display:flex;justify-content:space-between;
  align-items:center;gap:16px;flex-wrap:wrap}
.skassum{margin-top:12px;font-size:.74rem;line-height:1.65;color:var(--tx3);max-width:74ch;font-weight:300}
.skdelta .l{font-size:.84rem;color:var(--tx2);line-height:1.6;max-width:48ch;font-weight:300}
.skdelta .l b{color:#fff;font-weight:600}
.skdelta .v{text-align:right}
.skdelta .v span{display:block;font-family:'JetBrains Mono',monospace;font-size:9.5px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--tx4);margin-bottom:5px}
.skdelta .v b{font-family:Manrope;font-size:1.8rem;font-weight:800;letter-spacing:-.04em;
  color:var(--red-soft);line-height:1}
@media(max-width:700px){.skdelta{flex-direction:column;align-items:flex-start}
  .skdelta .v{text-align:left}}

/* ============ CANLI TEŞHİS ============ */
.dg{max-width:860px}
.dgform{display:flex;gap:11px;flex-wrap:wrap;margin-bottom:14px}
.dgin{flex:1;min-width:260px;display:flex;align-items:center;gap:13px;
  border:1px solid var(--line2);border-radius:999px;background:rgba(255,255,255,.035);
  padding:4px 6px 4px 20px;transition:.3s var(--e)}
.dgin:focus-within{border-color:var(--red);box-shadow:0 0 0 4px rgba(239,35,60,.1)}
.dgin svg{width:17px;height:17px;color:var(--tx4);flex-shrink:0}
.dgin input{flex:1;background:none;border:0;outline:0;font:inherit;font-size:1rem;
  color:var(--tx);padding:14px 0;min-width:0}
.dgin input::placeholder{color:var(--tx4)}
.dgnote{font-size:.8rem;color:var(--tx4);line-height:1.6;font-weight:300}
.dgnote b{color:var(--tx2);font-weight:500}
.dgscan{display:none;margin-top:24px;border:1px solid var(--line);border-radius:var(--r-lg);
  background:var(--card);padding:20px 22px}
.dgscan.on{display:block}
.dgsr{display:flex;align-items:center;gap:13px;padding:8px 0;font-size:.87rem;
  color:var(--tx4);opacity:.3;transition:.45s var(--e)}
.dgsr.on{opacity:1;color:var(--tx2)}
.dgsr b{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--red)}
.dgtick{width:18px;height:18px;border-radius:50%;border:1px solid var(--line2);flex-shrink:0;
  display:grid;place-items:center;font-size:10px;color:transparent}
.dgsr.on .dgtick{border-color:var(--red);color:var(--red);background:var(--red-dim)}
.dgspin{width:18px;height:18px;border-radius:50%;flex-shrink:0;
  border:1.6px solid rgba(255,255,255,.12);border-top-color:var(--red);
  animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.dgres{display:none;margin-top:24px}
.dgres.on{display:block;animation:fadeup .6s var(--e)}
.dgtop{display:flex;align-items:center;gap:26px;padding:24px 26px;border:1px solid var(--line);
  border-radius:var(--r-lg);background:var(--card);margin-bottom:14px;flex-wrap:wrap}
.dgring{position:relative;width:104px;height:104px;flex-shrink:0}
.dgring svg{width:100%;height:100%;transform:rotate(-90deg)}
.dgring .bg2{fill:none;stroke:rgba(255,255,255,.08);stroke-width:7}
.dgring .fg{fill:none;stroke:var(--red);stroke-width:7;stroke-linecap:round;
  transition:stroke-dashoffset 1.5s var(--e)}
.dgring b{position:absolute;inset:0;display:grid;place-items:center;font-family:Manrope;
  font-size:1.75rem;font-weight:800;letter-spacing:-.04em}
.dgtin{flex:1;min-width:230px}
.dgtin .dgh{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);margin-bottom:9px}
.dgtin h4{font-size:1.2rem;margin-bottom:8px}
.dgtin p{font-size:.9rem;color:var(--tx3);line-height:1.62;font-weight:300}
.dgmeta{display:flex;gap:20px;flex-wrap:wrap;margin-top:13px;
  font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--tx4);letter-spacing:.1em}
.dgmeta b{color:var(--tx2)}
.dggrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;
  margin-bottom:16px}
.dgi{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--line);
  border-radius:14px;background:var(--card);opacity:0;transform:translateY(7px);
  transition:.5s var(--e)}
.dgi.on{opacity:1;transform:none}
.dgi .d{width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-top:6px}
.dgi.ok .d{background:#22c55e}.dgi.warn .d{background:#f59e0b}.dgi.fail .d{background:var(--red)}
.dgi .l{font-size:.82rem;font-weight:500;color:var(--tx2);line-height:1.35}
.dgi .v{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--tx4);
  display:block;margin-top:3px}
.dgfix{border:1px solid rgba(239,35,60,.34);border-radius:var(--r-lg);
  background:linear-gradient(140deg,rgba(239,35,60,.1),rgba(255,255,255,.02));padding:22px 24px}
.dgfh{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--red);margin-bottom:16px}
.dgfl{display:flex;gap:15px;padding:12px 0;border-bottom:1px dashed var(--line)}
.dgfl:last-of-type{border-bottom:0}
.dgfl .n{width:24px;height:24px;border-radius:8px;flex-shrink:0;display:grid;place-items:center;
  background:var(--red);color:#fff;font-family:'JetBrains Mono',monospace;font-size:10px}
.dgfl b{display:block;font-size:.92rem;margin-bottom:4px;font-family:Manrope;letter-spacing:-.02em}
.dgfl span{font-size:.85rem;color:var(--tx3);line-height:1.6;font-weight:300}
.dgerr{margin-top:20px;padding:16px 19px;border-radius:var(--r);
  border:1px solid rgba(239,35,60,.4);background:rgba(239,35,60,.08);
  font-size:.88rem;color:var(--tx2);line-height:1.6;display:none;font-weight:300}
.dgerr.on{display:block}
/* kota mesajının yanındaki CTA: dar ekranda taşmasın diye satıra iner ve
   kendi genişliğini içerikten alır (max-width ile kutuyu aşamaz) */
.dgkota-cta{display:inline-flex;margin-top:14px;max-width:100%;white-space:normal;text-align:left}
/* DURUM EKRANI (skor yerine bulgu). Kutu aynı kutu ama kırmızı DEĞİL:
   bu bir arıza değil, ölçülmüş bir bulgu — engel sayfasına kırmızı hata
   rengi vermek, aracın "sende bir şey bozuk" dediği izlenimini verirdi.
   Adres satırı dar ekranda taşımasın diye anywhere ile kırılıyor. */
.dgerr.dgdurum{border-color:rgba(245,158,11,.42);background:rgba(245,158,11,.08)}
.dgdb{font-family:Manrope;font-size:1.02rem;font-weight:600;letter-spacing:-.02em;
  color:var(--tx);margin-bottom:10px;line-height:1.35}
.dgdo{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.06em;
  color:var(--tx3);margin-bottom:4px;overflow-wrap:anywhere}
.dgdu{font-size:.82rem;color:var(--tx3);margin-bottom:13px;overflow-wrap:anywhere;word-break:break-word}
.dgdm{margin:0 0 12px;line-height:1.65}
.dgde{margin:0 0 12px;padding:10px 12px;border-radius:10px;background:rgba(239,35,60,.09);
  border:1px solid rgba(239,35,60,.28);font-size:.84rem;line-height:1.6}
.dgdep{margin:0 0 7px}
.dgdea{display:inline-block;font-size:.8rem;color:var(--tx3);
  text-decoration:underline;text-underline-offset:3px}
.dgdk{margin:0;font-size:.82rem;color:var(--tx3);line-height:1.6}

/* ============ KANAL GENİŞLİĞİ (bento) ============
   Kartlarda kanallar var (Insider referansı); statik markup — tarayıcı
   ve yapay zekâ okusun (GEO). İlk görünüm: ikon + başlık (metin taşması
   imkânsız). Hover/odak: kart flex-grow ile büyür, komşusu daralır,
   açıklama 0fr→1fr ızgara numarasıyla süzülür — yükseklik JS'siz,
   akıcı. Giriş animasyonu aynı blur süzülme; .tin sonrası gecikmeler
   sıfırlanır ki hover geçişleri beklemesin.                            */
.tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;
  align-items:stretch;min-height:clamp(400px,40vw,540px)}
.tcol{display:flex;flex-direction:column;gap:14px;min-width:0}
.tcard{position:relative;display:flex;flex-direction:column;flex:4 1 0;
  border-radius:var(--r);border:1px solid var(--line);padding:24px;
  overflow:hidden;min-height:150px;cursor:default;
  opacity:0;transform:translateY(-18px);filter:blur(10px);
  transition:opacity .6s var(--e) calc(var(--ti,0)*.1s),
    transform .6s var(--e) calc(var(--ti,0)*.1s),
    filter .6s var(--e) calc(var(--ti,0)*.1s),
    flex-grow .55s var(--e),border-color .3s var(--e)}
#sozler.tin .tcard{opacity:1;transform:none;filter:none;transition-delay:0s}
.tcard>*{position:relative;z-index:1}
.tcard.big{flex:7 1 0}.tcard.sml{flex:3 1 0}
.tcard:hover,.tcard:focus-visible{border-color:var(--line2);flex-grow:7.4;outline:none}
.tcard.big:hover,.tcard.big:focus-visible{flex-grow:12}
.tcard.sml:hover,.tcard.sml:focus-visible{flex-grow:10.5}
.tic{flex:none;width:46px;height:46px;border-radius:13px;
  display:flex;align-items:center;justify-content:center}
.tic svg{width:22px;height:22px}
.tcard.big .tic{margin-bottom:auto}
.tct{font-family:Manrope;font-size:clamp(1.06rem,1.15vw,1.2rem);font-weight:700;
  letter-spacing:-.02em;margin:16px 0 0;color:var(--tx)}
.tcard.big .tct{margin-top:20px}
/* açıklama: 0fr ızgarada kapalı başlar, hover'da 1fr'a açılır */
.tcx{display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .55s var(--e)}
.tcx>.tcd{overflow:hidden;min-height:0;opacity:0;transform:translateY(8px);
  transition:opacity .38s var(--e),transform .38s var(--e)}
.tcard:hover .tcx,.tcard:focus-visible .tcx{grid-template-rows:1fr}
.tcard:hover .tcd,.tcard:focus-visible .tcd{opacity:1;transform:none;
  transition-delay:.09s}
.tcd{font-size:clamp(.88rem,.95vw,.95rem);line-height:1.6;font-weight:500;padding-top:8px}
/* sağ üst artı: "burada dahası var" — hover'da 45° dönüp ×'e yaklaşır */
.tmore{position:absolute;top:20px;right:20px;width:26px;height:26px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  border:1px solid var(--line2);color:var(--tx3);
  transition:transform .45s var(--e),color .3s,border-color .3s}
.tmore svg{width:12px;height:12px}
.tcard:hover .tmore,.tcard:focus-visible .tmore{transform:rotate(45deg);
  color:var(--tx);border-color:var(--tx3)}
/* desenli kart — ince çizgi ızgarası + tepeden kızıl ışık, radyal maske */
.t-pat{background:var(--card2)}
.t-pat::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(to right,rgba(255,255,255,.055) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:50px 56px;
  -webkit-mask-image:radial-gradient(ellipse 85% 55% at 50% 0%,#000 60%,transparent 108%);
  mask-image:radial-gradient(ellipse 85% 55% at 50% 0%,#000 60%,transparent 108%)}
.t-pat::after{content:'';position:absolute;inset:0 0 auto;height:60%;pointer-events:none;
  background:radial-gradient(60% 70% at 50% 0%,var(--red-dim),transparent 72%);
  opacity:.75;transition:opacity .4s var(--e)}
.t-pat:hover::after{opacity:1}
.t-pat .tct{color:var(--tx)}
.t-pat .tcd{color:#c9c9ce}
.t-pat .tic{background:var(--red-dim);color:var(--red-soft);
  border:1px solid rgba(239,35,60,.28)}
/* kızıl kart — kızıl zemin, koyu mürekkep */
.t-red{background:var(--red);border-color:rgba(0,0,0,.18)}
.t-red::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.16),transparent 42%)}
.t-red .tct{color:#0a0a0a}
.t-red.hasimg{background:#8f0f21}
.t-red.hasimg .tct{color:var(--tx)}
.t-red.hasimg .tcd{color:#f0dfe2}
.t-red.hasimg .tic{background:rgba(0,0,0,.62);color:#fff;border:1px solid rgba(255,255,255,.18)}
.t-red.hasimg .tmore{border-color:rgba(255,255,255,.34);color:rgba(255,255,255,.72)}
.t-red.hasimg:hover .tmore,.t-red.hasimg:focus-visible .tmore{color:#fff;border-color:rgba(255,255,255,.7)}
.t-red .tcd{color:rgba(0,0,0,.72)}
.t-red .tic{background:#0a0a0a;color:#fff}
.t-red .tmore{border-color:rgba(0,0,0,.3);color:rgba(0,0,0,.6)}
.t-red:hover .tmore,.t-red:focus-visible .tmore{color:#0a0a0a;
  border-color:rgba(0,0,0,.55)}
/* koyu kart */
.t-drk{background:var(--card)}
.t-drk .tct{color:var(--tx)}
.t-drk .tcd{color:#c9c9ce}
.t-drk .tic{background:var(--card2);border:1px solid var(--line2);color:var(--tx2)}
/* alt cetvel: uçlarında kare olan ince çizgi */
.trule{position:relative;height:1px;background:var(--line2);
  margin-top:clamp(30px,4vw,46px)}
.trule::before,.trule::after{content:'';position:absolute;top:50%;width:9px;height:9px;
  transform:translateY(-50%);background:var(--bg);border:1px solid var(--line2)}
.trule::before{left:-4px}.trule::after{right:-4px}

/* ===== KANAL KARTI GÖRSELLERİ =====
   Görsel kartın ATMOSFERİ, konusu değil: her zaman perde altında durur,
   metin her koşulda okunur kalır. Altı görselin de konusu sağ tarafta,
   sol üçte biri sessiz — perde de o yüzden soldan sağa açılıyor.
   DİKKAT: .tcard>*{z-index:1} kuralı var; katman ondan daha özgül
   (.tcard>.tbg) yazıldı, yoksa görsel metnin ÜSTÜNE biner. */
.tcard>.tbg{position:absolute;inset:0;z-index:0;border-radius:inherit;
  pointer-events:none;overflow:hidden;background-size:cover;
  background-repeat:no-repeat;background-position:58% 48%;
  opacity:0;transform:scale(1.01);
  transition:opacity .55s var(--e),transform .55s var(--e)}
.tcard.hasimg>.tbg{opacity:.94}
.tcard.hasimg:hover>.tbg,.tcard.hasimg:focus-visible>.tbg{opacity:1;transform:scale(1.05)}

/* Perde. Kırmızı kartta KIRMIZIDAN açılır — siyahtan açılsa kartın üstünde
   koyu bir leke gibi durur; kırmızıdan açılınca görsel kartın içinden
   çıkmış gibi olur. Şeffaf uçlar rgba ile yazıldı: "transparent" bazı
   tarayıcılarda griden geçip kirli bir kenar bırakıyor. */
.tcard>.tbg::after{content:'';position:absolute;inset:0}
.t-drk.hasimg>.tbg::after,.t-pat.hasimg>.tbg::after{
  background:linear-gradient(101deg,rgba(10,10,11,.97) 0%,rgba(10,10,11,.88) 32%,rgba(10,10,11,.42) 82%),
             linear-gradient(0deg,rgba(10,10,11,.84) 0%,rgba(10,10,11,0) 62%),
             rgba(10,10,11,.38)}
.t-red.hasimg>.tbg::after{
  background:linear-gradient(101deg,rgba(143,15,33,.97) 0%,rgba(143,15,33,.88) 32%,rgba(143,15,33,.42) 82%),
             linear-gradient(0deg,rgba(143,15,33,.84) 0%,rgba(143,15,33,0) 62%),
             rgba(143,15,33,.38)}

/* Görsel varken dekoratif katmanlar susar: ızgara deseni, kızıl hale ve
   üst parlaklık görselin kendi dokusuyla üst üste binip bulanıklaştırıyor.
   Enes: "sırıtmasın, bir bütün olarak yerli yerinde dursun." */
.t-pat.hasimg::before,.t-pat.hasimg::after,.t-red.hasimg::before{display:none}

/* Her görselin konusu farklı yerde — odak noktası kart kart ayarlı. */
.tcard[data-ci="0"]>.tbg{background-position:63% 40%}   /* arama: parlak çubuk üstte */
.tcard[data-ci="1"]>.tbg{background-position:64% 50%}   /* akış: paneller sağda */
.tcard[data-ci="2"]>.tbg{background-position:54% 52%}   /* havuz: ortada */
.tcard[data-ci="3"]>.tbg{background-position:60% 56%}   /* çubuklar: zemine yakın */
.tcard[data-ci="4"]>.tbg{background-position:56% 48%}   /* patlama: ortada */
.tcard[data-ci="5"]>.tbg{background-position:57% 40%}   /* düğüm: merkezin üstü */

/* MOBİL: kart tam genişlik, kısa ve açıklama HEP AÇIK — yani görselin
   üstünde çok daha fazla metin var. Perde sertleşir, odak sağa kayar ki
   sol taraf tamamen metne kalsın. Aynı kural hover'sız cihazlarda da
   geçerli: orada da açıklama kapanmıyor. */
@media(max-width:900px),(hover:none){
  .tcard.hasimg>.tbg{opacity:.8;background-position:76% 50%!important}
  .tcard.hasimg:hover>.tbg{transform:none}
  .t-drk.hasimg>.tbg::after,.t-pat.hasimg>.tbg::after{
    background:linear-gradient(101deg,rgba(10,10,11,.98) 0%,rgba(10,10,11,.93) 46%,rgba(10,10,11,.6) 100%),
               rgba(10,10,11,.42)}
  .t-red.hasimg>.tbg::after{
    background:linear-gradient(101deg,rgba(143,15,33,.98) 0%,rgba(143,15,33,.92) 46%,rgba(143,15,33,.6) 100%),
               rgba(143,15,33,.42)}
}
@media(max-width:520px){
  .tcard.hasimg>.tbg{opacity:.68;background-position:82% 50%!important}
}
@media(prefers-reduced-motion:reduce){
  .tcard>.tbg{transition:none}
  .tcard.hasimg:hover>.tbg,.tcard.hasimg:focus-visible>.tbg{transform:none}
}
@media(max-width:900px){
  .tgrid{grid-template-columns:1fr;min-height:0;gap:12px}
  .tcol{gap:12px}
  .tcard,.tcard.big,.tcard.sml{flex:none;min-height:0;padding:22px 18px}
  .tcard.big .tic{margin-bottom:0}
  .tcard.big .tct{margin-top:16px}
  .tcx{grid-template-rows:1fr}
  .tcx>.tcd{opacity:1;transform:none}
  .tmore{display:none}
}
@media(hover:none){
  .tcx{grid-template-rows:1fr}
  .tcx>.tcd{opacity:1;transform:none}
  .tmore{display:none}
  .tcard,.tcard.big,.tcard.sml{flex:1 1 auto;min-height:0}
}
@media(prefers-reduced-motion:reduce){
  .tcard,.tcx,.tcx>.tcd,.tmore{transition:none}
  .tcard,.tcard.big,.tcard.sml{opacity:1;transform:none;filter:none;flex:1 1 auto;min-height:0}
  .tcx{grid-template-rows:1fr}
  .tcx>.tcd{opacity:1;transform:none}
}
/* ============ SÖZ BANDI (ince) ============
   Eski kırmızı bandın inceltilmiş hâli: yarı dolgu, küçük tip, küçük
   avatar. Veri yine C.testimonials; boşsa bant kendini gizler.         */
/* 2026-08: panelden kapatılabilir. Varsayılan KAPALI — sitedeki üç söz
   uydurmaydı. Gizleme display:none ile; bölüm DOM'da kalıyor, çünkü
   kanonik bölüm dizisi (kural 74) main'in çocuklarını sayıyor.
   !important ZORUNLU — pazarlık konusu değil: #sozband bir rota bölümü
   (`section.pg.on`) ve satır 2429'daki `display:block!important` bunu
   ezer. !important'siz yazıldığında kural sessizce ölür; özgüllük daha
   yüksek olsa bile !important her zaman kazanır. Bu yamanın ilk hâli
   tam olarak böyle ölü çıktı: veri on:0'dı, sınıf basılıyordu, bant
   yine de görünüyordu. Aynı sebeple render() boş veri gizlemesini
   setProperty(...,'important') ile yapıyor (bkz. satır ~9854).       */
html.t-nosoz #sozband{display:none!important}
.tband{background:var(--red);padding:clamp(28px,3.6vw,50px) 0;
  position:relative;overflow:hidden}
.tband::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.14;
  background-image:radial-gradient(circle at 1px 1px,#000 1px,transparent 0);
  background-size:5px 5px}
.tband .wrap{position:relative;z-index:2;text-align:center}
.tbq{font-family:Manrope;font-size:clamp(1.02rem,2.1vw,1.4rem);font-weight:700;
  letter-spacing:-.03em;line-height:1.35;color:#0a0a0a;max-width:52ch;
  margin:0 auto 16px}
.tbm{display:inline-flex;align-items:center;gap:12px}
.tbav{width:38px;height:38px;border-radius:50%;background:#0a0a0a;color:#fff;
  display:grid;place-items:center;font-family:Manrope;font-weight:700;
  font-size:.8rem;overflow:hidden;flex-shrink:0}
.tbav img{width:100%;height:100%;object-fit:cover}
.tbm .who{text-align:left}
.tbm .who b{display:block;font-family:Manrope;font-size:.92rem;font-weight:700;
  color:#0a0a0a;letter-spacing:-.02em}
.tbm .who span{font-size:.78rem;color:rgba(0,0,0,.62);font-weight:500}
.tbnav{display:flex;gap:0;justify-content:center;margin-top:6px}
/* Dokunma hedefi — WCAG 2.5.8 en az 24x24 CSS piksel ister; nokta 7px'ti,
   yani hedef alan da 7x7'ydi. Nokta ::before'a alındı, düğmenin kendisi
   24x24 görünmez hedef oldu. Görünen tasarım aynı, yalnız noktalar arası
   boşluk 14px'ten 24px'e çıktı.                                          */
.tbnav button{width:24px;height:24px;background:none;border:0;padding:0;
  border-radius:50%;position:relative;cursor:pointer}
.tbnav button::before{content:'';position:absolute;left:50%;top:50%;
  width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;
  background:rgba(0,0,0,.24);transition:.3s var(--e)}
.tbnav button.on::before{background:#0a0a0a;width:22px;margin-left:-11px;
  border-radius:99px}

/* ============ KURUCU ============ */
/* ---- kinetik ekip satırları (referans: kinetic-team-hybrid) ----
   Dev isim satırı + indeks; masaüstünde imleci yaylı takip eden yüzen
   fotoğraf kartı, tıklayınca açılan akordeonda biyografi + bağlantılar.
   Veri güdümlü: panelden ikinci kişi eklenirse liste kendiliğinden uzar. */
.kteam{border-top:1px solid var(--line)}
.krow{border-bottom:1px solid var(--line)}
.krow-h{width:100%;display:flex;align-items:center;gap:clamp(18px,3vw,48px);
  padding:clamp(26px,4vw,46px) 4px;text-align:left;cursor:pointer;
  transition:padding .5s var(--e)}
.krow-h:hover{padding-left:16px}
.knum{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;
  color:var(--tx4);flex:none}
.kname{font-family:Manrope;font-size:clamp(1.7rem,5.2vw,3.6rem);font-weight:600;
  letter-spacing:-.04em;color:var(--tx3);line-height:1.05;flex:1;min-width:0;
  transition:color .35s var(--e)}
.krow-h:hover .kname,.krow.open .kname{color:var(--tx)}
/* biri seçiliyken diğerleri söner (çok kişide devreye girer) */
@media(hover:hover){.kteam:hover .krow:not(:hover):not(.open) .kname{color:rgba(255,255,255,.22)}}
.krole{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);flex:none;max-width:34%;text-align:right;
  transition:color .35s var(--e)}
.krow-h:hover .krole,.krow.open .krole{color:var(--red-soft)}
/* açma/kapama: artı → eksi */
.ktog{position:relative;width:30px;height:30px;flex:none;border-radius:50%;
  border:1px solid var(--line2);transition:.35s var(--e)}
.ktog i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:var(--tx3);border-radius:2px;font-style:normal;transition:.35s var(--e)}
.ktog i:first-child{width:11px;height:1.5px}
.ktog i:last-child{width:1.5px;height:11px}
.krow.open .ktog{border-color:var(--red);transform:rotate(90deg)}
.krow.open .ktog i:last-child{opacity:0}
.krow.open .ktog i{background:var(--red-soft)}
/* akordeon gövde: grid-rows hilesi — yükseklik animasyonu kompozitörsüz ama ucuz */
.krow-b{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--e)}
.krow.open .krow-b{grid-template-rows:1fr}
.krow-bi{overflow:hidden;display:grid;grid-template-columns:260px 1fr;
  gap:clamp(24px,4vw,52px);align-items:start;
  opacity:0;transform:translateY(10px);transition:.45s var(--e) .08s}
.krow.open .krow-bi{opacity:1;transform:none}
.krow-bi>*{margin-bottom:clamp(26px,4vw,46px)}
.kph{position:relative;aspect-ratio:4/5;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--line);
  background:linear-gradient(150deg,rgba(239,35,60,.16),rgba(255,255,255,.03))}
.kph img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;
  transition:filter .6s var(--e)}

.kph .mk{position:absolute;inset:0;display:grid;place-items:center;font-family:Manrope;
  font-size:3rem;font-weight:700;color:rgba(255,255,255,.08)}
/* proje detay kapağı — eskiden .fndph'e yaslanıyordu, artık kendi kabuğu var */
.pdhero{position:relative;aspect-ratio:16/7;margin-bottom:38px;border-radius:var(--r-xl);
  overflow:hidden;border:1px solid var(--line);
  background:linear-gradient(150deg,rgba(239,35,60,.14),rgba(255,255,255,.03))}
.pdhero img{width:100%;height:100%;object-fit:cover;filter:grayscale(.3) contrast(1.06)}
.pdhero .mk{position:absolute;inset:0;display:grid;place-items:center;font-family:Manrope;
  font-size:clamp(2.6rem,6vw,4.4rem);font-weight:700;color:rgba(255,255,255,.08)}
.kbio p{font-size:1rem;color:var(--tx2);line-height:1.78;margin-bottom:15px;font-weight:300;
  max-width:62ch}
.klinks{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.klinks a{padding:9px 18px;border-radius:999px;border:1px solid var(--line2);
  font-size:.85rem;font-weight:500;transition:.28s var(--e)}
.klinks a:hover{border-color:var(--red);color:var(--red);background:var(--red-dim)}
/* --- masaüstü: imleci yaylı takip eden yüzen kart --- */
#kcard{position:fixed;left:0;top:0;z-index:80;pointer-events:none;
  opacity:0;transition:opacity .25s var(--e)}
#kcard.on{opacity:1}
#kcard .kc-in{width:290px;height:216px;border-radius:16px;overflow:hidden;position:relative;
  border:1px solid rgba(255,255,255,.12);background:#101012;
  box-shadow:0 34px 80px -24px rgba(0,0,0,.85),0 0 0 1px rgba(239,35,60,.08)}
#kcard .kc-ph{position:absolute;inset:0;display:grid;place-items:center;
  background:linear-gradient(150deg,rgba(239,35,60,.2),rgba(255,255,255,.03))}
#kcard .kc-ph img{width:100%;height:100%;object-fit:cover;object-position:50% 27%}
#kcard .kc-ph .mk{font-family:Manrope;font-size:3.4rem;font-weight:700;
  color:rgba(255,255,255,.1)}
#kcard .kc-ft{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:8px;
  padding:12px 14px;background:linear-gradient(0deg,rgba(4,4,5,.86),transparent)}
#kcard .kc-ft i{width:6px;height:6px;border-radius:50%;background:var(--red);font-style:normal;
  box-shadow:0 0 8px rgba(239,35,60,.9);animation:kping 1.8s ease-in-out infinite}
@keyframes kping{0%,100%{opacity:1}50%{opacity:.35}}
#kcard .kc-ft b{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.22em;
  text-transform:uppercase;color:rgba(255,255,255,.82);font-weight:400}
@media(max-width:820px){
  .krow-bi{grid-template-columns:1fr}
  .kph{max-width:300px}
  .krole{display:none}
  #kcard{display:none}}

/* ============ SSS ============ */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:24px 4px;display:flex;
  align-items:center;gap:20px;transition:.3s var(--e)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{padding-left:12px}
.faq summary span{flex:1;font-family:Manrope;font-size:clamp(1rem,1.8vw,1.24rem);
  font-weight:600;letter-spacing:-.03em}
.faq summary i{width:30px;height:30px;border-radius:50%;border:1px solid var(--line2);
  flex-shrink:0;position:relative;transition:.35s var(--e)}
.faq summary i::before,.faq summary i::after{content:'';position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);background:var(--tx3);border-radius:2px;transition:.35s var(--e)}
.faq summary i::before{width:11px;height:1.5px}
.faq summary i::after{width:1.5px;height:11px}
.faq details[open] summary i{border-color:var(--red);background:var(--red-dim)}
.faq details[open] summary i::before,.faq details[open] summary i::after{background:var(--red)}
.faq details[open] summary i::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0}
.faq .ans{padding:0 60px 26px 4px;font-size:.95rem;color:var(--tx2);line-height:1.76;
  font-weight:300;max-width:74ch}

/* ============ CTA + FOOTER ============ */
.cta{text-align:center;padding:clamp(80px,11vw,150px) 0}
.cta h2{font-size:clamp(2.4rem,7vw,5.4rem);margin-bottom:22px;letter-spacing:-.055em}
.cta h2 em{font-style:normal;color:var(--red)}
.cta p{font-size:clamp(1rem,1.6vw,1.2rem);color:var(--tx3);font-weight:300;
  max-width:52ch;margin:0 auto 38px;line-height:1.7}
.ctarow{display:flex;gap:13px;justify-content:center;flex-wrap:wrap}
footer{border-top:1px solid var(--line);padding:clamp(50px,6vw,80px) 0 30px;position:relative;
  overflow:hidden}
.fgrid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:clamp(24px,4vw,56px);
  margin-bottom:clamp(40px,6vw,72px)}
.fgrid .lead p{font-size:.92rem;color:var(--tx3);line-height:1.7;max-width:34ch;
  margin-top:18px;font-weight:300}
.fcol h5{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--red);margin-bottom:18px;font-weight:500}
.fcol a,.fcol button{display:block;font-size:.9rem;color:var(--tx3);margin-bottom:11px;
  transition:color .26s;text-align:left}
.fcol a:hover,.fcol button:hover{color:var(--tx)}
.watermark{text-align:center;padding:clamp(6px,1.4vw,14px) 0 clamp(18px,2.8vw,32px);
  pointer-events:none;user-select:none;overflow:hidden}
.watermark canvas{display:inline-block;max-width:100%;height:auto;vertical-align:top}
.vh{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.fbot{border-top:1px solid var(--line);padding-top:24px;display:flex;
  justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tx4)}
.fbot a:hover{color:var(--tx3)}
.fbot .r{display:flex;gap:22px;flex-wrap:wrap}
@media(max-width:760px){.fgrid{grid-template-columns:1fr;gap:32px}}

/* ============ BÜLTEN ============ */
.bkgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:clamp(14px,1.6vw,20px)}
.bkc{display:flex;flex-direction:column;gap:11px;border:1px solid var(--line);
  border-radius:var(--r);padding:clamp(20px,2.4vw,28px);color:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.006));
  transition:border-color .34s var(--e),transform .34s var(--e),box-shadow .34s var(--e)}
.bkc:hover{border-color:rgba(239,35,60,.42);transform:translateY(-3px);
  box-shadow:0 26px 60px -34px var(--red-glow)}
.bkc .m{display:flex;align-items:center;gap:10px;font-family:'JetBrains Mono',monospace;
  font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--tx4)}
.bkc .m b{color:var(--red-soft);font-weight:500}
.bkc .m i{width:3px;height:3px;border-radius:50%;background:var(--tx4);font-style:normal}
.bkc h3{font-family:'Playfair Display',Georgia,serif;font-weight:400;
  font-size:clamp(1.14rem,1.7vw,1.38rem);line-height:1.24;letter-spacing:-.01em}
.bkc p{font-size:.88rem;line-height:1.68;color:var(--tx3);font-weight:300}
.bkc .go{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:8px;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--tx3);transition:color .3s var(--e)}
.bkc .go svg{width:13px;height:13px;transition:transform .3s var(--e)}
.bkc:hover .go{color:var(--red-soft)}
.bkc:hover .go svg{transform:translateX(4px)}

/* abone kutusu */
.bksub{margin-top:clamp(28px,3.6vw,48px);display:grid;grid-template-columns:1fr auto;
  gap:clamp(18px,3vw,40px);align-items:center;border:1px solid var(--line);
  border-radius:var(--r-lg);padding:clamp(22px,3vw,36px);
  background:radial-gradient(80% 100% at 100% 0%,rgba(239,35,60,.10),transparent 62%),
             linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.006))}
.bksub h4{font-family:Manrope;font-size:1.05rem;font-weight:700;letter-spacing:-.03em;
  margin-bottom:6px}
.bksub .t p{font-size:.86rem;color:var(--tx3);font-weight:300;max-width:44ch}
.bksub form{position:relative;display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.bksub input[type=email]{width:min(280px,60vw);padding:13px 15px;border-radius:12px;
  background:rgba(0,0,0,.45);border:1px solid var(--line2);color:var(--tx);font:inherit;
  font-size:.92rem;outline:0;transition:border-color .26s var(--e),box-shadow .26s var(--e)}
.bksub input[type=email]::placeholder{color:var(--tx4)}
.bksub input[type=email]:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(239,35,60,.15)}
.submsg{flex-basis:100%;font-size:.82rem;color:var(--tx3);min-height:1.2em}
.submsg.err{color:var(--red-soft)}
@media(max-width:860px){.bksub{grid-template-columns:1fr}}

/* yazı sayfası */
.nart{max-width:760px;margin:0 auto}
.nmeta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--tx4);margin-bottom:20px}
.nmeta span:first-child{color:var(--red-soft)}
.nmeta i{width:3px;height:3px;border-radius:50%;background:var(--tx4);font-style:normal}
.nart h1{font-family:'Playfair Display',Georgia,serif;font-weight:400;
  font-size:clamp(1.8rem,3.8vw,2.9rem);line-height:1.14;letter-spacing:-.022em;
  margin-bottom:20px}
.nlede{font-size:clamp(1rem,1.4vw,1.14rem);line-height:1.72;color:var(--tx2);
  font-weight:300;margin-bottom:clamp(28px,3.6vw,44px);
  padding-bottom:clamp(24px,3vw,36px);border-bottom:1px solid var(--line)}
.nbody h3{font-family:Manrope;font-weight:700;font-size:clamp(1.1rem,1.7vw,1.35rem);
  letter-spacing:-.03em;margin:clamp(30px,3.6vw,44px) 0 14px}
.nbody h3:first-child{margin-top:0}
.nbody p{font-size:1rem;line-height:1.82;color:var(--tx2);font-weight:300;margin-bottom:16px}
.nbody b{color:#fff;font-weight:600}
.nbody ul{margin:0 0 18px 0;padding:0;list-style:none}
.nbody li{position:relative;padding-left:22px;font-size:.96rem;line-height:1.75;
  color:var(--tx2);font-weight:300;margin-bottom:9px}
.nbody li::before{content:'';position:absolute;left:2px;top:.72em;width:6px;height:6px;
  border-radius:50%;background:var(--red);opacity:.7}
.nfig{margin:24px 0;padding:20px 24px;border-radius:16px;border:1px solid rgba(239,35,60,.3);
  background:radial-gradient(70% 100% at 0% 0%,rgba(239,35,60,.12),transparent 66%)}
.nfig b{display:block;font-family:Manrope;font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:800;
  letter-spacing:-.045em;color:var(--red-soft);line-height:1;margin-bottom:7px}
.nfig span{font-size:.84rem;color:var(--tx3);font-weight:300}
.nsrc{margin-top:clamp(32px,4vw,52px);padding-top:22px;border-top:1px solid var(--line)}
.nsrc h5{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);margin-bottom:12px;font-weight:400}
.nsrc a,.nsrc span{display:block;font-size:.84rem;color:var(--tx3);line-height:1.6;
  margin-bottom:7px;transition:color .26s var(--e)}
.nsrc a:hover{color:var(--red-soft)}
.nnext{margin-top:clamp(30px,4vw,48px);padding-top:24px;border-top:1px solid var(--line)}
.nnext .k{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);display:block;margin-bottom:10px}
.nnext a{font-family:'Playfair Display',Georgia,serif;font-size:1.3rem;line-height:1.24;
  display:inline-flex;align-items:baseline;gap:10px;transition:color .3s var(--e)}
.nnext a:hover{color:var(--red-soft)}

/* filtre çipleri */
.bkf{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:clamp(18px,2.4vw,28px)}
.bkf button{display:inline-flex;align-items:center;gap:9px;padding:9px 16px;border-radius:999px;
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--tx3);
  font-size:.82rem;cursor:pointer;transition:.28s var(--e);white-space:nowrap}
.bkf button:hover{color:var(--tx2);border-color:var(--line2)}
.bkf button.on{background:rgba(239,35,60,.12);border-color:rgba(239,35,60,.42);color:#fff}
.bkf button em{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9.5px;color:var(--tx4)}
.bkf button.on em{color:var(--red-soft)}

/* yazı altındaki kayan şerit */
.nrail{margin-top:clamp(30px,4vw,50px);padding-top:24px;border-top:1px solid var(--line)}
.nrhead .k{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.2em;
  text-transform:uppercase;color:var(--tx4);display:block;margin-bottom:14px}
.nrbody{position:relative;display:flex;align-items:center;gap:10px}
.nrtrack{flex:1;min-width:0;display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;
  scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px}
.nrtrack::-webkit-scrollbar{display:none}
.nrcard{flex:0 0 min(268px,72vw);scroll-snap-align:start;display:flex;flex-direction:column;
  gap:8px;padding:16px 17px;border:1px solid var(--line);border-radius:14px;color:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.006));
  transition:border-color .3s var(--e),transform .3s var(--e)}
.nrcard:hover{border-color:rgba(239,35,60,.45);transform:translateY(-2px)}
.nrcard .m{font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--red-soft)}
.nrcard h4{font-family:'Playfair Display',Georgia,serif;font-weight:400;font-size:1rem;
  line-height:1.3;letter-spacing:-.01em}
.nrcard span.d{font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.12em;
  color:var(--tx4);margin-top:auto;padding-top:6px}
/* robotik ok: köşesi kesik kare, ince şevron */
.nrbtn{flex:none;width:40px;height:40px;display:grid;place-items:center;cursor:pointer;
  border:1px solid var(--line2);color:var(--tx3);background:rgba(255,255,255,.03);
  clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,9px 100%,0 calc(100% - 9px));
  transition:.28s var(--e)}
.nrbtn:hover:not(:disabled){color:#fff;border-color:var(--red);background:rgba(239,35,60,.14);
  box-shadow:0 0 18px -4px var(--red-glow)}
.nrbtn:disabled{opacity:.28;cursor:default}
.nrbtn svg{width:16px;height:16px}
.nrbtn.prev svg{transform:rotate(180deg)}
@media(max-width:640px){.nrbtn{display:none}.nrtrack{scroll-snap-type:x proximity}}

/* ============ DEMO TALEP FORMU ============ */
#lead{padding:0 0 clamp(50px,7vw,90px)}
.ldbox{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,60px);
  border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(26px,4vw,54px);
  background:radial-gradient(88% 100% at 0% 0%,rgba(239,35,60,.10),transparent 62%),
             linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.006))}
.ldt h2{font-size:clamp(1.55rem,3vw,2.4rem);letter-spacing:-.04em;margin:14px 0 14px}
.ldt h2 em{font-style:normal;color:var(--red)}
.ldt p{color:var(--tx3);font-size:.92rem;line-height:1.72;font-weight:300;max-width:40ch}
.ldf{position:relative;display:flex;flex-direction:column;gap:14px}
.fld{display:block}
.fld>span{display:block;font-family:'JetBrains Mono',monospace;font-size:9px;
  letter-spacing:.18em;text-transform:uppercase;color:var(--tx4);margin-bottom:7px}
.fld input,.fld textarea{width:100%;padding:13px 15px;border-radius:12px;background:rgba(0,0,0,.45);
  border:1px solid var(--line2);color:var(--tx);font:inherit;font-size:.94rem;
  outline:0;transition:border-color .26s var(--e),box-shadow .26s var(--e)}
.fld input::placeholder,.fld textarea::placeholder{color:var(--tx4)}
.fld input:focus,.fld textarea:focus{border-color:var(--red);box-shadow:0 0 0 3px rgba(239,35,60,.15)}
.fld textarea{resize:vertical;min-height:82px;line-height:1.55;font-family:inherit}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:.79rem;color:var(--tx3);
  line-height:1.55;cursor:pointer;margin-top:2px}
.chk input{margin-top:3px;accent-color:var(--red);width:15px;height:15px;flex:none}
.ldf>button{align-self:flex-start;margin-top:4px}
.ldmsg{font-size:.83rem;color:var(--tx3);min-height:1.3em}
.ldmsg.err{color:var(--red-soft)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;opacity:0}
.ldok{text-align:center;padding:10px 0}
.ldok .tick{width:52px;height:52px;border-radius:50%;margin:0 auto 16px;display:grid;
  place-items:center;background:var(--red-dim);border:1px solid rgba(239,35,60,.4);
  color:var(--red-soft)}
.ldok .tick svg{width:24px;height:24px}
.ldok h4{font-family:Manrope;font-size:1.12rem;font-weight:700;letter-spacing:-.03em;
  margin-bottom:9px}
.ldok p{color:var(--tx3);font-size:.87rem;line-height:1.66;margin-bottom:20px;
  max-width:38ch;margin-left:auto;margin-right:auto}
@media(max-width:820px){.ldbox{grid-template-columns:1fr}}

/* ============ SAYFA YÖNLENDİRME ============ */
section.pg{display:none!important}
section.pg.on{display:block!important;animation:pgin .55s var(--e)}
section#hero.pg.on{display:flex!important}
@keyframes pgin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
body.sub main>section.on:first-of-type{padding-top:clamp(140px,15vw,190px)}
.pgback{display:inline-flex;align-items:center;gap:9px;font-size:.82rem;color:var(--tx4);
  margin-bottom:26px;transition:.26s}
.pgback:hover{color:var(--red)}
.pgback svg{width:14px;height:14px}
body:not(.sub) .pgback{display:none}

/* ============ MOBİL ============ */
@media(max-width:980px){
  .nlinks{display:none}
  .burger{display:flex;position:relative;z-index:51}
  .secs{gap:9px}
}
@media(max-width:520px){
  .langs{display:none}
  .navin{padding:9px 9px 9px 16px}
}

/* ============ MOBİL TAM EKRAN MENÜ (InsiderOne referansı) ============ */
#mmenu{position:fixed;inset:0;z-index:70;display:none;flex-direction:column;
  background:linear-gradient(180deg,#0b0b0c,#070708);
  padding:calc(12px + env(safe-area-inset-top)) 20px calc(18px + env(safe-area-inset-bottom));
  opacity:0;pointer-events:none;
  clip-path:inset(0 0 100% 0);
  transition:clip-path .55s var(--e),opacity .35s var(--e)}
#mmenu.open{opacity:1;pointer-events:auto;clip-path:inset(0 0 0% 0)}
#mmenu .mmtop{display:flex;align-items:center;justify-content:space-between;
  padding:6px 0 14px}
#mmenu .mmx{width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  border-radius:10px;color:var(--tx)}
#mmenu .mmx svg{width:20px;height:20px}
#mmenu .mmlinks{flex:1;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;
  border-top:1px solid var(--line)}
#mmenu .mmlinks a{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:17px 2px;border-bottom:1px solid var(--line);
  font-family:Manrope;font-size:1rem;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;color:var(--tx);
  opacity:0;transform:translateY(16px)}
#mmenu .mmlinks a svg{width:14px;height:14px;color:var(--tx4);flex:none}
#mmenu.open .mmlinks a{animation:mmrow .5s var(--e) forwards;
  animation-delay:calc(.14s + var(--i,0)*.05s)}
#mmenu .mlg{display:flex;align-items:center;justify-content:space-between;
  padding:17px 2px;border-bottom:1px solid var(--line);
  font-family:Manrope;font-size:1rem;font-weight:600;letter-spacing:.13em;
  text-transform:uppercase;color:var(--tx3);
  opacity:0;transform:translateY(16px)}
#mmenu.open .mlg{animation:mmrow .5s var(--e) forwards;animation-delay:.54s}
#mmenu .mlg span{display:flex;gap:6px}
#mmenu .mlg button{min-height:40px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);
  font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;
  color:var(--tx3);transition:.24s}
#mmenu .mlg button.on{background:rgba(255,255,255,.1);color:var(--tx);
  border-color:var(--line2)}
#mmenu .mmcta{display:flex;flex-direction:column;gap:10px;padding-top:16px;
  opacity:0;transform:translateY(16px)}
#mmenu.open .mmcta{animation:mmrow .5s var(--e) forwards;animation-delay:.6s}
#mmenu .mmcta .btn{width:100%;min-height:54px;justify-content:center;text-align:center;
  font-size:.96rem}
#mmenu .btn-w{background:#fff;color:#0a0a0b}
#mmenu .btn-w:hover{background:#ececec}
@keyframes mmrow{to{opacity:1;transform:none}}
@media(max-width:980px){#mmenu{display:flex}}

/* ============ MOBİL DÜZELTMELER (Ağu 2026) ============ */
@media(max-width:900px){
  /* hero rozeti mobilde kaldırıldı */
  #hero .pill{display:none}
  /* sıra: başlık → paragraf → durum satırı → butonlar */
  .heroin{display:flex;flex-direction:column;align-items:center}
  .heroin h1{order:1}
  .heroin .lede{order:2}
  .heroin .hmeta{order:3;margin-top:22px}
  .heroin .hcta{order:4;margin-top:20px}
  /* nav kartı kompakt — eller nav'ın altında başlıyor */
  .navin{padding:8px 8px 8px 15px}
  .logo i img{height:25px}
  .logo b{font-size:.98rem}
  /* butonlar tek standart: aynı boy, yazı ortada */
  .hcta{width:100%;flex-direction:column;align-items:center;gap:11px}
  .hcta .void,.hcta .btn{width:min(340px,100%);min-height:54px;
    padding:0 24px;justify-content:center;text-align:center}
  .ctarow .btn{width:min(340px,100%);min-height:54px;padding:0 24px;
    justify-content:center;text-align:center}
}
@media(max-width:640px){
  /* buton kuralı: her buton bulunduğu bölümün genişliğini alır, yazı ortada.
     İstisnalar bilinçli: nav çipleri, dil düğmeleri, kart içi metin linkleri. */
  .btn,.void,.shiny{width:100%;min-height:52px;padding:0 22px;
    justify-content:center;text-align:center}
  .void{min-height:54px}
  .shiny{min-height:54px}
  .hcta .void,.hcta .btn,.ctarow .btn{width:100%}
  .skcta{flex-direction:column;align-items:stretch}
  .dgform{flex-direction:column}
  .dgin{min-width:0;width:100%;min-height:52px}
  .nright .btn{display:none}
}


/* ============ PREMIUM HİS (Apple design skill denetimi) ============ */
/* 1) Tepki basış ANINDA gelir, bırakınca değil — gecikme hissi ölümdür.
   Ölçek küçük (%2-3) ve geçiş hızlı: dokunulabilirlik, gösteri değil. */
html{-webkit-tap-highlight-color:transparent}
.btn,.void,.shiny,.mc,.sc,.langs button,.mmlinks a,.krow-h,.mmcta .btn,
#mmenu .mlg button,.klinks a,.dgform .btn,.nrbtn{
  transition-property:transform,background,color,border-color,box-shadow,opacity,padding;
  transition-duration:.26s;transition-timing-function:var(--e)}
.btn:active,.void:active,.shiny:active,.mc:active,.sc:active,
.langs button:active,#mmenu .mlg button:active,.klinks a:active,.nrbtn:active{
  transform:scale(.965);transition-duration:.08s}
.mmlinks a:active{transform:translateX(4px);transition-duration:.08s}
.krow-h:active .kname{color:var(--tx)}
.mi:active .mi-t,.dk:active .dkin{transform:scale(.985);transition:transform .1s ease-out}

/* 2) Cam malzeme ışığı yakalar: nav hapının üst kenarında ince parlaklık */
.navin{box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 12px 40px -18px rgba(0,0,0,.6)}

/* 3) Klavye ile gezen için odak halkası — fare tıklarında görünmez */
:focus{outline:none}
:focus-visible{outline:2px solid var(--red-soft);outline-offset:3px;border-radius:4px}
.btn:focus-visible,.void:focus-visible,.shiny:focus-visible{outline-offset:4px}

/* 4) Erişilebilirlik sinyalleri: şeffaflık/kontrast azaltma tercihi */
@media (prefers-reduced-transparency:reduce){
  .navin{background:rgba(10,10,11,.97);backdrop-filter:none;-webkit-backdrop-filter:none}
  #mmenu{background:#0a0a0b}}
@media (prefers-contrast:more){
  .btn-g,.void{border-color:rgba(255,255,255,.5)}
  .nlinks a,.krole,.knum{color:var(--tx2)}}

/* 5) Seçim rengi markayla ama okunur kalır */
::selection{background:rgba(239,35,60,.85);color:#fff}

/* ============ AKIŞ GALERİSİ — sabit bölüm, sürükle/ok ile kayar ============ */
#akis .akpin{padding:0}
#akis .akhead{display:flex;align-items:flex-end;justify-content:space-between;
  gap:24px;margin-bottom:clamp(26px,3vw,40px)}
#akis .akhead p{max-width:56ch}
.aknav{display:flex;gap:10px;flex:none;padding-bottom:6px}
.aknav button{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  border:1px solid var(--line2);color:var(--tx2);background:rgba(255,255,255,.03);
  transition:.3s var(--e)}
.aknav button:hover{border-color:var(--red);color:#fff;background:var(--red-dim)}
.aknav button svg{width:18px;height:18px}
/* Şeridin son kartı: mini sahnesi yok, sadece çağrı. Diğer kartlarla aynı
   kutu ölçüsünde durması için akv yüksekliği kadar üst boşluk alıyor. */
.akcard.akall{display:flex;align-items:center;justify-content:center;
  text-align:center;background:rgba(255,255,255,.02)}
.akcard.akall .akt{padding:26px}
.akcard.akall h3{justify-content:center}
/* ── content-visibility ─────────────────────────────────────────────────
   Ekran dışındaki kartın düzen ve boyama işini tarayıcı atlar.
   NEREYE KOYULDU: yatay şeritteki akış kartları, bülten liste kartları ve
   SSS satırları — üçü de düz liste, hiçbirinde ScrollTrigger ya da kilitli
   (pin) sahne yok.
   NEREYE KOYULMADI ve NEDEN: #hero, #flow, #chan ve sızıntı hunisi (pin'li).
   content-visibility ekran dışındaki içeriğin düzenini hesaplamaz;
   ScrollTrigger ise tam da o yükseklikleri ölçerek çalışıyor. Lenis +
   ScrollTrigger + pin üçlüsünün yanına koymak, yirmi build boyunca
   uğraşılan kaydırma takılmasını geri getirme riski taşıyor.
   contain-intrinsic-size şart: olmazsa kaydırma çubuğu zıplar.        */
.akcard{content-visibility:auto;contain-intrinsic-size:auto 420px}
.bkc{content-visibility:auto;contain-intrinsic-size:auto 320px}
#sss details{content-visibility:auto;contain-intrinsic-size:auto 72px}
.aktrack{display:flex;gap:clamp(16px,2vw,24px);padding:4px var(--gut) 14px;
  overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;cursor:grab}
.aktrack::-webkit-scrollbar{display:none}
.aktrack.drag{cursor:grabbing;scroll-snap-type:none;user-select:none}
.akcard{flex:none;width:clamp(272px,23vw,336px);scroll-snap-align:start;
  display:flex;flex-direction:column;gap:16px;color:inherit;
  transition:transform .45s var(--e)}
.akcard:hover{transform:translateY(-6px)}
.akv{position:relative;container-type:inline-size;aspect-ratio:1/1.02;border-radius:20px;overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(120% 85% at 50% 118%,color-mix(in srgb,var(--tA) 78%,#000 10%),transparent 62%),
    radial-gradient(90% 70% at 82% -8%,color-mix(in srgb,var(--tB) 26%,transparent),transparent 60%),
    linear-gradient(165deg,#17171a,#0b0b0d);
  box-shadow:0 0 44px -18px color-mix(in srgb,var(--tB) 40%,transparent);
  transition:box-shadow .45s var(--e),border-color .45s var(--e)}
.akcard:hover .akv{border-color:rgba(255,255,255,.16);
  box-shadow:0 0 66px -14px color-mix(in srgb,var(--tB) 62%,transparent)}
/* .aknum ve .akic kaldirildi: numaralar Enes'in istegiyle gitti, dev ikon da
   yerini calisan mini sahneye birakti (ikon kuculup basligin yanina gecti). */
.akt h3{font-family:Manrope;font-size:1.22rem;font-weight:700;letter-spacing:-.03em;
  margin-bottom:8px;transition:color .3s var(--e)}
.akcard:hover .akt h3{color:#fff}
.akt p{font-size:.9rem;line-height:1.6;color:var(--tx3);font-weight:300;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
  margin-bottom:12px}
/* .akgo ("KESFET" satiri) kaldirildi — Enes istedi. Yonlendirme artik
   basligin yanindaki oka ve kartin kendisine bagli. */
@media(max-width:640px){
  #akis .akhead{flex-direction:column;align-items:flex-start}
  .akcard{width:min(280px,76vw)}
  .akd{padding:14% 12%}}

/* ============ MANİFESTO BANDI (mfst) ============
   Akış animasyonunun hemen altı: ziyaretçi süreci izledi, şimdi
   "peki ben ne satın alıyorum?" diyor. Cevabın verileceği yer burası.
   Enes'in cümlesi: "ürettiğimiz aracı değil, işletmede oluşan sonucu
   satıyoruz." Bant bu cümlenin üstüne kuruldu. */
.mfst{margin-top:clamp(26px,3.4vw,52px);border:1px solid var(--line);border-radius:20px;
  overflow:hidden;background:linear-gradient(165deg,rgba(239,35,60,.055),rgba(255,255,255,.015))}
.mfhd{padding:clamp(22px,2.8vw,40px) clamp(20px,2.6vw,40px) clamp(16px,2vw,26px);
  border-bottom:1px solid var(--line)}
.mfk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:clamp(10px,1.2vw,16px)}
.mfk i{width:6px;height:6px;border-radius:50%;background:var(--red);
  box-shadow:0 0 10px var(--red-glow)}
.mfhd h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.5rem,3.4vw,2.7rem);line-height:1.08;color:#fff;text-wrap:balance}
.mfhd h3 em{font-style:normal;color:var(--red-soft)}
.mfhd p{margin:clamp(10px,1.2vw,16px) 0 0;max-width:62ch;color:var(--tx2);
  font-size:clamp(.94rem,1.1vw,1.08rem);line-height:1.62}

/* Niş → Satış → Otomasyon */
.mfsteps{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--line)}
.mfstep{position:relative;padding:clamp(18px,2.2vw,30px) clamp(18px,2.2vw,32px);
  border-right:1px solid var(--line)}
.mfstep:last-child{border-right:0}
.mfstep::before{content:'';position:absolute;left:0;top:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--red),transparent);transition:width 1.1s var(--e)}
.mfst.in .mfstep::before{width:100%}
.mfst.in .mfstep:nth-child(2)::before{transition-delay:.16s}
.mfst.in .mfstep:nth-child(3)::before{transition-delay:.32s}
.mfsn{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.mfsn b{font-family:'JetBrains Mono',monospace;font-size:clamp(10px,.82vw,11.6px);
  color:var(--red-soft);letter-spacing:.12em}
.mfsn span{font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.02em;
  font-size:clamp(1.02rem,1.4vw,1.32rem);color:#fff}
.mfstep p{margin:0;color:var(--tx2);font-size:clamp(.86rem,.95vw,.98rem);line-height:1.55}

/* geri kazanılan süreçler */
.mfgain{padding:clamp(18px,2.2vw,30px) clamp(20px,2.6vw,40px);
  display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.4vw,20px);
  border-bottom:1px solid var(--line)}
.mfg{display:flex;flex-direction:column;gap:6px;opacity:0;transform:translateY(10px);
  transition:opacity .6s var(--e),transform .6s var(--e)}
.mfst.in .mfg{opacity:1;transform:none}
.mfst.in .mfg:nth-child(2){transition-delay:.1s}
.mfst.in .mfg:nth-child(3){transition-delay:.2s}
.mfst.in .mfg:nth-child(4){transition-delay:.3s}
.mfg i{font-style:normal;color:var(--tx4);font-size:clamp(.78rem,.86vw,.9rem);line-height:1.35}
.mfg b{display:flex;align-items:center;gap:8px;color:#fff;font-weight:600;
  font-size:clamp(.88rem,.98vw,1.02rem);line-height:1.3}
.mfg b::before{content:'';width:7px;height:7px;border-radius:2px;flex:none;
  background:var(--red);box-shadow:0 0 10px var(--red-glow)}

/* kapanış vuruşu */
.mfend{padding:clamp(20px,2.6vw,36px) clamp(20px,2.6vw,40px);display:flex;
  align-items:center;gap:clamp(14px,2vw,28px);flex-wrap:wrap}
.mfend p{margin:0;flex:1;min-width:min(100%,320px);
  font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.025em;
  font-size:clamp(1.14rem,2.1vw,1.72rem);line-height:1.22;color:#fff;text-wrap:balance}
.mfend p em{font-style:normal;color:var(--red-soft)}
.mfend a{flex:none;display:inline-flex;align-items:center;gap:9px;
  padding:13px 24px;border-radius:999px;background:var(--red);color:#fff;
  font-weight:600;font-size:clamp(.88rem,.95vw,1rem);
  box-shadow:0 16px 40px -22px var(--red);transition:transform .3s var(--e)}
.mfend a:hover{transform:translateY(-2px)}
.mfend a svg{width:16px;height:16px}

@media(max-width:860px){
  .mfsteps{grid-template-columns:1fr}
  .mfstep{border-right:0;border-bottom:1px solid var(--line)}
  .mfstep:last-child{border-bottom:0}
  .mfgain{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){.mfgain{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){
  .mfstep::before{width:100%;transition:none}
  .mfg{opacity:1;transform:none;transition:none}
}

/* ============ SIZINTI HUNİSİ (sz*) ============
   Manifestonun hemen ardı: iddia "sonucu satıyoruz" dedi, bu sahne onu
   KANITLIYOR. Ders kitabı CAC hunisi değil — huniyi dört yerden sızdıran
   şeyler manifestoda saydığımız dört kalemin ta kendisi.
   Kural: RAKAM YOK (Enes kararı). Sadece oran ve yön: kalan tanecik
   sayısı gözle görülür artar, maliyet çubuğu kısalır. */
.szsec{margin-top:clamp(26px,3.4vw,52px)}
/* KİLİTLİ BLOK EKRANA SIĞMALI. Sığmazsa ScrollTrigger 'top top' ile
   kilitler, alt kısım (maliyet çubukları + kapanış) kilit boyunca fold
   altında kalır ve kilit çözülünce belirir — kullanıcı bunu "blok kendini
   tekrarladı, sayfa yenilendi" diye görüyor. Enes'in bildirdiği hata buydu.
   Çözüm: tuval yüksekliği görüntü yüksekliğine bağlı + sert max-height. */
.szstage{border:1px solid var(--line);border-radius:20px;overflow:hidden;
  display:flex;flex-direction:column;max-height:calc(100vh - 44px);
  background:linear-gradient(168deg,#131316,#0b0b0d);
  box-shadow:0 30px 80px -50px rgba(0,0,0,.9)}
.szhd{padding:clamp(20px,2.6vw,36px) clamp(20px,2.6vw,40px) clamp(12px,1.6vw,22px);
  border-bottom:1px solid var(--line);display:flex;align-items:flex-end;
  justify-content:space-between;gap:20px;flex-wrap:wrap}
.szhd h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.24rem,2.5vw,2.1rem);line-height:1.1;color:#fff;text-wrap:balance}
.szhd h3 em{font-style:normal;color:var(--red-soft)}
.szk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:10px}
.szk i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red-glow)}
.szbudget{flex:none;display:flex;flex-direction:column;gap:3px;text-align:right}
.szbudget b{font-family:Manrope,sans-serif;font-weight:700;color:#fff;
  font-size:clamp(.98rem,1.3vw,1.24rem);letter-spacing:-.02em}
.szbudget i{font-style:normal;color:var(--tx4);font-family:'JetBrains Mono',monospace;
  font-size:clamp(8.6px,.74vw,10.2px);letter-spacing:.12em;text-transform:uppercase}

#szCv{position:absolute;inset:0;width:100%;height:100%}

/* kanal şeridi — talep nereden geliyor */
.szchans{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;
  padding:clamp(14px,1.8vw,24px) clamp(20px,2.6vw,40px) 0}
.szch{padding:7px 15px;border-radius:999px;border:1px solid var(--line2);
  background:rgba(255,255,255,.04);color:var(--tx3);
  font-size:clamp(10.4px,.9vw,12.2px);font-weight:500;
  opacity:0;transform:translateY(7px);
  transition:opacity .45s var(--e),transform .45s var(--e),
             border-color .4s var(--e),color .4s var(--e)}
.szch.on{opacity:1;transform:none;border-color:rgba(239,35,60,.34);color:#fff}

.szwrap{position:relative;flex:0 0 auto;
  height:clamp(250px,calc(100vh - 470px),560px)}
#szCv{position:absolute;inset:0;width:100%;height:100%}

/* yan açıklamalar — bağlantı çizgisi tuvalde çiziliyor */
.szside{position:absolute;top:0;bottom:0;width:min(30%,270px);display:flex;
  flex-direction:column;justify-content:center;gap:clamp(26px,4vw,64px);
  pointer-events:none;padding:6% 0}
.szside.left{left:clamp(12px,1.8vw,26px);align-items:flex-start;text-align:left}
.szside.right{right:clamp(12px,1.8vw,26px);align-items:flex-end;text-align:right}
.szleak{display:flex;flex-direction:column;gap:7px;
  opacity:0;transform:translateY(10px);
  transition:opacity .5s var(--e),transform .5s var(--e)}
.szleak.on{opacity:1;transform:none}
.szlt{display:flex;flex-direction:column;gap:3px}
.szlt b{color:#fff;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.02em;
  font-size:clamp(12.6px,1.26vw,17px);line-height:1.2;
  transition:color .4s var(--e),text-decoration-color .4s var(--e)}
.szleak.sealed .szlt b{color:var(--tx3);text-decoration:line-through;
  text-decoration-color:rgba(239,35,60,.7);text-decoration-thickness:2px}
.szlt i{font-style:normal;color:var(--tx4);font-size:clamp(10.2px,.9vw,12px);line-height:1.35}
.szfix{display:inline-flex;align-items:center;gap:7px;padding:5px 11px;border-radius:999px;
  background:rgba(239,35,60,.12);border:1px solid rgba(239,35,60,.4);
  color:var(--red-soft);font-family:'JetBrains Mono',monospace;
  font-size:clamp(9.2px,.8vw,10.8px);letter-spacing:.04em;white-space:nowrap;
  opacity:0;transform:scale(.9);transition:opacity .45s var(--e),transform .45s var(--e)}
.szleak.sealed .szfix{opacity:1;transform:none}
.szfix s{width:12px;height:12px;border-radius:50%;background:var(--red);flex:none;
  position:relative;text-decoration:none}
.szfix s::after{content:'';position:absolute;left:3.4px;top:5px;width:3.6px;height:1.8px;
  border-left:1.4px solid #fff;border-bottom:1.4px solid #fff;transform:rotate(-45deg)}

/* huni katları — oran çubuklu */
.szstages{position:absolute;left:50%;top:0;bottom:0;transform:translateX(-50%);
  width:min(38%,300px);display:flex;flex-direction:column;justify-content:flex-start;
  pointer-events:none;padding-top:6%}
.szst{display:flex;flex-direction:column;align-items:center;gap:5px;
  height:24%;justify-content:flex-start;
  opacity:0;transform:translateY(6px);transition:opacity .45s var(--e),transform .45s var(--e)}
.szst.on{opacity:1;transform:none}
.szst b{font-family:'JetBrains Mono',monospace;font-size:clamp(9px,.8vw,10.8px);
  letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);font-weight:500}
.szsb{width:min(70%,150px);height:4px;border-radius:3px;background:rgba(255,255,255,.08);
  overflow:hidden}
.szsb i{display:block;height:100%;width:0;border-radius:3px;
  background:linear-gradient(90deg,rgba(255,255,255,.42),rgba(255,255,255,.16));
  transition:width .8s var(--e),background .5s var(--e)}
.szst.on .szsb i{width:var(--w,60%)}
.szstage.done .szsb i{background:linear-gradient(90deg,var(--red),var(--red-soft))}

.szout{position:absolute;left:50%;bottom:clamp(8px,1.2vw,18px);transform:translateX(-50%);
  font-family:'JetBrains Mono',monospace;font-size:clamp(9px,.8vw,10.8px);
  letter-spacing:.14em;text-transform:uppercase;color:var(--tx3);
  opacity:0;transition:opacity .5s var(--e)}
.szstage.out .szout{opacity:1}
.szbeat{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.96);
  padding:12px 26px;border-radius:999px;background:rgba(10,10,11,.9);
  backdrop-filter:blur(10px);border:1px solid rgba(239,35,60,.45);
  font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.02em;
  font-size:clamp(1rem,1.5vw,1.34rem);color:#fff;white-space:nowrap;z-index:3;
  opacity:0;transition:opacity .4s var(--e),transform .4s var(--e)}
.szstage.beat .szbeat{opacity:1;transform:translate(-50%,-50%) scale(1)}

@media(max-width:900px){
  .szwrap{height:clamp(300px,calc(100vh - 430px),480px)}
  .szside{width:40%;gap:18px;padding:4% 0}
  .szlt b{font-size:12px}.szlt i{display:none}
  .szfix{font-size:8.8px;padding:4px 8px}
  .szstages{width:34%}
  .szst b{font-size:8.4px;letter-spacing:.08em}
}
.szfoot{border-top:1px solid var(--line);padding:clamp(16px,2vw,28px) clamp(20px,2.6vw,40px);
  display:grid;grid-template-columns:1fr auto;gap:clamp(16px,2.4vw,36px);align-items:center}
.szbars{display:flex;flex-direction:column;gap:9px;min-width:0}
.szcap{font-family:'JetBrains Mono',monospace;font-size:clamp(8.4px,.72vw,10px);
  letter-spacing:.12em;text-transform:uppercase;color:var(--tx4)}
.szbar{display:grid;grid-template-columns:clamp(46px,5vw,64px) 1fr;gap:12px;align-items:center}
.szbar i{font-style:normal;color:var(--tx3);font-size:clamp(9.6px,.84vw,11.4px)}
.szbar span{position:relative;height:10px;border-radius:5px;background:rgba(255,255,255,.06);
  overflow:hidden}
.szbar b{position:absolute;inset:0 auto 0 0;width:0;border-radius:5px;
  transition:width .9s var(--e)}
.szbar.before b{background:linear-gradient(90deg,rgba(255,255,255,.3),rgba(255,255,255,.12))}
.szbar.after b{background:linear-gradient(90deg,var(--red),var(--red-soft));
  box-shadow:0 0 22px -8px var(--red-glow)}
.szarrow{display:flex;align-items:center;gap:8px;color:var(--red-soft);
  font-size:clamp(9.6px,.84vw,11.4px);opacity:0;transition:opacity .5s var(--e)}
.szstage.done .szarrow{opacity:1}
.szarrow svg{width:15px;height:15px}
.szend{flex:none;max-width:min(100%,300px);font-family:Manrope,sans-serif;font-weight:700;
  letter-spacing:-.025em;font-size:clamp(1.02rem,1.6vw,1.4rem);line-height:1.22;color:#fff;
  text-wrap:balance;opacity:0;transform:translateY(8px);
  transition:opacity .6s var(--e),transform .6s var(--e)}
.szstage.done .szend{opacity:1;transform:none}
.szend em{font-style:normal;color:var(--red-soft)}

@media(max-width:860px){
  .szhd{flex-direction:column;align-items:flex-start}
  .szbudget{text-align:left}
  .szfoot{grid-template-columns:1fr}
  .szend{max-width:100%}
}
@media(prefers-reduced-motion:reduce){
  .szlab,.szleak,.szout,.szend,.szarrow{opacity:1;transform:none;transition:none}
}

/* ============ DÖRT KATMANLI MİMARİ (kt*) ============
   FounderOS'un "Layer 01..04" hamlesinin bizdeki karşılığı.
   Dokuz hizmet yan yana durunca ziyaretçi aralarındaki ilişkiyi kendi
   kurmak zorunda kalıyordu; katmanlar o ilişkiyi bizim yerimize anlatıyor.
   Her hizmet bir katmana ait ve karttan doğrudan sayfasına gidiyor. */
.ktsec{margin-top:clamp(30px,4vw,64px)}
.kthd{max-width:62ch;margin-bottom:clamp(20px,2.6vw,38px)}
.ktk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:12px}
.ktk i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red-glow)}
.kthd h2{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.035em;
  font-size:clamp(1.6rem,4vw,3.1rem);line-height:1.06;color:#fff;text-wrap:balance}
.kthd p{margin:clamp(11px,1.3vw,18px) 0 0;color:var(--tx2);
  font-size:clamp(.94rem,1.1vw,1.08rem);line-height:1.62}

.ktgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.ktcard{position:relative;display:flex;flex-direction:column;gap:9px;
  padding:clamp(20px,2.3vw,32px) clamp(18px,2vw,28px) clamp(18px,2vw,28px);
  background:#0d0d10;transition:background .4s var(--e)}
.ktcard::before{content:'';position:absolute;left:0;top:0;height:2px;width:0;
  background:linear-gradient(90deg,var(--red),transparent);transition:width 1s var(--e)}
.ktsec.in .ktcard::before{width:100%}
.ktsec.in .ktcard:nth-child(2)::before{transition-delay:.12s}
.ktsec.in .ktcard:nth-child(3)::before{transition-delay:.24s}
.ktsec.in .ktcard:nth-child(4)::before{transition-delay:.36s}
.ktcard:hover{background:#131317}
.ktnum{font-family:'JetBrains Mono',monospace;font-size:clamp(9.4px,.8vw,11px);
  letter-spacing:.18em;color:var(--red-soft)}
.ktcard h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.24rem,1.9vw,1.72rem);line-height:1.1;color:#fff}
.ktq{color:var(--tx3);font-size:clamp(.86rem,.95vw,.98rem);line-height:1.35;
  padding-bottom:9px;border-bottom:1px solid var(--line)}
.ktcard p{margin:0;color:var(--tx2);font-size:clamp(.85rem,.92vw,.96rem);line-height:1.58;
  flex:1}
.ktsvc{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.ktsvc a,.ktsvc i{font-style:normal;padding:5px 11px;border-radius:999px;
  font-size:clamp(10.4px,.86vw,11.8px);font-weight:500;white-space:nowrap;
  border:1px solid var(--line2);background:rgba(255,255,255,.035);color:var(--tx3);
  transition:border-color .28s var(--e),color .28s var(--e),background .28s var(--e)}
.ktsvc a:hover{border-color:rgba(239,35,60,.5);color:#fff;background:rgba(239,35,60,.12)}
.ktsvc i{border-style:dashed;color:var(--tx4)}
a.ktcard .ktsvc i{border-style:solid;border-color:rgba(239,35,60,.4);
  color:var(--red-soft);background:rgba(239,35,60,.1)}
a.ktcard:hover{background:#131317}

.ktend{display:flex;align-items:center;gap:clamp(14px,2vw,26px);
  margin-top:clamp(18px,2.2vw,30px);flex-wrap:wrap}
.ktline{flex:1;min-width:60px;height:1px;background:linear-gradient(90deg,var(--red),transparent)}
.ktend p{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.025em;
  font-size:clamp(1.02rem,1.7vw,1.5rem);line-height:1.2;color:#fff;text-wrap:balance}
.ktend p em{font-style:normal;color:var(--red-soft)}

@media(max-width:980px){.ktgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.ktgrid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.ktcard::before{width:100%;transition:none}}

/* ============ BİR GÜN ANLATISI (gn*) ============
   FounderOS'un "Picture 30 days from now" hamlesi. Özellik saymak yerine
   sonucu YAŞANMIŞ BİR GÜN olarak anlatıyor. Manifesto ne sattığımızı,
   huni neyi kazandırdığını söylüyor; bu blok o kazancın günlük hayatta
   neye benzediğini gösteriyor. Ağır animasyon YOK — kaydırdıkça satırlar
   sırayla düşüyor, ray doluyor. Bilerek sakin. */
.gnsec{margin-top:clamp(26px,3.4vw,52px)}
.gnhd{max-width:58ch;margin-bottom:clamp(20px,2.4vw,34px)}
.gnk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:11px}
.gnk i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red-glow)}
.gnhd h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.035em;
  font-size:clamp(1.5rem,3.4vw,2.7rem);line-height:1.08;color:#fff}
.gnhd p{margin:clamp(10px,1.2vw,16px) 0 0;color:var(--tx2);
  font-size:clamp(.92rem,1.06vw,1.05rem);line-height:1.6}

.gnline{position:relative;padding-left:clamp(74px,9vw,132px)}
.gnrail{position:absolute;left:clamp(52px,6.4vw,94px);top:6px;bottom:34px;width:2px;
  background:rgba(255,255,255,.09);border-radius:2px;overflow:hidden}
.gnrail i{display:block;width:100%;height:0;border-radius:2px;
  background:linear-gradient(180deg,var(--red),var(--red-soft));
  transition:height 1.4s var(--e)}
.gnsec.in .gnrail i{height:100%}

.gnrow{position:relative;display:flex;gap:clamp(14px,1.8vw,26px);
  padding-bottom:clamp(20px,2.4vw,34px);
  opacity:0;transform:translateY(14px);
  transition:opacity .6s var(--e),transform .6s var(--e)}
.gnsec.in .gnrow{opacity:1;transform:none}
.gnsec.in .gnrow[data-i="1"]{transition-delay:.12s}
.gnsec.in .gnrow[data-i="2"]{transition-delay:.24s}
.gnsec.in .gnrow[data-i="3"]{transition-delay:.36s}
.gnsec.in .gnrow[data-i="4"]{transition-delay:.48s}
.gnsec.in .gnrow[data-i="5"]{transition-delay:.60s}
.gnrow::before{content:'';position:absolute;
  left:calc(clamp(52px,6.4vw,94px) - clamp(74px,9vw,132px) - 5px);top:7px;
  width:12px;height:12px;border-radius:50%;background:#0a0a0b;
  border:2px solid rgba(255,255,255,.2);transition:border-color .5s var(--e),box-shadow .5s var(--e)}
.gnsec.in .gnrow::before{border-color:var(--red);box-shadow:0 0 14px -2px var(--red-glow)}
.gnrow.last::before{background:var(--red);border-color:var(--red)}
.gnt{position:absolute;left:calc(0px - clamp(74px,9vw,132px));top:3px;
  width:clamp(52px,6.4vw,94px);text-align:right;padding-right:clamp(14px,1.7vw,24px);
  font-family:'JetBrains Mono',monospace;font-size:clamp(11px,1.02vw,13.4px);
  font-weight:600;color:var(--red-soft);font-variant-numeric:tabular-nums;
  white-space:nowrap;letter-spacing:-.01em}
.gnc{flex:1;min-width:0}
.gnc b{display:block;color:#fff;font-family:Manrope,sans-serif;font-weight:700;
  letter-spacing:-.025em;font-size:clamp(1.02rem,1.5vw,1.34rem);line-height:1.22;
  text-wrap:balance}
.gnc p{margin:7px 0 0;color:var(--tx2);font-size:clamp(.88rem,.98vw,1.02rem);
  line-height:1.6;max-width:62ch}
.gnrow.last .gnc b{color:var(--red-soft)}

@media(max-width:640px){
  .gnline{padding-left:0}
  .gnrail{display:none}
  .gnrow{flex-direction:column;gap:5px;padding-left:16px;
    border-left:2px solid rgba(255,255,255,.09)}
  .gnsec.in .gnrow{border-left-color:rgba(239,35,60,.5)}
  .gnrow::before{left:-7px;top:4px}
  .gnt{position:static;width:auto;text-align:left;padding:0 0 3px}
}
@media(prefers-reduced-motion:reduce){
  .gnrow{opacity:1;transform:none;transition:none}
  .gnrail i{height:100%;transition:none}
}

/* ============ KENDİ RAKAMINLA HUNİ (hs*) ============
   Sızıntı hunisi mekanizmayı anlatıyor; bu blok ziyaretçinin KENDİ
   rakamıyla kendi sızıntısını gösteriyor.
   KURAL: çıkan sayı bizim iddiamız DEĞİL, onun girdiklerinin aritmetiği.
   "Şu kadarını kurtarırız" demiyoruz — kapanabilir kısmı keşifte konuşulur. */
.hssec{margin-top:clamp(20px,2.6vw,38px)}
.hsbox{border:1px solid var(--line);border-radius:20px;overflow:hidden;
  background:linear-gradient(168deg,rgba(239,35,60,.05),rgba(255,255,255,.015))}
.hshd{padding:clamp(20px,2.6vw,36px) clamp(20px,2.6vw,40px) clamp(14px,1.8vw,24px);
  border-bottom:1px solid var(--line)}
.hsk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:10px}
.hsk i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red-glow)}
.hshd h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.24rem,2.5vw,2.1rem);line-height:1.12;color:#fff;text-wrap:balance}
.hshd h3 em{font-style:normal;color:var(--red-soft)}
.hshd p{margin:clamp(9px,1.1vw,15px) 0 0;max-width:60ch;color:var(--tx2);
  font-size:clamp(.9rem,1.02vw,1.02rem);line-height:1.58}
.hsgrid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.hsinputs{padding:clamp(18px,2.2vw,32px) clamp(20px,2.6vw,40px);
  border-right:1px solid var(--line);display:flex;flex-direction:column;gap:clamp(13px,1.5vw,19px)}
.hsrow{display:flex;flex-direction:column;gap:8px;cursor:pointer}
.hslab{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.hslab b{color:var(--tx2);font-weight:500;font-size:clamp(.85rem,.95vw,.98rem)}
.hslab em{font-style:normal;font-family:'JetBrains Mono',monospace;font-weight:700;
  color:#fff;font-size:clamp(.98rem,1.2vw,1.18rem);font-variant-numeric:tabular-nums}
.hsrow.vol .hslab b{color:#fff;font-weight:650}
.hsrow.vol .hslab em{color:var(--red-soft);font-size:clamp(1.2rem,1.7vw,1.62rem)}
.hssep{font-family:'JetBrains Mono',monospace;font-size:clamp(8.6px,.74vw,10.2px);
  letter-spacing:.13em;text-transform:uppercase;color:var(--tx4);
  padding-top:clamp(4px,.6vw,8px);border-top:1px solid var(--line)}
.hsrow input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:5px;
  border-radius:4px;background:rgba(255,255,255,.1);outline:none;cursor:pointer}
.hsrow input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;
  width:18px;height:18px;border-radius:50%;background:#fff;cursor:pointer;
  box-shadow:0 2px 10px rgba(0,0,0,.55),0 0 0 0 rgba(239,35,60,.35);
  transition:box-shadow .25s var(--e),transform .25s var(--e)}
.hsrow input[type=range]::-moz-range-thumb{width:18px;height:18px;border:0;border-radius:50%;
  background:#fff;cursor:pointer;box-shadow:0 2px 10px rgba(0,0,0,.55)}
.hsrow input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.1)}
.hsrow input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 2px 10px rgba(0,0,0,.55),0 0 0 6px rgba(239,35,60,.3)}
.hsrow.vol input[type=range]::-webkit-slider-thumb{background:var(--red);
  box-shadow:0 2px 14px -2px var(--red-glow)}
.hsrow.vol input[type=range]::-moz-range-thumb{background:var(--red)}

.hsout{padding:clamp(18px,2.2vw,32px) clamp(20px,2.6vw,40px);
  display:flex;flex-direction:column;gap:clamp(12px,1.5vw,20px)}
.hsflow{display:flex;flex-direction:column;gap:7px}
.hsstep{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:baseline}
.hsstep i{font-style:normal;color:var(--tx3);font-size:clamp(.78rem,.86vw,.9rem)}
.hsstep b{font-family:'JetBrains Mono',monospace;color:#fff;font-weight:600;
  font-size:clamp(.88rem,1vw,1.04rem);font-variant-numeric:tabular-nums}
.hsbar{grid-column:1/-1;height:6px;border-radius:4px;background:rgba(255,255,255,.06);overflow:hidden}
.hsbar u{display:block;height:100%;width:100%;border-radius:4px;text-decoration:none;
  background:linear-gradient(90deg,rgba(255,255,255,.34),rgba(255,255,255,.14));
  transition:width .35s var(--e)}
.hsstep.last i{color:var(--red-soft)}
.hsstep.last b{color:var(--red-soft);font-size:clamp(1rem,1.15vw,1.2rem)}
.hsstep.last .hsbar u{background:linear-gradient(90deg,var(--red),var(--red-soft));
  box-shadow:0 0 20px -8px var(--red-glow)}
.hsres{display:flex;align-items:flex-end;gap:clamp(16px,2.4vw,34px);flex-wrap:wrap;
  padding-top:clamp(12px,1.5vw,20px);border-top:1px solid var(--line)}
.hsbig,.hssm{display:flex;flex-direction:column;gap:2px}
.hsbig span,.hssm span{font-family:'JetBrains Mono',monospace;
  font-size:clamp(8.6px,.74vw,10.2px);letter-spacing:.13em;text-transform:uppercase;color:var(--tx4)}
.hsbig b{font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-.035em;
  font-size:clamp(2.4rem,5.4vw,4.2rem);line-height:1;color:var(--red-soft);
  font-variant-numeric:tabular-nums}
.hssm b{font-family:'JetBrains Mono',monospace;font-weight:700;color:#fff;
  font-size:clamp(1.1rem,1.7vw,1.6rem);font-variant-numeric:tabular-nums}
.hsnote{margin:0;color:var(--tx3);font-size:clamp(.82rem,.9vw,.94rem);line-height:1.55;
  max-width:52ch}
.hsout .btn{align-self:flex-start}
/* ₺ satırı: paranın büyük rakam olması bilinçli — kayıptan kaçınma
   adetle değil parayla çalışır. Rakam kırmızı, üst çizgi kesikli. */
.hsres.hspara{border-top:1px dashed rgba(239,35,60,.4)}
.hsres.hspara .hsbig b{color:var(--red)}
.hsrow.val .hslab em{color:#fff;font-size:clamp(1.05rem,1.35vw,1.3rem)}
.hsrow.val input[type=range]::-webkit-slider-thumb{background:#fff}

@media(max-width:860px){
  .hsgrid{grid-template-columns:1fr}
  .hsinputs{border-right:0;border-bottom:1px solid var(--line)}
  .hsbig b{font-size:clamp(2.6rem,14vw,3.4rem)}
}

/* ============ AJAN KADROSU (kd*) ============
   Referans: FounderOS personas/ ağacı. Ağır animasyon YOK — bu blok
   somutluk katıyor, hareket değil. Tıkla, ne yaptığını gör. */
.kdbox{border:1px solid var(--line);border-radius:20px;overflow:hidden;
  background:linear-gradient(168deg,#131316,#0b0b0d)}
.kdhd{padding:clamp(20px,2.4vw,34px) clamp(20px,2.6vw,38px) clamp(14px,1.8vw,24px)}
.kdk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:10px}
.kdk i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red-glow)}
.kdhd h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.3rem,2.5vw,2.1rem);line-height:1.12;color:#fff}
.kdhd h3 em{font-style:normal;color:var(--red-soft)}
.kdhd p{margin:clamp(9px,1.1vw,15px) 0 0;max-width:62ch;color:var(--tx2);
  font-size:clamp(.9rem,1.02vw,1.02rem);line-height:1.6}
.kdbar{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  padding:clamp(10px,1.2vw,15px) clamp(20px,2.6vw,38px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:rgba(0,0,0,.24);font-family:'JetBrains Mono',monospace;
  font-size:clamp(10px,.86vw,11.8px)}
.kdpath{color:var(--red-soft);font-weight:600}
.kdbar em{font-style:normal;color:var(--tx4)}
.kdbar b{margin-left:auto;color:var(--tx3);letter-spacing:.14em;font-size:.9em}

.kdtree{padding:clamp(16px,2vw,28px) clamp(18px,2.4vw,36px);
  display:flex;flex-direction:column;gap:clamp(8px,1vw,13px)}
.kdkok{padding-bottom:clamp(8px,1vw,13px);border-bottom:1px solid var(--line)}
.kdrow{display:flex;gap:clamp(10px,1.4vw,20px);align-items:flex-start;flex-wrap:wrap;
  padding-left:14px;border-left:1px solid rgba(239,35,60,.28);
  opacity:0;transform:translateX(8px);
  transition:opacity .5s var(--e),transform .5s var(--e);
  transition-delay:calc(var(--i)*.07s)}
.kdbox.in .kdrow{opacity:1;transform:none}
.kdsef{display:flex;flex-direction:column;gap:4px;flex:none;min-width:min(160px,44%)}
.kdsef i{font-style:normal;color:var(--tx4);font-size:clamp(9.6px,.82vw,11px);
  padding-left:2px}
.kdlist{display:flex;flex-wrap:wrap;gap:6px;flex:1;padding-top:1px}

.kdc{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:8px;
  border:1px solid var(--line2);background:rgba(255,255,255,.035);cursor:pointer;
  font-family:'JetBrains Mono',monospace;font-size:clamp(10.4px,.88vw,12px);
  color:var(--tx3);transition:border-color .25s var(--e),color .25s var(--e),
  background .25s var(--e)}
.kdc s{width:7px;height:7px;border-radius:2px;flex:none;text-decoration:none;
  border:1px solid currentColor;opacity:.6}
.kdc:hover,.kdc:focus-visible{color:#fff;border-color:rgba(239,35,60,.45);
  background:rgba(239,35,60,.1)}
.kdc.on{color:#fff;border-color:rgba(239,35,60,.62);background:rgba(239,35,60,.16)}
.kdc-kok{border-color:rgba(239,35,60,.5);background:rgba(239,35,60,.12);color:#fff;
  font-weight:600}
.kdc-kok s{background:var(--red);border-color:var(--red);opacity:1}
.kdc-sef{border-color:rgba(239,35,60,.36);color:#fff}
.kdc-sef s{background:var(--red-soft);border-color:var(--red-soft);opacity:1}

.kddet{display:none;align-items:baseline;gap:12px;flex-wrap:wrap;
  padding:clamp(12px,1.5vw,20px) clamp(20px,2.6vw,38px);
  border-top:1px solid var(--line);background:rgba(0,0,0,.24)}
.kddet.on{display:flex}
.kddet.flash{animation:kdIn .45s var(--e)}
@keyframes kdIn{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}
.kddet b{font-family:'JetBrains Mono',monospace;font-size:clamp(11px,.94vw,13px);
  color:var(--red-soft);font-weight:600;flex:none}
.kddet i{font-style:normal;color:var(--tx2);font-size:clamp(.84rem,.92vw,.98rem);
  line-height:1.55;flex:1;min-width:min(100%,240px)}
.kdsc{flex:none;display:inline-flex;align-items:center;gap:7px;padding:4px 10px;
  border-radius:999px;background:rgba(255,255,255,.05);border:1px solid var(--line2);
  font-family:'JetBrains Mono',monospace;font-size:clamp(9.6px,.8vw,11px);color:var(--tx2)}
.kdsc u{text-decoration:none;color:var(--tx4);letter-spacing:.12em;text-transform:uppercase;
  font-size:.86em}
.kdend{padding:clamp(14px,1.8vw,24px) clamp(20px,2.6vw,38px);
  border-top:1px solid var(--line);font-family:Manrope,sans-serif;font-weight:700;
  letter-spacing:-.02em;font-size:clamp(1rem,1.5vw,1.32rem);color:#fff;text-wrap:balance}
.kdend em{font-style:normal;color:var(--red-soft)}

@media(max-width:720px){
  .kdrow{flex-direction:column;gap:7px}
  .kdsef{min-width:0}
}
@media(prefers-reduced-motion:reduce){.kdrow{opacity:1;transform:none;transition:none}}

/* ============ TESLİMAT ANATOMİSİ (tp*) ============
   Referans: thefounderos "encoded-company/" şeması — tek büyük klasör,
   yelpaze gibi açılan eğri teller, numaralı kartlar. Anatominin tamamı
   tek bakışta okunuyor; tıklamak gezinmek için değil, AYRINTI için.
   Beliriş: bulanık pikseller netleşiyor (referanstaki etki). */
.tpbox{border:1px solid var(--line);border-radius:20px;overflow:hidden;
  background:linear-gradient(168deg,#131316,#0b0b0d)}
.tphd{padding:clamp(20px,2.4vw,34px) clamp(20px,2.6vw,38px) clamp(14px,1.8vw,24px)}
.tpk{display:inline-flex;align-items:center;gap:8px;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.76vw,10.6px);letter-spacing:.16em;text-transform:uppercase;
  color:var(--red-soft);margin-bottom:10px}
.tpk i{width:6px;height:6px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red-glow)}
.tphd h3{margin:0;font-family:Manrope,sans-serif;font-weight:700;letter-spacing:-.03em;
  font-size:clamp(1.3rem,2.5vw,2.1rem);line-height:1.1;color:#fff}
.tphd p{margin:clamp(9px,1.1vw,15px) 0 0;max-width:62ch;color:var(--tx2);
  font-size:clamp(.9rem,1.02vw,1.02rem);line-height:1.6}
.tpbar{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  padding:clamp(10px,1.2vw,15px) clamp(20px,2.6vw,38px);
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  background:rgba(0,0,0,.24);font-family:'JetBrains Mono',monospace;
  font-size:clamp(10px,.86vw,11.8px)}
.tppath{color:var(--red-soft);font-weight:600}
.tpbar em{font-style:normal;color:var(--tx4)}

/* ---- yelpaze ---- */
/* HATA DÜZELTİLDİ: teller ve piksel katmanı MUTLAK konumluydu, yani ızgara
   hücresi işgal etmiyorlardı. Bu yüzden .tpcards 3. değil 2. sütuna —
   yani 100px'lik tel boşluğuna— düşüyor, çipler alt alta yığılıyor, yazılar
   taşıyor ve 716px'lik 3. sütun bomboş kalıyordu. Artık her grid öğesi
   sütununu AÇIKÇA söylüyor; teller de kendi hücresinde duruyor. */
.tpfan{position:relative;display:grid;
  grid-template-columns:minmax(140px,.66fr) clamp(64px,7.5vw,118px) minmax(0,2fr);
  align-items:center;gap:0;padding:clamp(22px,2.8vw,44px) clamp(18px,2.4vw,36px)}
.tpleft{grid-column:1}
.tpmid{grid-column:2;position:relative;align-self:stretch;min-height:120px}
.tpmid::before{content:'';position:absolute;left:-5px;top:50%;width:9px;height:9px;
  border-radius:50%;background:var(--red);transform:translateY(-50%);
  box-shadow:0 0 12px -1px var(--red-glow);opacity:0;
  transition:opacity .6s var(--e) .3s}
.tpbox.in .tpmid::before{opacity:1}
.tpcards{grid-column:3}
.tppx{position:absolute;inset:0;z-index:4;pointer-events:none;
  background-image:linear-gradient(90deg,#0d0d10 1px,transparent 1px),
                   linear-gradient(#0d0d10 1px,transparent 1px);
  background-size:11px 11px;opacity:1;
  transition:opacity 1.15s var(--e)}
.tpbox.in .tppx{opacity:0}

.tpleft{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;
  filter:blur(14px);opacity:0;transform:scale(.9);
  transition:filter .9s var(--e),opacity .9s var(--e),transform .9s var(--e)}
.tpbox.in .tpleft{filter:none;opacity:1;transform:none}
.tpfolder{width:clamp(88px,11vw,150px);display:block;
  filter:drop-shadow(0 18px 44px rgba(239,35,60,.32))}
.tpfolder svg{width:100%;height:auto;display:block}
.tpleft b{font-family:'JetBrains Mono',monospace;font-size:clamp(12px,1.06vw,15px);
  color:#fff;font-weight:600;letter-spacing:-.01em}
.tpleft i{font-style:normal;font-family:'JetBrains Mono',monospace;
  font-size:clamp(8.4px,.72vw,9.8px);letter-spacing:.14em;text-transform:uppercase;
  color:var(--tx4);line-height:1.5;max-width:19ch}

.tpwires{position:absolute;inset:0;width:100%;height:100%;
  pointer-events:none;z-index:1;overflow:visible}
.tpwires path{fill:none;stroke:rgba(255,255,255,.22);stroke-width:1.1;
  stroke-dasharray:900;stroke-dashoffset:900;
  transition:stroke-dashoffset 1.1s var(--e);transition-delay:calc(.25s + var(--i)*.09s)}
/* non-scaling-stroke BİLEREK YOK: o özellik çizgiyi ve dash'i CİHAZ
   uzayında (zoom sonrası) çizer; JS ölçümü ise CSS pikseli. Zoom her
   değiştiğinde ikisinin oranı bozulup teller kesiliyordu. viewBox artık
   telHizala içinde SVG'nin kendi piksel boyutuna eşitlendiği için ölçek
   1:1 — kalınlık bozulmaz, birim tektir, zoom her şeyi birlikte
   ölçekler. 900: JS çalışmazsa yedek uzunluk. !important aşağıda şart:
   satır içi dashoffset'i yenmesi gerekiyor, yoksa teller hiç açılmaz. */
.tpbox.in .tpwires path{stroke-dashoffset:0 !important}

.tpcards{position:relative;z-index:2;display:flex;flex-direction:column;
  gap:clamp(8px,1vw,13px)}
.tpcard{position:relative;border:1px solid var(--line);border-radius:13px;padding:clamp(11px,1.3vw,17px);
  background:rgba(255,255,255,.028);
  filter:blur(11px);opacity:0;transform:translateX(10px);
  transition:filter .8s var(--e),opacity .8s var(--e),transform .8s var(--e),
             border-color .3s var(--e);
  transition-delay:calc(.32s + var(--i)*.09s)}
.tpbox.in .tpcard{filter:none;opacity:1;transform:none}
.tpcard::before{content:'';position:absolute;left:-4.5px;top:50%;width:8px;height:8px;
  border-radius:50%;background:var(--tx3);transform:translateY(-50%);
  opacity:0;transition:opacity .5s var(--e)}
.tpbox.in .tpcard::before{opacity:1;transition-delay:calc(.5s + var(--i)*.09s)}
.tpcard:hover{border-color:rgba(239,35,60,.3)}
.tpch{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:8px}
.tpch b{font-family:'JetBrains Mono',monospace;font-size:clamp(9.4px,.8vw,11px);
  color:var(--red-soft);font-weight:700}
.tpch em{font-style:normal;font-family:'JetBrains Mono',monospace;
  font-size:clamp(11px,.96vw,13.4px);letter-spacing:.1em;color:#fff;font-weight:600}
.tpch u{text-decoration:none;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9.4px,.8vw,11px);color:var(--red-soft);opacity:.7;
  letter-spacing:-.01em;flex:none;margin-left:auto}
.tpch i{font-style:normal;color:var(--tx4);font-size:clamp(9.6px,.82vw,11.2px);
  line-height:1.35;flex:1;min-width:120px}
.tpchips{display:flex;flex-wrap:wrap;gap:6px}
.tpchip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:8px;
  border:1px solid var(--line2);background:rgba(255,255,255,.035);cursor:pointer;
  font-family:'JetBrains Mono',monospace;font-size:clamp(10px,.84vw,11.6px);
  color:var(--tx3);transition:border-color .25s var(--e),color .25s var(--e),
  background .25s var(--e)}
.tpchip s{width:9px;height:11px;border-radius:1.5px;flex:none;text-decoration:none;
  border:1px solid currentColor;opacity:.55}
.tpchip:hover,.tpchip:focus-visible{color:#fff;border-color:rgba(239,35,60,.45);
  background:rgba(239,35,60,.1)}
.tpchip.on{color:#fff;border-color:rgba(239,35,60,.6);background:rgba(239,35,60,.16)}

.tpdetail{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;
  padding:clamp(12px,1.5vw,20px) clamp(20px,2.6vw,38px);
  border-top:1px solid var(--line);background:rgba(0,0,0,.24)}
.tpdetail b{font-family:'JetBrains Mono',monospace;font-size:clamp(11px,.94vw,13px);
  color:var(--red-soft);font-weight:600;flex:none}
.tpdetail i{font-style:normal;color:var(--tx2);font-size:clamp(.84rem,.92vw,.98rem);
  line-height:1.55;flex:1;min-width:min(100%,240px)}
.tpdetail.flash{animation:tpFlash .5s var(--e)}
@keyframes tpFlash{from{opacity:.35;transform:translateY(3px)}to{opacity:1;transform:none}}

.tpend{padding:clamp(14px,1.8vw,24px) clamp(20px,2.6vw,38px);
  border-top:1px solid var(--line);font-family:Manrope,sans-serif;font-weight:700;
  letter-spacing:-.02em;font-size:clamp(1rem,1.5vw,1.32rem);color:#fff;text-wrap:balance}

@media(max-width:880px){
  .tpfan{grid-template-columns:1fr;gap:clamp(16px,3vw,26px)}
  .tpleft,.tpcards{grid-column:1}
  .tpmid{display:none}
  .tpcard::before{display:none}
  .tpleft{flex-direction:row;gap:14px;text-align:left;align-items:center}
  .tpfolder{width:64px;flex:none}
  .tpleft i{max-width:none}
  .tppx{background-size:9px 9px}
}
@media(prefers-reduced-motion:reduce){
  .tppx{opacity:0}
  .tpleft,.tpcard{filter:none;opacity:1;transform:none}
  .tpwires path{stroke-dashoffset:0 !important}
}

/* ============ PAZAR ZEKÂSI SAHNESİ (mk*) ============
   Yedi perde tek pencerede yatay kayar; üstte adım rayı.
   Sahne A "alıcıyı bul" der, bu sahne "pazarı çöz" der. */
.mkstage{border:1px solid var(--line);border-radius:18px;overflow:hidden;position:relative;
  display:flex;flex-direction:column;max-height:calc(100vh - 60px);
  background:linear-gradient(168deg,#141418,#0b0b0d);
  box-shadow:0 30px 80px -50px rgba(0,0,0,.9)}
.mkbar2{display:flex;align-items:center;gap:clamp(12px,1.8vw,24px);flex-wrap:wrap;
  padding:clamp(11px,1.3vw,16px) clamp(14px,1.7vw,22px);
  border-bottom:1px solid var(--line);background:rgba(255,255,255,.03)}
.mklogo{display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:-.02em;
  font-size:clamp(11.5px,1vw,13.5px);color:#fff;flex:none}
/* 2026-08: eskiden düz kırmızı kareydi. Artık ortadaki amblemin dişli
   silueti — aynı form, iki ölçek. 15px'te doku okunmaz, siluet okunur;
   o yüzden görsel değil satır içi SVG: her ekran yoğunluğunda keskin,
   ek dosya inmiyor, marka kırmızısını (--red) doğrudan alıyor.       */
.mklogo b{width:15px;height:15px;display:block;color:var(--red);
  box-shadow:0 0 14px -2px var(--red-glow)}
.mkrail{display:flex;align-items:center;gap:clamp(6px,.9vw,13px);flex-wrap:wrap;margin-left:auto;
  font-family:'JetBrains Mono',monospace;font-size:clamp(8.4px,.72vw,10px);
  letter-spacing:.09em;text-transform:uppercase}
.mkstep{display:flex;align-items:center;gap:5px;color:var(--tx4);transition:color .4s var(--e)}
.mkstep b{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.18);
  transition:background .4s var(--e),box-shadow .4s var(--e)}
.mkstep.done{color:var(--tx3)}.mkstep.done b{background:var(--red-soft)}
.mkstep.on{color:#fff}.mkstep.on b{background:var(--red);box-shadow:0 0 0 4px rgba(239,35,60,.18)}
.mkview{overflow:hidden;flex:0 0 auto;
  height:clamp(280px,min(37vw,calc(100vh - 210px)),470px)}
.mktrack{display:flex;width:800%;height:100%;will-change:transform}
.mkact{width:12.5%;height:100%;flex:none;padding:clamp(16px,2vw,26px);overflow:hidden;
  display:flex;flex-direction:column;gap:clamp(10px,1.3vw,16px);
  opacity:.3;transition:opacity .45s var(--e)}
.mkact.on{opacity:1}
.mklab{font-family:'JetBrains Mono',monospace;font-size:clamp(8.6px,.74vw,10.2px);
  letter-spacing:.11em;text-transform:uppercase;color:var(--tx4);flex:none}
.mkstage b,.mkstage i,.mkstage em,.mkstage u,.mkstage s{font-style:normal;text-decoration:none}

/* 1 — ham veri */
.mkcount{display:flex;gap:clamp(10px,1.4vw,20px);flex:none}
.mkcount span{display:flex;flex-direction:column;gap:2px;opacity:0;transform:translateY(6px);
  transition:opacity .45s var(--e),transform .45s var(--e)}
.mkcount span.on{opacity:1;transform:none}
.mkcount em{font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--red-soft);
  font-size:clamp(16px,1.9vw,26px);letter-spacing:-.02em}
.mkcount i{color:var(--tx4);font-size:clamp(9.5px,.8vw,11px)}
.mksplit{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(12px,1.6vw,22px);
  flex:1;min-height:0}
.mkfeed{display:flex;flex-direction:column;gap:3px;overflow:hidden;justify-content:center;
  font-family:'JetBrains Mono',monospace;font-size:clamp(8.6px,.76vw,10.4px)}
.mkfr{display:grid;grid-template-columns:auto auto auto auto 1fr auto;gap:6px;align-items:center;
  padding:4px 8px;border-radius:6px;background:rgba(255,255,255,.03);color:var(--tx3);
  opacity:0;transform:translateX(-10px);
  transition:opacity .3s var(--e),transform .3s var(--e)}
.mkfr.on{opacity:1;transform:none}
.mkfr i{color:#fff;font-weight:600}.mkfr s{color:var(--tx4)}
.mkfr em{color:var(--red-soft)}.mkfr u{color:var(--tx3)}
.mkfr b{color:var(--tx2);text-align:right}
.mksects{display:flex;flex-direction:column;gap:7px;justify-content:center}
.mksec{display:grid;grid-template-columns:1fr 2.2fr auto;gap:8px;align-items:center;
  font-size:clamp(9.6px,.82vw,11.4px);color:var(--tx3);
  opacity:0;transition:opacity .4s var(--e),color .4s var(--e)}
.mksec.on{opacity:1}
.mksec.hot{color:#fff;font-weight:600}
.mkbar{height:6px;border-radius:4px;background:rgba(255,255,255,.07);overflow:hidden}
.mkbar b{display:block;height:100%;width:0;border-radius:4px;background:rgba(255,255,255,.22);
  transition:width .7s var(--e)}
.mksec.on .mkbar b{width:var(--w)}
.mksec.hot .mkbar b{background:linear-gradient(90deg,var(--red),var(--red-soft))}
.mksec em{font-family:'JetBrains Mono',monospace;font-size:.92em;color:var(--tx4)}
.mksec.hot em{color:var(--red-soft)}

/* 2 — sinyal */
.mksig{display:flex;align-items:center;gap:clamp(10px,1.3vw,16px);padding:clamp(11px,1.4vw,18px);
  border-radius:12px;border:1px solid rgba(239,35,60,.32);
  background:linear-gradient(100deg,rgba(239,35,60,.12),rgba(255,255,255,.02));
  opacity:0;transform:translateY(10px);transition:opacity .5s var(--e),transform .5s var(--e)}
.mksig.on{opacity:1;transform:none}
.mkup{width:0;height:0;flex:none;border-left:7px solid transparent;border-right:7px solid transparent;
  border-bottom:12px solid var(--red)}
.mksig b{display:block;color:#fff;font-weight:650;font-size:clamp(12px,1.1vw,15px)}
.mksig i{display:block;color:var(--tx3);font-size:clamp(10px,.86vw,12px);margin-top:2px}
.mksig em{margin-left:auto;font-family:'JetBrains Mono',monospace;font-weight:700;
  color:var(--red-soft);font-size:clamp(15px,1.7vw,23px)}
.mkitems{display:flex;gap:7px;flex-wrap:wrap}
.mkit{display:flex;flex-direction:column;gap:2px;padding:7px 12px;border-radius:9px;
  background:rgba(255,255,255,.04);border:1px solid var(--line2);
  opacity:0;transform:translateY(6px);transition:opacity .35s var(--e),transform .35s var(--e)}
.mkit.on{opacity:1;transform:none}
.mkit i{color:var(--tx3);font-size:clamp(9.4px,.78vw,10.8px)}
.mkit em{font-family:'JetBrains Mono',monospace;color:#fff;font-size:clamp(10px,.86vw,12px)}
.mkarrow{width:2px;height:16px;margin:0 auto;background:linear-gradient(180deg,var(--red),transparent);
  opacity:0;transition:opacity .4s var(--e)}
.mkarrow.on{opacity:1}
.mkmades{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:auto}
.mkmlab{width:100%;font-family:'JetBrains Mono',monospace;font-size:clamp(8.6px,.74vw,10.2px);
  letter-spacing:.11em;text-transform:uppercase;color:var(--tx4)}
.mkmade{padding:8px 15px;border-radius:999px;background:var(--red-dim);
  border:1px solid rgba(239,35,60,.4);color:#fff;font-weight:600;
  font-size:clamp(10.5px,.9vw,12.6px);opacity:0;transform:scale(.92);
  transition:opacity .38s var(--e),transform .38s var(--e)}
.mkmade.on{opacity:1;transform:none}

/* 3 — harcama eğrisi */
.mkcurves{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.4vw,18px);
  flex:1;min-height:0}
.mkmc{display:flex;flex-direction:column;gap:7px;padding:clamp(10px,1.3vw,16px);overflow:hidden;
  border-radius:12px;background:rgba(255,255,255,.03);border:1px solid var(--line);
  opacity:0;transform:translateY(10px);transition:opacity .45s var(--e),transform .45s var(--e)}
.mkmc.on{opacity:1;transform:none}
.mkmh{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.mkmh b{color:#fff;font-weight:650;font-size:clamp(11.5px,1vw,13.6px)}
.mkdelta{font-family:'JetBrains Mono',monospace;color:var(--red-soft);
  font-size:clamp(10px,.86vw,12px);font-weight:700}
.mkcv{width:100%;flex:1;min-height:60px}
.mkcv polyline{fill:none;stroke:var(--red);stroke-width:2.4;vector-effect:non-scaling-stroke;
  stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:240;stroke-dashoffset:240}
.mkcv polygon{fill:url(#mkgrad);opacity:0;transition:opacity .6s var(--e)}
.mkmc.on .mkcv polygon{opacity:1}
.mkcv line{stroke:rgba(255,255,255,.07);stroke-width:1;vector-effect:non-scaling-stroke}
.mkax{display:flex;justify-content:space-between;font-family:'JetBrains Mono',monospace;
  font-size:8.6px;letter-spacing:.06em;color:var(--tx4);margin-top:-2px}
.mkline{display:flex;align-items:baseline;justify-content:space-between;gap:8px;
  padding-top:7px;border-top:1px solid var(--line);
  opacity:0;transition:opacity .4s var(--e)}
.mkline.on{opacity:1}
.mkline i{color:var(--tx3);font-size:clamp(9.4px,.8vw,11px)}
.mkline em{font-family:'JetBrains Mono',monospace;color:#fff;font-size:clamp(10px,.86vw,12px)}

/* 4 — risk iştahı */
/* İKİ SÜTUN AYNI HİZADA: .mkrkbox flex:1 ile sağ sütunun boşluğunu yutuyordu,
   sol sütun ortalanıp sağ yukarıda kalıyordu (Enes'in gördüğü ölçekleme hatası).
   Artık ikisi de içerik boyunda ve align-items:center ile MERKEZLERİ hizalı. */
.mksplit2{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(12px,1.8vw,26px);
  flex:1;min-height:0;align-items:center}
.mkcomps,.mkranks{display:flex;flex-direction:column;gap:9px}
.mkcomp{display:grid;grid-template-columns:1.5fr 1.6fr auto;gap:9px;align-items:center;
  font-size:clamp(9.6px,.82vw,11.4px);color:var(--tx2);
  opacity:0;transform:translateX(-8px);transition:opacity .4s var(--e),transform .4s var(--e)}
.mkcomp.on{opacity:1;transform:none}
.mkcomp.on .mkbar b{width:var(--w);background:linear-gradient(90deg,var(--red),var(--red-soft))}
.mkcomp em{font-family:'JetBrains Mono',monospace;color:#fff;font-size:.94em}
.mkrkbox{position:relative;flex:0 0 auto;display:flex;flex-direction:column;gap:8px}
.mkrk{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:clamp(9px,1.1vw,14px) clamp(11px,1.3vw,16px);border-radius:11px;
  background:rgba(255,255,255,.04);border:1px solid var(--line2);
  opacity:0;transition:opacity .4s var(--e),transform .6s var(--e),
    background .4s var(--e),border-color .4s var(--e)}
.mkrk.on{opacity:1}
/* sıralama kayması: --o hedef sıra, satır yüksekliği + boşluk kadar ötelenir */
.mkrk.moved{transform:translateY(calc((var(--o) - var(--i,0)) * 0px))}
.mkranks.on{}
.mkrk i{color:#fff;font-weight:600;font-size:clamp(11px,.95vw,13px)}
.mkrk em{font-family:'JetBrains Mono',monospace;color:var(--tx3);font-size:clamp(11px,.95vw,13px)}
.mkstage.ranked .mkrk[data-i="0"]{background:linear-gradient(100deg,rgba(239,35,60,.16),rgba(255,255,255,.02));
  border-color:rgba(239,35,60,.45)}
.mkstage.ranked .mkrk[data-i="0"] em{color:var(--red-soft);font-weight:700}
.mkstage.ranked .mkrk{order:var(--o)}
.mkrkbox{display:flex}

/* 5 — davranışsal motor */
.mkeng{display:grid;grid-template-columns:1fr 1.15fr 1.35fr;gap:clamp(10px,1.5vw,20px);
  align-items:center;flex:1;min-height:0}
.mkins{display:flex;flex-direction:column;gap:7px;justify-content:center}
.mkin{padding:7px 12px;border-radius:8px;background:rgba(255,255,255,.045);
  border:1px solid var(--line2);color:var(--tx2);font-size:clamp(9.4px,.8vw,11.2px);
  opacity:0;transform:translateX(-10px);transition:opacity .4s var(--e),transform .4s var(--e)}
.mkin.on{opacity:1;transform:none}
/* ============ TRADESELF AMBLEMİ (2026-08) ============
   Eskiden burada iki ince halka + kırmızı ışıma + <b>TradeSelf</b> vardı.
   Yerine üç katmanlı amblem geldi: dış dişli · beyin simidi · iç dişli.

   KUTU 190 → 320: orta sütunun gerçek genişliği ~396px, sahnenin iç
   yüksekliği ~372px ölçüldü; 190'lık sınır o alanın yarısını boş
   bırakıyordu. Sol sütundaki beş girdi kartı ~176px, sağdaki üç hipotez
   kartı benzer — kimse sıkışmıyor.

   YAZI KALDIRILDI: sahnenin başlığı (.mkbar2) zaten "TradeSelf · pazar
   motoru" yazıyor, amblemin içindeki ikinci "TradeSelf" tekrardı. Üstelik
   12,4px'lik yazı ≈58px genişlik istiyor, ortadaki delik en fazla 34px —
   hiçbir ölçekte sığmıyordu. engineLab verisi silinmedi: amblemin
   aria-label'ı olarak duruyor, ekran okuyucu okuyor.

   DÖNÜŞ ORANI ÖLÇÜLDÜ, seçilmedi: yarıçap profilinin Fourier dönüşümüyle
   dış dişli ~20, iç dişli 12 diş çıktı. Kavrayan dişlilerde periyot diş
   sayısıyla doğru orantılıdır: T_iç/T_dış = 12/20 = 0,6. Dış 20 sn ise iç
   12 sn. Başka bir oran mekanizmayı sahte gösterirdi.
   Yan sonuç: EKOK(20,12)=60 → ikisi tam 60 saniyede bir başlangıç
   konumuna aynı anda dönüyor.

   PERFORMANS: yalnız transform döner — derleyici katmanında koşar, düzen
   ve boyama üretmez. Perde etkin değilken animasyon DURUR (.mkact.on
   olmayan yerde play-state:paused) — görünmeyen şey dönmesin.        */
.mkcore{position:relative;display:grid;place-items:center;aspect-ratio:1;
  max-height:100%;max-width:min(100%,320px);margin:0 auto;width:100%;
  opacity:0;transition:opacity .5s var(--e)}
.mkcore.on{opacity:1}
.mkcore i{position:absolute;inset:0;display:block;background:center/contain no-repeat;
  animation-play-state:paused}
.mkcore .amDis{background-image:url(/img/ts-dis.webp);
  animation:amCCW 20s linear infinite}
.mkcore .amBeyin{inset:20%;background-image:url(/img/ts-beyin.webp)}
.mkcore .amIc{inset:29%;background-image:url(/img/ts-ic.webp);
  animation:amCW 12s linear infinite}
.mkact.on .mkcore i{animation-play-state:running}
@keyframes amCCW{to{transform:rotate(-360deg)}}
@keyframes amCW{to{transform:rotate(360deg)}}
/* hareket azaltma ve düşük performans: DÖNÜŞÜ değil pahalı olanı kes.
   Burada pahalı bir filtre yok, dönüş zaten ucuz — ama kullanıcı açıkça
   "hareketi azalt" dediyse saygı duyulur.                            */
@media(prefers-reduced-motion:reduce){.mkcore i{animation:none!important}}
html.t-mo-off .mkcore i{animation:none!important}
/* ============ MOTOR KABLOLARI (2026-08) ============
   Girdi kartları → amblem → hipotez kartları. Sahnenin anlattığı
   "girdi · motor · çıktı" zincirini görünür kılar.

   KLASÖR TELLERİNDEN ÖĞRENİLENLER, BAŞTAN UYGULANDI:
   · viewBox PİKSEL biriminde kurulur (JS ölçer, `0 0 W H` yazar) —
     tek birim, dönüşüm yok, zoom hepsini birlikte ölçekler
   · `vector-effect:non-scaling-stroke` KULLANILMAZ — o özellik çizgiyi
     cihaz uzayında çizer, ölçüm ise CSS pikselinde; ikisi zoom'da ayrışır
   · uzunluk `--L` özel değişkeniyle satır içi yazılır, dash ve offset
     ikisi de CSS'ten okur → satır içi/CSS çakışması ve !important gerekmez
   · konum ölçümü `offsetLeft/Top` ile yapılır, `getBoundingClientRect`
     ile DEĞİL: kartlar açılmadan önce `translateX(-10px)` taşıyor,
     rect bunu içerir ve uçlar kayardı. offset* düzen tabanlıdır,
     dönüşümden etkilenmez
   · ölçüm kaydırmada DEĞİL, yalnız kurulum ve yeniden boyutlandırmada  */
.mkeng{position:relative}
.mkwire{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;
  z-index:0;overflow:visible}
.mkwire path{fill:none;stroke:rgba(239,35,60,.42);stroke-width:1.2;stroke-linecap:round;
  stroke-dasharray:var(--L,300);stroke-dashoffset:var(--L,300);
  transition:stroke-dashoffset .85s var(--e);transition-delay:var(--d,0s)}
.mkwire circle{fill:var(--red);opacity:0;transition:opacity .4s var(--e) var(--d,0s)}
.mkact.on .mkwire path.on{stroke-dashoffset:0}
.mkact.on .mkwire circle.on{opacity:.85}
/* akış darbesi: kablo boyunca yürüyen kıvılcım. offset-path desteği
   yoksa JS hiç eklemez, kablolar yine çizilir.                       */
.mkwire .kiv{fill:#ff8a9b;opacity:0;animation:kivGit 2.6s linear infinite;
  animation-play-state:paused}
.mkact.on .mkwire .kiv.on{opacity:.95;animation-play-state:running}
@keyframes kivGit{from{offset-distance:0%}to{offset-distance:100%}}
.mkins,.mkcore,.mkhyps{position:relative;z-index:1}
.mkhyps{display:flex;flex-direction:column;gap:8px;justify-content:center}
@media(prefers-reduced-motion:reduce){
  .mkwire path{transition:none}
  .mkwire .kiv{animation:none;opacity:0}}
html.t-mo-off .mkwire .kiv{animation:none;opacity:0}
.mkhy{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 13px;border-radius:10px;background:rgba(255,255,255,.04);
  border:1px solid var(--line2);opacity:0;transform:translateX(10px);
  transition:opacity .4s var(--e),transform .4s var(--e),
    background .45s var(--e),border-color .45s var(--e),filter .45s var(--e)}
.mkhy.on{opacity:1;transform:none}
.mkhy i{color:var(--tx2);font-size:clamp(9.6px,.82vw,11.4px);line-height:1.3}
.mkhy em{font-family:'JetBrains Mono',monospace;color:var(--tx4);font-size:.94em;flex:none}
.mkhy.out{opacity:.22;filter:saturate(.3)}
.mkhy.lock{background:linear-gradient(100deg,rgba(239,35,60,.18),rgba(255,255,255,.02));
  border-color:rgba(239,35,60,.5);box-shadow:0 0 30px -12px var(--red-glow)}
.mkhy.lock i{color:#fff;font-weight:600}
.mkhy.lock em{color:var(--red-soft);font-weight:700}

/* 6 — karar ve sıçrama */
.mkdecs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;flex:none}
.mkdc{display:flex;flex-direction:column;gap:3px;padding:clamp(9px,1.1vw,14px);
  border-radius:11px;background:rgba(255,255,255,.04);border:1px solid var(--line2);
  opacity:0;transform:translateY(8px);transition:opacity .4s var(--e),transform .4s var(--e)}
.mkdc.on{opacity:1;transform:none}
.mkdc i{font-family:'JetBrains Mono',monospace;font-size:8.6px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tx4)}
.mkdc b{color:#fff;font-weight:650;font-size:clamp(10.4px,.88vw,12.4px);line-height:1.25}
.mkjump{display:grid;grid-template-columns:.85fr 1.3fr;gap:clamp(10px,1.4vw,18px);
  flex:1;min-height:0;align-items:stretch}
.mkjc{display:flex;flex-direction:column;gap:6px;padding:clamp(12px,1.5vw,20px);
  border-radius:13px;overflow:hidden;opacity:0;transform:translateY(12px);
  transition:opacity .5s var(--e),transform .5s var(--e)}
.mkjc.on{opacity:1;transform:none}
.mkjc.ask{background:rgba(255,255,255,.035);border:1px solid var(--line2)}
.mkjc.got{background:linear-gradient(150deg,rgba(239,35,60,.16),rgba(255,255,255,.02));
  border:1px solid rgba(239,35,60,.45);box-shadow:0 0 44px -20px var(--red-glow)}
.mkjl{font-family:'JetBrains Mono',monospace;font-size:8.6px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--tx4)}
.mkjc.got .mkjl{color:var(--red-soft)}
.mkjc b{color:#fff;font-weight:650;font-size:clamp(12px,1.15vw,16px);line-height:1.25}
.mkjc i{color:var(--tx3);font-size:clamp(9.6px,.78vw,11.2px);line-height:1.45;margin-top:auto}

/* 7 — kampanya devri */
.mkchs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;flex:none}
.mkch{display:flex;flex-direction:column;gap:4px;padding:clamp(10px,1.2vw,15px);
  border-radius:11px;background:rgba(255,255,255,.04);border:1px solid var(--line2);
  opacity:0;transform:translateY(8px);transition:opacity .4s var(--e),transform .4s var(--e)}
.mkch.on{opacity:1;transform:none}
.mkch i{color:var(--tx2);font-size:clamp(9.4px,.8vw,11.2px);line-height:1.25}
.mkch em{font-family:'JetBrains Mono',monospace;color:var(--red-soft);font-weight:700;
  font-size:clamp(12px,1.1vw,15px)}
.mkinf{display:flex;align-items:center;gap:12px;padding:clamp(11px,1.3vw,17px);border-radius:12px;
  background:rgba(239,35,60,.08);border:1px solid rgba(239,35,60,.3);
  opacity:0;transform:translateY(10px);transition:opacity .45s var(--e),transform .45s var(--e)}
.mkinf.on{opacity:1;transform:none}
.mkinf>b{width:30px;height:30px;border-radius:9px;flex:none;
  background:radial-gradient(120% 120% at 30% 20%,var(--red),#7d0d1c)}
.mkinf span{display:flex;flex-direction:column;gap:2px}
.mkinf i{color:var(--red-soft);font-family:'JetBrains Mono',monospace;font-size:9px;
  letter-spacing:.11em;text-transform:uppercase}
.mkinf em{color:#fff;font-size:clamp(10.4px,.88vw,12.4px);line-height:1.35}
.mkhand{margin-top:auto;padding-top:11px;border-top:1px solid var(--line);
  color:var(--tx2);font-size:clamp(10.4px,.9vw,12.8px);
  opacity:0;transition:opacity .45s var(--e)}
.mkhand.on{opacity:1}

/* 8 — dünya haritası */
.mkmapact{padding:0;position:relative}
.mkmapwrap{position:relative;flex:1;min-height:0;display:flex}
#mkMap{position:absolute;inset:0;width:100%;height:100%}
.mkhud{position:absolute;left:clamp(14px,1.8vw,24px);bottom:clamp(14px,1.8vw,24px);
  z-index:2;display:flex;flex-direction:column;gap:6px;padding:clamp(11px,1.3vw,17px);
  border-radius:13px;background:rgba(10,10,11,.82);backdrop-filter:blur(10px);
  border:1px solid rgba(239,35,60,.3);max-width:min(300px,58%)}
.mkhl{font-family:'JetBrains Mono',monospace;font-size:8.6px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--red-soft);margin-bottom:2px}
.mkhr{display:flex;flex-direction:column;gap:1px;opacity:0;transform:translateY(5px);
  transition:opacity .4s var(--e),transform .4s var(--e)}
.mkhr.on{opacity:1;transform:none}
.mkhr i{color:var(--tx4);font-size:clamp(8.8px,.74vw,10.2px)}
.mkhr b{color:#fff;font-weight:600;font-size:clamp(10.4px,.88vw,12.4px);line-height:1.25}
@media(max-width:860px){.mkhud{max-width:76%;left:10px;bottom:10px}}
@media(prefers-reduced-motion:reduce){.mkhr{opacity:1;transform:none}}
@media(max-width:860px){
  .mkrail{width:100%;margin-left:0;gap:5px}
  .mkstep span{display:none}
  /* 2026-08 MOTOR TAŞMASI: mobilde .mkeng tek sütuna düşüyor (girdi
     kartları + çekirdek + hipotezler alt alta) ama sahne yüksekliği
     sabitti (86vw ≈ 335px → 360'a kırpılıyordu) ve .mkact overflow:hidden
     olduğu için hipotez satırları alttan KESİLİYORDU. Enes'in kararı:
     sahne uzasın. Üst sınır ekran yüksekliğine bağlı — .mkstage'in
     max-height:calc(100vh - 60px) tavanını aşıp yeniden kırpmasın diye
     masaüstündeki formülün aynısı (100vh - 210px) kullanılıyor.
     Ölçüm notu: bu kapta yerleşim ölçülemedi (tarayıcı indirilemiyor),
     yükseklik içerik yığınından hesaplanarak seçildi — küçük ekranlarda
     (SE boyu) 100vh sınırı devreye girer ve taşma dönebilir.          */
  .mkview{height:clamp(380px,min(150vw,calc(100vh - 210px)),620px)}
  .mksplit,.mksplit2,.mkeng,.mkjump{grid-template-columns:1fr}
  /* 2026-08: yalnız yükseklik kısıtlıydı, genişlik 190'da kalıyordu →
     kutu 190×110 elipse eziliyordu. Amblem YUVARLAK olduğu için mobilde
     de kare olmalı; ikisi birden sınırlanıyor.                        */
  .mkeng .mkcore{max-height:150px;max-width:150px}
  .mkcurves{grid-template-columns:1fr;gap:7px}
  .mkmc:nth-child(3){display:none}
  .mkdecs,.mkchs{grid-template-columns:repeat(2,1fr)}
  .mkfeed .mkfr:nth-child(n+6){display:none}
}
@media(prefers-reduced-motion:reduce){
  .mkact,.mkcount span,.mkfr,.mksec,.mksig,.mkit,.mkarrow,.mkmade,.mkmc,.mkline,
  .mkcomp,.mkrk,.mkin,.mkcore,.mkhy,.mkdc,.mkjc,.mkch,.mkinf,.mkhand{
    opacity:1;transform:none;transition:none}
  /* .mkring kaldırıldı — amblem geldi, halkalar artık yok */
  .mkcv polyline{stroke-dashoffset:0}
}

/* ============ TRADE SAHNESİ (qt*) — TradeSelf platform akışı ============
   Dört perde tek pencerede yatay kayar; üstte adım rayı. Arayüz temsilîdir.
   Ölçüler cqw DEĞİL burada: bu sahne sayfa genişliğinde, kart içinde değil —
   normal duyarlı ölçüler kullanılıyor.
   DİKKAT: eski iskelet kuralları (.stsec i vb.) buraya sızmasın diye
   sahne .sdsec içinde ama .stsec DIŞINDA; kendi öneki qt*. */
/* Kilitli blok ekrandan uzun olursa alt kısmı kilit boyunca görünmez ve
   bırakışta "blok tekrarlandı" gibi durur (huni sahnesinde yaşandı).
   Kısa görüntülerde bu iki sahne de aynı riski taşıyordu — güvence kondu.
   Normal ekranlarda hiçbir görsel değişiklik YOK, sadece tavan var. */
.qtstage{border:1px solid var(--line);border-radius:18px;overflow:hidden;
  display:flex;flex-direction:column;max-height:calc(100vh - 60px);
  background:linear-gradient(168deg,#141418,#0b0b0d);position:relative;
  box-shadow:0 30px 80px -50px rgba(0,0,0,.9)}
.qtbar{display:flex;align-items:center;gap:clamp(14px,2vw,26px);flex-wrap:wrap;
  padding:clamp(11px,1.3vw,16px) clamp(14px,1.7vw,22px);
  border-bottom:1px solid var(--line);background:rgba(255,255,255,.03)}
.qtlogo{display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:-.02em;
  font-size:clamp(12.5px,1.05vw,14.5px);color:#fff;flex:none}
.qtlogo b{width:16px;height:16px;border-radius:5px;background:var(--red);
  box-shadow:0 0 14px -2px var(--red-glow)}
.qtrail{display:flex;align-items:center;gap:clamp(8px,1.1vw,16px);flex-wrap:wrap;
  margin-left:auto;font-family:'JetBrains Mono',monospace;
  font-size:clamp(9px,.78vw,10.5px);letter-spacing:.1em;text-transform:uppercase}
.qtstep{display:flex;align-items:center;gap:6px;color:var(--tx4);
  transition:color .4s var(--e)}
.qtstep b{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.18);
  transition:background .4s var(--e),box-shadow .4s var(--e)}
.qtstep.done{color:var(--tx3)}
.qtstep.done b{background:var(--red-soft)}
.qtstep.on{color:#fff}
.qtstep.on b{background:var(--red);box-shadow:0 0 0 4px rgba(239,35,60,.18)}
.qtview{overflow:hidden;flex:0 0 auto;
  height:clamp(260px,min(34vw,calc(100vh - 200px)),420px)}
.qttrack{display:flex;width:400%;height:100%;will-change:transform}
.qtact{width:25%;height:100%;flex:none;padding:clamp(18px,2.2vw,30px);
  display:flex;flex-direction:column;gap:clamp(12px,1.5vw,20px);
  opacity:.34;transition:opacity .45s var(--e)}
.qtact.on{opacity:1}

/* perde 1 — arama */
.qtsearch{display:flex;align-items:center;gap:12px;padding:clamp(12px,1.4vw,18px) clamp(14px,1.6vw,20px);
  border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line2)}
.qtsearch svg{width:18px;height:18px;color:var(--tx3);flex:none}
.qtq{color:#fff;font-size:clamp(13px,1.15vw,16px);white-space:nowrap}
.qtcar{width:1.5px;height:1.1em;background:var(--red-soft);opacity:0;flex:none}
.qtstage.typing .qtcar{opacity:1;animation:qtCar .95s step-end infinite}
@keyframes qtCar{0%,50%{opacity:1}51%,100%{opacity:0}}
.qths{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:.08em;color:var(--tx4);flex:none}
.qtchips{display:flex;gap:8px;flex-wrap:wrap}
.qtchip{padding:7px 14px;border-radius:999px;font-size:clamp(11px,.92vw,12.5px);
  color:var(--tx3);background:rgba(255,255,255,.04);border:1px solid var(--line2);
  opacity:0;transform:translateY(6px);
  transition:opacity .4s var(--e),transform .4s var(--e),border-color .4s var(--e),color .4s var(--e)}
.qtchip.on{opacity:1;transform:none;border-color:rgba(239,35,60,.4);color:#fff}
.qtfound{margin-top:auto;display:flex;align-items:baseline;gap:12px}
.qtfound em{font-family:'JetBrains Mono',monospace;font-style:normal;font-weight:700;
  font-size:clamp(26px,3.4vw,46px);color:var(--red-soft);letter-spacing:-.02em;
  font-variant-numeric:tabular-nums}
.qtfound i{font-style:normal;color:var(--tx3);font-size:clamp(12px,1vw,14px)}

/* perde 2 — alıcı listesi */
.qthead,.qtrow{display:grid;grid-template-columns:1.9fr .8fr .9fr 1fr;gap:10px;align-items:center}
.qthead{padding:0 12px 10px;border-bottom:1px solid var(--line);
  font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--tx4)}
.qthead span:not(:first-child),.qtm{text-align:right}
.qtlist{display:flex;flex-direction:column;gap:6px;margin-top:8px;overflow:hidden}
.qtrow{padding:clamp(9px,1vw,13px) 12px;border-radius:10px;
  background:rgba(255,255,255,.03);border:1px solid transparent;
  opacity:0;transform:translateY(8px);
  transition:opacity .42s var(--e),transform .42s var(--e),
             background .3s var(--e),border-color .3s var(--e)}
.qtrow.seen{opacity:1;transform:none}
.qtrow.pick{background:linear-gradient(100deg,rgba(239,35,60,.14),rgba(255,255,255,.03));
  border-color:rgba(239,35,60,.45);box-shadow:0 0 30px -14px var(--red-glow)}
.qtco{display:flex;flex-direction:column;gap:2px;min-width:0}
.qtco b{color:#fff;font-weight:600;font-size:clamp(12px,1.02vw,14px);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qtco i{font-style:normal;color:var(--tx4);font-size:clamp(10px,.82vw,11.5px)}
.qtm{display:flex;flex-direction:column;gap:2px}
.qtm em{font-style:normal;font-family:'JetBrains Mono',monospace;color:var(--tx2);
  font-size:clamp(11.5px,.95vw,13px);font-variant-numeric:tabular-nums}
.qtrow.pick .qtm em{color:#fff}
.qtm i{font-style:normal;color:var(--tx4);font-size:9.5px;letter-spacing:.06em}

/* perde 3 — karar verici */
.qtcard{border:1px solid rgba(239,35,60,.28);border-radius:14px;overflow:hidden;
  background:linear-gradient(160deg,rgba(239,35,60,.07),rgba(255,255,255,.02));
  display:flex;flex-direction:column;height:100%}
.qtch{display:flex;align-items:center;gap:12px;padding:clamp(12px,1.4vw,17px);
  border-bottom:1px solid var(--line)}
.qtav{width:34px;height:34px;border-radius:10px;flex:none;
  background:radial-gradient(120% 120% at 30% 20%,var(--red),#7d0d1c)}
.qtch>span:not(.qtver){display:flex;flex-direction:column;gap:2px;min-width:0}
.qtch em{font-style:normal;color:#fff;font-weight:650;font-size:clamp(13px,1.1vw,15px)}
.qtch i{font-style:normal;color:var(--tx4);font-size:clamp(10.5px,.86vw,12px)}
.qtver{margin-left:auto;flex:none;padding:5px 11px;border-radius:999px;
  font-size:10.5px;letter-spacing:.06em;color:var(--red-soft);
  background:rgba(239,35,60,.12);border:1px solid rgba(239,35,60,.34);
  opacity:0;transform:scale(.9);transition:opacity .4s var(--e),transform .4s var(--e)}
.qtver.on{opacity:1;transform:none}
.qtsum{list-style:none;margin:0;padding:clamp(12px,1.4vw,17px);display:flex;
  flex-direction:column;gap:8px;border-bottom:1px solid var(--line)}
.qtsum li{position:relative;padding-left:18px;color:var(--tx2);
  font-size:clamp(11.5px,.95vw,13px);line-height:1.45;
  opacity:0;transform:translateX(-6px);
  transition:opacity .4s var(--e),transform .4s var(--e)}
.qtsum li.on{opacity:1;transform:none}
.qtsum li::before{content:'';position:absolute;left:0;top:.55em;width:7px;height:7px;
  border-radius:2px;background:var(--red)}
.qtdm{padding:clamp(12px,1.4vw,17px);margin-top:auto}
.qtrole{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--tx4)}
.qtname{display:block;margin:4px 0 10px;color:#fff;font-weight:650;
  font-size:clamp(13px,1.1vw,15.5px)}
.qtcon{display:flex;gap:8px;flex-wrap:wrap}
.qtcon i{font-style:normal;padding:7px 13px;border-radius:9px;
  font-family:'JetBrains Mono',monospace;font-size:clamp(10.5px,.86vw,12px);
  color:var(--tx2);background:rgba(255,255,255,.05);border:1px solid var(--line2);
  opacity:0;transform:translateY(6px);
  transition:opacity .38s var(--e),transform .38s var(--e)}
.qtcon i.on{opacity:1;transform:none}

/* perde 4 — ilk temas */
.qtmail{border:1px solid var(--line2);border-radius:14px;background:rgba(255,255,255,.03);
  padding:clamp(14px,1.6vw,20px);display:flex;flex-direction:column;gap:9px;flex:1;min-height:0}
.qtmh{display:flex;gap:10px;align-items:baseline;padding-bottom:8px;
  border-bottom:1px solid var(--line)}
.qtmh i{font-style:normal;font-family:'JetBrains Mono',monospace;font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--tx4);flex:none;min-width:52px}
.qtmh b{color:#fff;font-weight:500;font-size:clamp(11.5px,.95vw,13px);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qtbody{margin:0;color:var(--tx2);font-size:clamp(11.5px,.95vw,13.4px);line-height:1.55;
  white-space:pre-wrap;flex:1;min-height:0;overflow:hidden}
.qtsend{margin-top:auto;display:flex;align-items:center;gap:9px;
  opacity:0;transform:translateY(6px);transition:opacity .4s var(--e),transform .4s var(--e)}
.qtsend.on{opacity:1;transform:none}
.qtsend b{padding:7px 14px;border-radius:999px;background:var(--red);color:#fff;
  font-size:clamp(10.5px,.88vw,12px);font-weight:600}
.qtreply{display:flex;align-items:center;gap:10px;padding:clamp(10px,1.2vw,15px) clamp(12px,1.4vw,18px);
  border-radius:12px;background:rgba(255,255,255,.05);border:1px solid var(--line2);
  color:var(--tx2);font-size:clamp(11.5px,.95vw,13px);
  opacity:0;transform:translateY(10px);transition:opacity .45s var(--e),transform .45s var(--e)}
.qtreply.on{opacity:1;transform:none}
.qtreply b{width:9px;height:9px;border-radius:50%;flex:none;background:#3ddc84;
  box-shadow:0 0 12px rgba(61,220,132,.5)}

@media(max-width:760px){
  .qtrail{width:100%;margin-left:0;justify-content:space-between;gap:6px}
  .qtstep span{display:none}
  .qtview{height:clamp(320px,74vw,400px)}
  .qthead,.qtrow{grid-template-columns:1.5fr .8fr .9fr}
  .qthead span:last-child,.qtm.last{display:none}
  .qtcon i{flex:1 1 100%;text-align:center}
}
@media(prefers-reduced-motion:reduce){
  .qtact,.qtchip,.qtrow,.qtsum li,.qtcon i,.qtver,.qtsend,.qtreply{
    opacity:1;transform:none;transition:none}
  .qtstage.typing .qtcar{animation:none}
}

/* ============ AKIŞ KARTI MİNİ SAHNELERİ ============
   Ölçüt: #flow (canlı iş akışı). Orada her şeyin ADI var — "Google Ads / arama",
   "Talep okundu · 0,3 sn", "Keşif randevusu / takvim". Gri çubuk hiçbir şey
   anlatmıyor, o yüzden burada da gerçek kelime ve gerçek rakam var.

   MOBİL ÖLÇEKLEME: bütün ölçüler cqw — yani GÖRÜNTÜ genişliğine değil KART
   genişliğine bağlı (.akv container-type:inline-size). Kart 336'dan 272'ye
   inince yazı da orantılı iner, taşma olmaz, ayrı bir mobil kural gerekmez.

   Hepsi transform/opacity ile: width/height animasyonu düzen tetikler,
   dokuz kart aynı anda dönerken kare düşürür.
   Bölüm kadraja girmeden hiçbiri çalışmaz (.aklive). */
.akd{position:absolute;inset:0;display:flex;flex-direction:column;
  justify-content:center;gap:2.6cqw;padding:8cqw 7cqw;
  font-size:clamp(9.2px,3.3cqw,11.4px);line-height:1.25;
  font-family:Inter,system-ui,sans-serif;letter-spacing:-.005em}
.akd *{animation-play-state:paused}
#akis.aklive .akd *{animation-play-state:running}
.akd b,.akd i,.akd em,.akd u{font-style:normal;font-weight:inherit;text-decoration:none}
.akd em,.akd .akm2,.akd .akpr{font-family:'JetBrains Mono',monospace;
  font-variant-numeric:tabular-nums}

/* ── GOOGLE ADS: "Hazır talebi yakala" — talep zaten var, o anda görün ── */
.akd-ads{gap:2.6cqw}
/* Yazılma etkisi clip-path ile: max-width animasyonu DÜZEN tetikler.
   İmleç çizgisi metnin ucuna değil arama kutusunun sağına oturuyor —
   clip ile birlikte kayan bir imleç senkron tutmayı gerektirir, kutunun
   sağındaki yanıp sönen çizgi aynı işi bedelsiz yapıyor. */
.aktype{white-space:nowrap;display:inline-block;
  clip-path:inset(0 100% 0 0);animation:akType 5.6s steps(22,end) infinite}
@keyframes akType{0%,4%{clip-path:inset(0 100% 0 0)}
  30%,88%{clip-path:inset(0 0 0 0)}96%,100%{clip-path:inset(0 100% 0 0)}}
.akd-ads .aksq{position:relative}
.akd-ads .aksq::after{content:'';position:absolute;right:3cqw;top:28%;width:1.5px;height:44%;
  background:var(--red-soft);animation:akCaret 1s step-end infinite}
@keyframes akCaret{0%,50%{opacity:1}51%,100%{opacity:0}}
.akd-ads .akrw{opacity:0;transform:translateY(1.6cqw);
  animation:akRise 5.6s var(--e) infinite}
.akd-ads .akrw:nth-child(1){animation-delay:1.7s}
.akd-ads .akrw:nth-child(2){animation-delay:1.95s}
.akd-ads .akrw:nth-child(3){animation-delay:2.15s}
.akd-ads .akrw.hot i u{display:inline-block;margin-right:1.6cqw;padding:.5cqw 1.4cqw;
  border-radius:1cqw;background:var(--red);color:#fff;font-size:.78em;font-weight:700;
  letter-spacing:.04em;text-decoration:none}
@keyframes akRise{0%,26%{opacity:0;transform:translateY(1.6cqw)}
  34%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:translateY(1.6cqw)}}
.akmini{display:flex;gap:1.6cqw;margin-top:.6cqw}
.akmini>span{flex:1;display:flex;flex-direction:column;gap:.7cqw;padding:2cqw 2.2cqw;
  border-radius:2cqw;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);
  opacity:0;animation:akRise 5.6s var(--e) infinite;animation-delay:2.6s}
.akmini>span:nth-child(2){animation-delay:2.8s}
.akmini>span:nth-child(3){animation-delay:3s}
.akmini i{color:var(--tx4);font-size:.84em}
.akmini b{color:#fff;font-weight:700;font-size:1.16em;font-family:'JetBrains Mono',monospace}
.akmini>span.hot{border-color:rgba(239,35,60,.42);background:rgba(239,35,60,.1)}
.akmini>span.hot b{color:var(--red-soft)}

/* ── META ADS: "Aramayanı da müşteri yap" — talebi sen yaratırsın ── */
.akd-social{gap:2.4cqw}
.akaud{display:flex;gap:1.4cqw;flex-wrap:wrap}
.akaud i{padding:1.4cqw 2.4cqw;border-radius:4cqw;font-size:.86em;color:var(--tx2);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  opacity:0;transform:scale(.9);animation:akChip 6s var(--e) infinite}
.akaud i:nth-child(2){animation-delay:.16s}.akaud i:nth-child(3){animation-delay:.32s}
@keyframes akChip{0%,3%{opacity:0;transform:scale(.9)}
  10%,88%{opacity:1;transform:none}96%,100%{opacity:0;transform:scale(.9)}}
.akfeed{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:2.6cqw;
  border:1px solid rgba(255,255,255,.09);background:rgba(0,0,0,.28)}
.akrail{position:absolute;inset:0 0 auto 0;display:flex;flex-direction:column;gap:2cqw;
  padding:2.4cqw;animation:akFeed 6s var(--e) infinite}
@keyframes akFeed{0%,12%{transform:translateY(0)}34%,84%{transform:translateY(-15cqw)}
  96%,100%{transform:translateY(0)}}
.akpost{display:flex;flex-direction:column;gap:1.4cqw;padding:2.2cqw;border-radius:2cqw;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.05)}
.akpost b{height:8cqw;border-radius:1.4cqw;background:rgba(255,255,255,.06)}
.akpost u{height:1.6cqw;width:62%;border-radius:1cqw;background:rgba(255,255,255,.08)}
.akpost.spon{border-color:rgba(239,35,60,.45);
  background:linear-gradient(150deg,rgba(239,35,60,.16),rgba(255,255,255,.03));
  animation:akSpon 6s var(--e) infinite}
@keyframes akSpon{0%,30%{box-shadow:0 0 0 0 rgba(239,35,60,0)}
  44%,80%{box-shadow:0 0 6cqw -1cqw var(--red-glow)}100%{box-shadow:0 0 0 0 rgba(239,35,60,0)}}
.akpost.spon em{font-family:'JetBrains Mono',monospace;font-size:.76em;letter-spacing:.12em;
  text-transform:uppercase;color:var(--red-soft)}
.akpost.spon b{background:radial-gradient(90% 90% at 70% 20%,color-mix(in srgb,var(--tB) 38%,transparent),transparent 70%),rgba(255,255,255,.05)}
.akpost.spon i{color:#fff;font-weight:600;line-height:1.3}
.akpost.spon s{align-self:flex-start;text-decoration:none;padding:1.4cqw 2.6cqw;border-radius:4cqw;
  background:var(--red);color:#fff;font-weight:600;font-size:.9em}

/* ── AI AJAN: gece vurgusu ── */
.aknight{display:flex;align-items:center;gap:2cqw;align-self:flex-start;
  padding:1.2cqw 2.4cqw;border-radius:4cqw;font-family:'JetBrains Mono',monospace;
  font-size:.82em;letter-spacing:.06em;color:var(--tx3);
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09)}
.aknight b{width:2cqw;height:2cqw;border-radius:50%;flex:none;background:var(--red);
  animation:akBlink 2.2s var(--e) infinite}
@keyframes akBlink{0%,100%{opacity:1}50%{opacity:.25}}
.akd-agent{gap:0;justify-content:center}
.akd-agent .aknight{margin-bottom:2.4cqw}

/* ── OTOMASYON: "Tekrar eden işi masandan al" ── */
.akd-auto{gap:1.8cqw}
.akhd2{display:flex;justify-content:space-between;gap:2cqw;padding:0 2.6cqw 1.4cqw;
  border-bottom:1px solid rgba(255,255,255,.1);font-family:'JetBrains Mono',monospace;
  font-size:.78em;letter-spacing:.1em;text-transform:uppercase}
.akhd2 i{color:var(--tx4)}.akhd2 em{color:var(--red-soft)}
.akjob{position:relative;display:flex;align-items:center;justify-content:space-between;
  gap:2cqw;padding:2.3cqw 2.8cqw;border-radius:2.2cqw;overflow:hidden;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);
  animation:akJob 5.6s var(--e) infinite;animation-delay:calc(var(--i)*.44s)}
.akjob i{position:relative;color:var(--tx2);
  animation:akJobT 5.6s var(--e) infinite;animation-delay:calc(var(--i)*.44s)}
.akjob b{position:relative;width:3.2cqw;height:3.2cqw;border-radius:50%;flex:none;
  border:1px solid rgba(255,255,255,.2);
  animation:akTick 5.6s var(--e) infinite;animation-delay:calc(var(--i)*.44s)}
.akjob b::after{content:'';position:absolute;left:1cqw;top:1.3cqw;width:1cqw;height:.5cqw;
  border-left:1.3px solid #fff;border-bottom:1.3px solid #fff;
  transform:rotate(-45deg) scale(0);transform-origin:center;
  animation:akTickIn 5.6s var(--e) infinite;animation-delay:calc(var(--i)*.44s)}
@keyframes akJob{0%,10%{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.07)}
  24%,86%{background:rgba(239,35,60,.1);border-color:rgba(239,35,60,.34)}
  96%,100%{background:rgba(255,255,255,.045);border-color:rgba(255,255,255,.07)}}
@keyframes akJobT{0%,10%{transform:translateX(0);color:var(--tx4)}
  24%,86%{transform:translateX(1.4cqw);color:#fff}
  96%,100%{transform:translateX(0);color:var(--tx4)}}
.aksum{display:flex;align-items:center;gap:2cqw;margin-top:.8cqw;color:var(--red-soft);
  font-weight:600;opacity:0;animation:akRise 5.6s var(--e) infinite;animation-delay:2.4s}
.aksum b{width:3cqw;height:3cqw;border-radius:50%;flex:none;background:var(--red);position:relative}
.aksum b::after{content:'';position:absolute;left:.9cqw;top:1.3cqw;width:1cqw;height:.5cqw;
  border-left:1.2px solid #fff;border-bottom:1.2px solid #fff;transform:rotate(-45deg)}

/* ── akış: mini #flow — gelen → ajan → çıkan, süreli adımlarla ── */
.akd-flow{gap:0;justify-content:center}
.akfin,.akfout{display:flex;align-items:center;gap:2.4cqw;padding:2.4cqw 3cqw;
  border-radius:2.4cqw;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.09)}
.akfin b,.akfout b{width:2.4cqw;height:2.4cqw;border-radius:50%;flex:none;background:var(--tB)}
.akfout b{background:var(--red);box-shadow:0 0 2.4cqw var(--red-glow)}
.akfin i,.akfout i{color:#fff;font-weight:600;flex:1}
.akfin em,.akfout em{color:var(--tx4);font-size:.88em}
.akwire{position:relative;height:5cqw;margin:0 auto;width:2px;
  background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.06))}
.akwire .akpk{position:absolute;left:50%;top:0;width:2.4cqw;height:2.4cqw;border-radius:50%;
  background:var(--red);box-shadow:0 0 3cqw var(--red-glow);margin-left:-1.2cqw;
  animation:akPk 3.6s var(--e) infinite}
.akwire.w2 .akpk{animation-delay:1.5s}
@keyframes akPk{0%{transform:translateY(-1.2cqw);opacity:0}
  12%{opacity:1}52%{transform:translateY(3.8cqw);opacity:1}
  60%,100%{transform:translateY(3.8cqw);opacity:0}}
.akbrain{border-radius:2.8cqw;padding:2.6cqw 3cqw;
  background:linear-gradient(160deg,rgba(239,35,60,.1),rgba(255,255,255,.03));
  border:1px solid rgba(239,35,60,.26)}
.akbh{display:flex;align-items:center;gap:2cqw;color:#fff;font-weight:650;
  padding-bottom:2.2cqw;margin-bottom:2.2cqw;border-bottom:1px solid rgba(255,255,255,.1)}
.akbh b{width:3.4cqw;height:3.4cqw;border-radius:1.2cqw;flex:none;background:var(--red);
  animation:akPulse 2.6s var(--e) infinite}
.akbh em{margin-left:auto;color:var(--red-soft);font-size:.82em}
@keyframes akPulse{0%,100%{box-shadow:0 0 0 0 rgba(239,35,60,.5)}
  70%{box-shadow:0 0 0 2.4cqw rgba(239,35,60,0)}}
.akstp{display:flex;align-items:center;gap:2cqw;padding:.9cqw 0;opacity:.3;
  animation:akStep 4.8s var(--e) infinite;animation-delay:calc(var(--i)*.42s)}
.akstp b{width:2.6cqw;height:2.6cqw;border-radius:50%;flex:none;position:relative;
  border:1px solid rgba(255,255,255,.22)}
.akstp b::after{content:'';position:absolute;left:.75cqw;top:1.1cqw;width:.9cqw;height:.45cqw;
  border-left:1px solid #fff;border-bottom:1px solid #fff;transform:rotate(-45deg)}
.akstp i{flex:1;color:var(--tx2)}
.akstp em{color:var(--tx4);font-size:.86em}
@keyframes akStep{0%,6%{opacity:.28}18%{opacity:1}
  22%{opacity:1}86%{opacity:1}96%,100%{opacity:.28}}
#akis.aklive .akstp{animation-name:akStep}
.akstp.on b,.akd-flow .akstp b{transition:none}

/* ── tırmanış: gerçek arama kutusu, rakip satırları, #1'e çıkış ── */
.akd-serp{gap:2.6cqw}
.aksq{display:flex;align-items:center;gap:2.2cqw;padding:2.6cqw 3cqw;border-radius:6cqw;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:var(--tx2)}
.aksq b{width:2.8cqw;height:2.8cqw;border-radius:50%;flex:none;
  border:1.4px solid var(--tx3);position:relative}
.aksq b::after{content:'';position:absolute;right:-1cqw;bottom:-.6cqw;width:1.4cqw;height:1.4px;
  background:var(--tx3);transform:rotate(45deg)}
.akres{display:flex;flex-direction:column;gap:1.6cqw}
.akrw{display:flex;align-items:center;justify-content:space-between;gap:2cqw;
  padding:2.2cqw 2.8cqw;border-radius:2cqw;background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.06);color:var(--tx3);
  animation:akDown 5.4s var(--e) infinite}
.akrw i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.akrw em{color:var(--tx4);font-size:.86em}
.akrw.hot{background:linear-gradient(100deg,rgba(239,35,60,.2),rgba(239,35,60,.05));
  border-color:rgba(239,35,60,.45);color:#fff;font-weight:600;
  box-shadow:0 0 5cqw -1cqw var(--red-glow);animation:akUp 5.4s var(--e) infinite}
.akrw.hot em{color:var(--red-soft);font-weight:700}
@keyframes akUp{0%,8%{transform:translateY(0)}44%,86%{transform:translateY(calc(-3*(100% + 1.6cqw)))}
  97%,100%{transform:translateY(0)}}
@keyframes akDown{0%,8%{transform:translateY(0)}44%,86%{transform:translateY(calc(100% + 1.6cqw))}
  97%,100%{transform:translateY(0)}}

/* ── sohbet: gerçek soru, gerçek cevap, kaynak rozeti ── */
.akd-chat{gap:2.6cqw;justify-content:center}
.akq{align-self:flex-start;max-width:88%;padding:2.6cqw 3.2cqw;border-radius:3cqw 3cqw 3cqw .8cqw;
  background:rgba(255,255,255,.07);color:var(--tx2);
  transform:translateY(1.6cqw);opacity:0;animation:akIn 5.6s var(--e) infinite}
.aka{align-self:flex-end;max-width:94%;padding:2.8cqw 3.2cqw;border-radius:3cqw 3cqw .8cqw 3cqw;
  background:linear-gradient(150deg,rgba(239,35,60,.16),rgba(255,255,255,.04));
  border:1px solid rgba(239,35,60,.3);display:flex;flex-direction:column;gap:1.4cqw;
  transform:translateY(1.6cqw);opacity:0;animation:akIn 5.6s var(--e) infinite;animation-delay:.9s}
.aka b{font-family:'JetBrains Mono',monospace;font-size:.78em;letter-spacing:.14em;
  text-transform:uppercase;color:var(--red-soft)}
.aka i{color:#fff;line-height:1.4}
.aka i u{text-decoration:none;color:var(--red-soft);font-weight:600}
.aka em{color:var(--tx4);font-size:.86em}
.aksrc{align-self:flex-end;font-family:'JetBrains Mono',monospace;font-size:.8em;
  color:var(--tx4);letter-spacing:.06em;opacity:0;
  animation:akIn 5.6s var(--e) infinite;animation-delay:1.7s}
@keyframes akIn{0%,3%{transform:translateY(1.6cqw);opacity:0}
  12%,86%{transform:translateY(0);opacity:1}96%,100%{transform:translateY(1.6cqw);opacity:0}}

/* ── WEB TASARIM: mini tarayıcı, GERÇEK sayfa, imleç gerçekten tıklar ──
   HATA DÜZELTİLDİ: imleç eskiden translate(%72,%86) ile konumlanıyordu;
   translate yüzdesi ÖĞENİN KENDİ kutusuna göre çözülür, imleç 3.4cqw
   genişliğinde olduğu için köşeden hiç kıpırdamıyordu. Artık koordinatlar
   cqw — ve tüm ölçüler cqw olduğu için düzen kart genişliğinden bağımsız
   orantılı, hesaplanan konumlar her boyutta doğru kalıyor.
   Hesap: .akbr 88x90cqw · çubuk 7cqw · pencere 83cqw · sayfa 111.2cqw
          kaydırma 28.2cqw · CTA çerçeve y=34.4 · Gönder y=84.9         */
.akd-site{padding:6cqw;justify-content:stretch}
.akbr{position:relative;flex:1;border-radius:3cqw;overflow:hidden;
  border:1px solid rgba(255,255,255,.13);background:#0d0d10;display:flex;flex-direction:column}
.akbb{height:7cqw;background:rgba(255,255,255,.05);display:flex;align-items:center;gap:1.2cqw;
  padding:0 2.4cqw;border-bottom:1px solid rgba(255,255,255,.08);flex:none}
.akbb b{width:1.5cqw;height:1.5cqw;border-radius:50%;background:rgba(255,255,255,.22);flex:none}
.akbb b:first-child{background:var(--red)}
.akbb span{margin-left:1.6cqw;font-family:'JetBrains Mono',monospace;font-size:.78em;color:var(--tx4)}
.akpg{display:flex;flex-direction:column;gap:2.4cqw;padding:3cqw;
  animation:akScroll 8s var(--e) infinite}
@keyframes akScroll{0%,30%{transform:translateY(0)}
  44%,100%{transform:translateY(-28.2cqw)}}
.akhero{height:34cqw;display:flex;flex-direction:column;gap:2.2cqw;padding:3cqw;
  border-radius:2.4cqw;
  background:radial-gradient(130% 130% at 85% 0%,color-mix(in srgb,var(--tB) 26%,transparent),transparent 68%),
             rgba(255,255,255,.04)}
.akhero i{color:#fff;font-weight:650;font-size:1.16em;line-height:1.22}
.akhero u{text-decoration:none;color:var(--tx3);font-size:.92em;line-height:1.3}
.akcta{align-self:flex-start;margin-top:auto;padding:1.8cqw 3.4cqw;border-radius:4cqw;
  background:var(--red);color:#fff;font-weight:600;font-size:.92em;font-family:inherit;
  animation:akCta 8s var(--e) infinite}
@keyframes akCta{0%,26%{transform:scale(1);box-shadow:0 0 0 0 rgba(239,35,60,.5)}
  30%{transform:scale(.93)}
  38%{transform:scale(1);box-shadow:0 0 0 5cqw rgba(239,35,60,0)}100%{transform:scale(1)}}
.akstory{height:22cqw;display:flex;gap:2.4cqw;padding:2.4cqw;border-radius:2.4cqw;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.05)}
.akstory>b{width:34%;border-radius:1.8cqw;flex:none;
  background:radial-gradient(90% 90% at 40% 30%,color-mix(in srgb,var(--tB) 30%,transparent),transparent 70%),
             rgba(255,255,255,.07)}
.akstory>span{flex:1;display:flex;flex-direction:column;justify-content:center;gap:1.6cqw}
.akstory>span i{height:1.5cqw;border-radius:1cqw;background:rgba(255,255,255,.1)}
.akstory>span i:nth-child(2){width:88%}.akstory>span i:nth-child(3){width:62%}
.akstat{height:14cqw;display:flex;gap:1.8cqw}
.akstat>span{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.6cqw;border-radius:2cqw;background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.07)}
.akstat b{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:1.24em;color:#fff}
.akstat>span:first-child b{color:var(--red-soft)}
.akstat i{color:var(--tx4);font-size:.8em}
.akform{height:28cqw;display:flex;flex-direction:column;gap:1.8cqw;padding:3cqw;
  border-radius:2.4cqw;background:rgba(255,255,255,.045);border:1px solid rgba(239,35,60,.24)}
.akform i{padding:2cqw 2.4cqw;border-radius:1.6cqw;background:rgba(0,0,0,.35);
  color:var(--tx4);font-size:.92em}
.aksend{align-self:flex-start;margin-top:auto;padding:1.8cqw 3.4cqw;border-radius:4cqw;
  background:var(--red);color:#fff;font-weight:600;font-size:.92em;font-family:inherit;
  animation:akSend 8s var(--e) infinite}
@keyframes akSend{0%,72%{transform:scale(1);box-shadow:0 0 0 0 rgba(239,35,60,.5)}
  76%{transform:scale(.93)}84%{transform:scale(1);box-shadow:0 0 0 5cqw rgba(239,35,60,0)}
  100%{transform:scale(1)}}
.akdone{position:absolute;left:50%;bottom:4cqw;transform:translateX(-50%) translateY(2cqw);
  padding:1.6cqw 3cqw;border-radius:4cqw;background:rgba(239,35,60,.16);
  border:1px solid rgba(239,35,60,.5);color:#fff;font-weight:600;font-size:.9em;
  white-space:nowrap;opacity:0;z-index:4;animation:akDone 8s var(--e) infinite}
@keyframes akDone{0%,80%{opacity:0;transform:translateX(-50%) translateY(2cqw)}
  86%,96%{opacity:1;transform:translateX(-50%) translateY(0)}
  100%{opacity:0;transform:translateX(-50%) translateY(2cqw)}}
/* İmleç: koordinatlar cqw. Hedefler hesaplanmış konumlar —
   CTA (15, 34.4) kaydırma 0'ken · Gönder (14, 84.9) kaydırma -28.2'deyken. */
.akcur{position:absolute;left:0;top:0;width:3.6cqw;height:4.8cqw;z-index:5;pointer-events:none;
  background:#fff;clip-path:polygon(0 0,0 74%,25% 57%,43% 97%,61% 89%,43% 51%,76% 47%);
  filter:drop-shadow(0 .6cqw 1.4cqw rgba(0,0,0,.75));opacity:0;
  animation:akCur 8s var(--e) infinite}
@keyframes akCur{
  0%{transform:translate(66cqw,78cqw);opacity:0}
  8%{opacity:1}
  24%{transform:translate(15cqw,34.4cqw);opacity:1}
  29%{transform:translate(15cqw,34.4cqw) scale(.82)}
  34%{transform:translate(15cqw,34.4cqw) scale(1)}
  50%{transform:translate(38cqw,62cqw)}
  70%{transform:translate(14cqw,84.9cqw)}
  75%{transform:translate(14cqw,84.9cqw) scale(.82)}
  80%{transform:translate(14cqw,84.9cqw) scale(1);opacity:1}
  92%{transform:translate(14cqw,84.9cqw);opacity:0}
  100%{transform:translate(66cqw,78cqw);opacity:0}}

/* ── araç: hesaplayıcı, m² gerçekten sayar ── */
@property --akm{syntax:'<integer>';inherits:false;initial-value:0}
.akd-tool{gap:2.6cqw}
.aktl{display:flex;align-items:center;justify-content:space-between;gap:2cqw;
  padding:2.4cqw 3cqw;border-radius:2.2cqw;background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.07)}
.aktl i{color:var(--tx2)}
.aktl.bg{background:linear-gradient(100deg,rgba(239,35,60,.14),rgba(255,255,255,.03));
  border-color:rgba(239,35,60,.3)}
.akm2{color:#fff;font-weight:600;font-size:1.1em;--akm:0;
  counter-reset:akm var(--akm);animation:akCount 5s var(--e) infinite}
.akm2::after{content:counter(akm) ' m²'}
@keyframes akCount{0%,6%{--akm:0}46%,86%{--akm:120}96%,100%{--akm:0}}
.akpr{color:var(--red-soft);font-weight:700;font-size:1.22em;
  opacity:0;transform:translateY(.8cqw);animation:akPrIn 5s var(--e) infinite}
@keyframes akPrIn{0%,34%{opacity:0;transform:translateY(.8cqw)}
  50%,86%{opacity:1;transform:none}96%,100%{opacity:0;transform:translateY(.8cqw)}}
.aktr{position:relative;height:1.6cqw;border-radius:1cqw;background:rgba(255,255,255,.1)}
.aktr b{position:absolute;inset:0 auto 0 0;width:100%;border-radius:1cqw;background:var(--red);
  transform-origin:left;transform:scaleX(0);animation:akFill 5s var(--e) infinite}
.aktr u{position:absolute;top:50%;left:0;width:4.2cqw;height:4.2cqw;border-radius:50%;
  background:#fff;margin:-2.1cqw 0 0 -2.1cqw;box-shadow:0 .6cqw 2cqw rgba(0,0,0,.55);
  animation:akKnob 5s var(--e) infinite}
@keyframes akFill{0%,6%{transform:scaleX(0)}46%,86%{transform:scaleX(.78)}96%,100%{transform:scaleX(0)}}
@keyframes akKnob{0%,6%{transform:translateX(0)}46%,86%{transform:translateX(calc(86cqw*.78))}
  96%,100%{transform:translateX(0)}}
.akok{display:flex;align-items:center;gap:2cqw;color:var(--tx3);font-size:.92em}
.akok b{width:3cqw;height:3cqw;border-radius:50%;flex:none;background:var(--red);position:relative}
.akok b::after{content:'';position:absolute;left:.9cqw;top:1.3cqw;width:1cqw;height:.5cqw;
  border-left:1.2px solid #fff;border-bottom:1.2px solid #fff;transform:rotate(-45deg)}

/* ── FİNANS / TRADESELF mini sahnesi ── */
.akd-trade{gap:2.2cqw}
.aktb{display:flex;flex-direction:column;gap:1.4cqw}
.aktr2{display:flex;align-items:center;gap:2cqw;padding:2cqw 2.6cqw;border-radius:2cqw;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);
  opacity:0;transform:translateY(1.4cqw);
  animation:akRise 6s var(--e) infinite;animation-delay:calc(var(--i)*.18s + .3s)}
.aktr2 i{flex:1;color:var(--tx2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aktr2 u{text-decoration:none;color:var(--tx4);font-size:.84em;flex:none}
.aktr2 em{color:#fff;font-weight:600;flex:none;font-size:.94em}
.aktr2.hot{background:linear-gradient(100deg,rgba(239,35,60,.16),rgba(255,255,255,.03));
  border-color:rgba(239,35,60,.42)}
.aktr2.hot i{color:#fff;font-weight:600}
.aktr2.hot em{color:var(--red-soft)}
.akdm{display:flex;align-items:center;gap:2.2cqw;padding:2.2cqw 2.6cqw;border-radius:2.2cqw;
  background:rgba(239,35,60,.08);border:1px solid rgba(239,35,60,.3);
  opacity:0;transform:translateY(1.4cqw);
  animation:akRise 6s var(--e) infinite;animation-delay:1.5s}
.akdm>b{width:3.6cqw;height:3.6cqw;border-radius:1.2cqw;flex:none;
  background:radial-gradient(120% 120% at 30% 20%,var(--red),#7d0d1c)}
.akdm>span{flex:1;display:flex;flex-direction:column;gap:.5cqw;min-width:0}
.akdm i{color:var(--tx4);font-size:.82em}
.akdm u{text-decoration:none;color:#fff;font-weight:600;
  font-family:'JetBrains Mono',monospace;font-size:.92em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.akdm em{flex:none;color:var(--red-soft);font-size:.8em;padding:.8cqw 1.8cqw;
  border-radius:3cqw;background:rgba(239,35,60,.14);border:1px solid rgba(239,35,60,.34)}

/* ── güven: gerçek uyum adımları sırayla onaylanır (finans) ── */
.akd-trust{gap:2.4cqw}
.aktrw{display:flex;align-items:center;gap:2.4cqw;padding:2.6cqw 3cqw;border-radius:2.2cqw;
  background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);
  animation:akRow 5.2s var(--e) infinite;animation-delay:calc(var(--i)*.5s)}
.aktrw b{width:3.4cqw;height:3.4cqw;border-radius:50%;flex:none;position:relative;
  border:1px solid rgba(255,255,255,.2);
  animation:akTick 5.2s var(--e) infinite;animation-delay:calc(var(--i)*.5s)}
.aktrw b::after{content:'';position:absolute;left:1cqw;top:1.4cqw;width:1.1cqw;height:.55cqw;
  border-left:1.3px solid #fff;border-bottom:1.3px solid #fff;
  transform:rotate(-45deg) scale(0);transform-origin:center;
  animation:akTickIn 5.2s var(--e) infinite;animation-delay:calc(var(--i)*.5s)}
.aktrw i{flex:1;color:var(--tx2)}
.aktrw em{color:var(--tx4);font-size:.86em}
@keyframes akRow{0%,8%{border-color:rgba(255,255,255,.07)}
  22%,86%{border-color:rgba(239,35,60,.3)}96%,100%{border-color:rgba(255,255,255,.07)}}
@keyframes akTick{0%,10%{background:transparent;border-color:rgba(255,255,255,.2)}
  20%,86%{background:var(--red);border-color:var(--red)}
  96%,100%{background:transparent;border-color:rgba(255,255,255,.2)}}
@keyframes akTickIn{0%,12%{transform:rotate(-45deg) scale(0)}
  22%,86%{transform:rotate(-45deg) scale(1)}96%,100%{transform:rotate(-45deg) scale(0)}}
.aksh{align-self:center;margin-top:1cqw;font-family:'JetBrains Mono',monospace;
  font-size:.8em;letter-spacing:.14em;text-transform:uppercase;color:var(--tx4)}

/* ── başlık satırı: ikon küçüldü ve yanına geçti (referans dili) ── */
.akt h3{display:flex;align-items:center;gap:9px}
.akicn{flex:none;width:19px;height:19px;color:var(--red-soft);display:grid;place-items:center}
.akicn svg{width:19px;height:19px}
.akar{flex:none;margin-left:auto;width:15px;height:15px;color:var(--tx4);
  transition:transform .32s var(--e),color .32s var(--e)}
.akar svg{width:15px;height:15px;display:block}
.akcard:hover .akar{color:var(--red-soft);transform:translate(3px,-3px)}

@media(prefers-reduced-motion:reduce){
  .akd *{animation:none!important}
  .aktype{max-width:100%}
  .akd-ads .akrw,.akmini>span,.akaud i,.aksum{opacity:1;transform:none}
  .akq,.aka,.aksrc,.akstp{opacity:1;transform:none}
  .akjob i{transform:translateX(1.4cqw);color:#fff}
  .akjob b,.aktrw b{background:var(--red);border-color:var(--red)}
  .akjob b::after,.aktrw b::after{transform:rotate(-45deg) scale(1)}
  .akrw.hot{transform:translateY(calc(-3*(100% + 1.6cqw)))}
  .akrw:not(.hot){transform:translateY(calc(100% + 1.6cqw))}
  .akd-ads .akrw{transform:none}
  .aktr b{transform:scaleX(.78)}
  .aktr u{transform:translateX(calc(86cqw*.78))}
  .akm2{--akm:120}
  .akpr{opacity:1;transform:none}
  .akcur,.akdone{opacity:0}
}


/* ============ SEKTÖR KARTLARI — premium zemin, sade duruş ============ */
.sc{background:
    radial-gradient(140% 100% at 50% 130%,color-mix(in srgb,var(--sB,#ff4d63) 12%,transparent),transparent 62%),
    var(--card)}
.sc:hover{box-shadow:0 26px 60px -30px color-mix(in srgb,var(--sA,#ef233c) 70%,transparent)}
.sc.on{box-shadow:0 26px 60px -26px color-mix(in srgb,var(--sA,#ef233c) 80%,transparent)}

/* ============ TEŞHİS BAŞLIĞI — harf harf dikey süzülme ============ */
#tespit h2 .lt{display:inline-block;overflow:hidden;vertical-align:bottom;
  padding-bottom:.06em;margin-bottom:-.06em}
#tespit h2 .lt i{display:inline-block;font-style:normal;
  transform:translateY(-112%);opacity:0}
#tespit .rv.in h2 .lt i,#tespit .shead.in h2 .lt i{
  animation:ltdrop .62s var(--e) forwards;
  animation-delay:calc(.08s + var(--k)*.028s)}
@keyframes ltdrop{to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){
  #tespit h2 .lt i{transform:none;opacity:1;animation:none}}

/* ── 12 PİKSEL TABANI ─────────────────────────────────────────────────
   Aşağıdaki seçiciler 8,5–11 piksel arasındaydı. Ziyaretçinin OKUMASI
   gereken metinler bunlar (bülten kartı bilgisi, kurucu ünvanı, dil
   değiştirici, kaynak satırı, bölüm etiketi...), o yüzden tabanı 12'ye
   çektik. Sahne/çizim içindeki mikro etiketler (#globe göstergeleri,
   .ak / .mk / .qt sahneleri) BİLEREK dışarıda: onlar metin değil,
   arayüz çizimi; büyütmek kutunun dışına taşırır.
   Bu blok tek parça — görüntüde bir şey bozulursa komple silinebilir.
   Ekranda doğrulanmadı: burada tarayıcı yok, gözle bakılması gerek.  */
.mono,
.ndf,
.langs button,
.pill span,
.hmeta,
.scrollcue span,
.tkpb,
.svgo,
.clyt em,
.aisrc,
.xstp b,
.dkimg .yr,
.fglab,
.clab,
.mt,
.mgo,
.knum,
.krole,
.fcol h5,
.fbot,
.bkc .m,
.bkc .go,
.nmeta,
.nsrc h5,
.nnext .k,
.bkf button em,
.nrhead .k,
.nrcard .m,
.nrcard span.d,
#mmenu .mlg button{font-size:12px}

/* ============ MOBİL SAHNE BÜTÇESİ (2026-08) ============
   Doktrin: mobilde süs varsayılan KAPALI, içerik varsayılan GÖRÜNÜR.
   İçerik JS gözlemcisinden izin beklemez — hızlı savurmada gözlemci geç
   kalır, ekran boş görünür. Aile listesi sitenin kendi
   prefers-reduced-motion sözleşmesinin mobil karşılığı; kaydırma-ilerleme
   bağlı sahneler (st/ai/fl — kaydırmayla senkron, gözlemci gecikmesi yok)
   ve etkileşim durumları (menü, akordeon, sektör paneli) bilinçli dışarıda.
   Bloğun SONDA durması kasıtlı: aynı özgüllükte son kural kazanır.      */
@media(pointer:coarse),(max-width:900px){
  /* -- içerik görünür doğar (Madde 1) -- */
  .rv{opacity:1;transform:none;transition:none}
  #tespit h2 .lt i{transform:none;opacity:1;animation:none}
  .tlsay,.tldd,.tlsl,.tlok{opacity:1;transform:none;transition:none}
  .tlptr{display:none}
  .tcard,.tcard.big,.tcard.sml{opacity:1;transform:none;filter:none}
  .mfg{opacity:1;transform:none;transition:none}
  .szlab,.szleak,.szout,.szend,.szarrow{opacity:1;transform:none;transition:none}
  .gnrow{opacity:1;transform:none;transition:none}
  .kdrow{opacity:1;transform:none;transition:none}
  .tppx{opacity:0}
  .tpleft,.tpcard{filter:none;opacity:1;transform:none}
  .tpwires path{stroke-dashoffset:0!important}
  .mkact,.mkcount span,.mkfr,.mksec,.mksig,.mkit,.mkarrow,.mkmade,.mkmc,.mkline,
  .mkcomp,.mkrk,.mkin,.mkcore,.mkhy,.mkdc,.mkjc,.mkch,.mkinf,.mkhand{
    opacity:1;transform:none;transition:none}
  .mkcv polyline{stroke-dashoffset:0}
  .qtact,.qtchip,.qtrow,.qtsum li,.qtcon i,.qtver,.qtsend,.qtreply{
    opacity:1;transform:none;transition:none}
  /* akış mini sahneleri BİLEREK LİSTEDE YOK (2026-08 regresyon dersi):
     ilk sürüm .akd animasyonlarını reduced-motion aynasıyla kapatıp son
     kareyi poster basmıştı — Enes kartları "bozulmuş" gördü. O demolar
     süs değil, kartın ANLATTIĞI içeriğin kendisi (bileşen kimliği).
     Süs (tam ekran katman) ile bileşen kimliği ayrı anahtarlarda. */
  /* -- backdrop-filter mobilde sıfır (Madde 4): iOS'ta kaydırma başına
     en pahalı kompozit sınıfı; evrensel + !important, gelecekte eklenen
     blur da ölür. Blur'a yaslanan panellere düz zemin aşağıda.         -- */
  *,*::before,*::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .navin{background:rgba(10,10,11,.97)}
  #xcOv{background:rgba(5,5,6,.88)}
  .dkimg .yr{background:rgba(5,5,5,.92)}
  .szbeat{background:rgba(10,10,11,.92)}
  .mkhud{background:rgba(10,10,11,.92)}
  #globe .gov{background:rgba(9,9,10,.86)}
}