/* Ust cizgiyi bolum kendisi cizer, ustteki bolum alt cizgi cizmez, yoksa iki
   kat kalin bir cizgi cikar. Figur alanin altina yaslanir, ayaklari alt
   bilginin ust cizgisine oturur. */
._contact_13dag_4 {
  margin-top: 0;
  padding: clamp(48px, 6vw, 88px) var(--gutter) 0;
  background: var(--panel);
  border-top: 2px solid var(--ink);
}

._inner_13dag_11 {
  display: grid;
  grid-template-columns: minmax(0, 660px) clamp(200px, 22vw, 340px);
  gap: clamp(24px, 3vw, 56px);
  justify-content: center;
  align-items: start;
}

._main_13dag_19 {
  max-width: 720px;
}
._main_13dag_19 .eyebrow {
  margin-bottom: 16px;
}
._main_13dag_19 h2 {
  font-size: clamp(40px, 6vw, 88px);
  line-height: 0.95;
  letter-spacing: -0.03em;
}
._lead_13dag_30 {
  margin: 20px 0 0;
  font-size: var(--text-lead);
  line-height: 1.62;
  color: var(--muted);
  max-width: 46ch;
}

._action_13dag_38 {
  display: inline-block;
  margin-top: 36px;
  padding: 12px 22px;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
  color: var(--on-ink);
  background: var(--ink);
  border: 2px solid var(--ink);
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
._action_13dag_38:hover {
  background: var(--panel);
  color: var(--ink);
}

._direct_13dag_56 {
  margin-top: 40px;
  margin-bottom: 40px;
  padding-top: 24px;
  border-top: 2px solid var(--ink);
  max-width: 620px;
}
._mail_13dag_63 {
  display: inline-block;
  font: 500 clamp(16px, 1.6vw, 20px) / 1 var(--font-mono);
  color: var(--ink);
}
._mail_13dag_63:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* +1px ince ayar ayaklari alt cizgiye oturtur.
   Cerceve yerlesimi, icindeki img belirme hareketini tasir. */
._art_13dag_75 {
  display: block;
  align-self: end;
  justify-self: start;
  position: relative;
  top: 1px;
  height: clamp(300px, 32vw, 440px);
  width: auto;
}

._art_13dag_75 img {
  display: block;
  height: 100%;
  width: auto;
}

/* Mobilde telefon gorseli ve ona ayrilan ikinci sutun kalkar. */
@media (max-width: 768px) {
  ._inner_13dag_11 {
    grid-template-columns: 1fr;
  }
  ._art_13dag_75 {
    display: none;
  }
}
._foot_dba9w_1 {
  border-top: 2px solid var(--ink);
  background: var(--surface);
}

/* .wrap ile ayni class'i tasidigi icin (bkz. Footer.tsx) tek basina .inner,
   .wrap'in padding'iyle esit onem derecesinde kalir ve kim sonra yuklenirse o
   kazanir. .foot .inner iki class'lik bir secici oldugu icin bu belirsizligi
   ortadan kaldirip her zaman kazaniyor. */
._foot_dba9w_1 ._inner_dba9w_6 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 26px 0;
  font-size: 13px;
  color: var(--faint);
}

._inner_dba9w_6 nav {
  display: flex;
  gap: 18px;
}
._inner_dba9w_6 a:hover {
  color: var(--ink);
}

/* telif metni + uc link tek satirda sigmiyordu, sayfa yatay taşıyordu
   (scrollWidth > innerWidth) — mobilde alt alta diziliyor */
@media (max-width: 768px) {
  ._foot_dba9w_1 ._inner_dba9w_6 {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
  }
}
/* hero'nun uzerinde seffaf duran ust bar, mockup'taki .top ile ayni mantik */
._top_1goah_1 {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 20;
}

/* global.css'teki .wrap'i kullanmiyoruz cunku header tam genislik istiyor,
   .wrap'in max-width:1040px kisitini her seferinde ezmek yerine hic almiyoruz */
._inner_1goah_10 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: var(--header-height);
  max-width: none;
  padding: 0 var(--gutter);
}

._brand_1goah_19 {
  height: 24px;
  width: auto;
}

._nav_1goah_24 {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 13.5px;
}

._links_1goah_31 {
  display: flex;
  gap: 24px;
}
._links_1goah_31 a {
  opacity: 0.7;
  transition: opacity 0.14s ease;
}
._links_1goah_31 a:hover {
  opacity: 1;
}
/* bulunulan disiplin tam opak ve alti cizili durur, landing'de hic kullanilmaz */
._links_1goah_31 a[aria-current='page'] {
  opacity: 1;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 6px;
}

._langButton_1goah_51 {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  opacity: 0.7;
}
._langButton_1goah_51:hover {
  opacity: 1;
}
._langActive_1goah_63 {
  font-weight: 700;
  opacity: 1;
}

/* masaustunde hic gorunmuyor, sadece 768px altinda devreye giriyor */
._burger_1goah_69 {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 28px;
  height: 28px;
  padding: 0;
  background: none;
  border: none;
  cursor: pointer;
}
._burger_1goah_69 span {
  display: block;
  height: 2px;
  background: var(--ink);
}

/* panel her zaman DOM'da durur, acik degilken 768px ustunde de altinda da
   gizli — boylece JS state'i acik/kapali arasinda gecerken gorunurluk
   sadece CSS'e bagli kalir, extra bir kosullu render'a gerek kalmaz */
._mobileNav_1goah_90 {
  display: none;
}

@media (max-width: 768px) {
  /* mobilde hero artik tam ekran degil, header'in seffaf uste binmesine
     gerek yok — normal akista durup Hero'yu asagi itiyor */
  ._top_1goah_1 {
    position: static;
  }

  ._nav_1goah_24 {
    display: none;
  }
  ._burger_1goah_69 {
    display: flex;
  }

  ._mobileNav_1goah_90._mobileNavOpen_1goah_108 {
    display: flex;
    flex-direction: column;
    padding: 4px var(--gutter) 20px;
    background: var(--paper);
    border-bottom: 2px solid var(--ink);
  }
  ._mobileNav_1goah_90 a {
    padding: 14px 0;
    border-top: 1px solid var(--line);
    font: 700 15px var(--font-display);
  }
  ._mobileLang_1goah_120 {
    padding-top: 14px;
  }
}
/*
file: HeroLayout.module.css
importable: .hero, .copy, .art

Butun PaktLabs sitelerinin hero'larinda ortak olan masaustu yerlesimi. Bugun
landing ve data'nin hero'lari ile ortak bulunamadi sayfasi kullaniyor, web ve
automation siteleri kuruldugunda onlarin hero'lari da buradan baslar. Bilesen
bu dosyayi kendi stil dosyasindan once import eder ve iki sinifi birlikte
verir:

  import layout from '@paktlabs/brand/styles/HeroLayout.module.css'
  import styles from './Hero.module.css'

  <section className={cx(layout.hero, styles.hero)}>

Cizimin orani her sitede farkli oldugu icin site kendi .art sinifinda
--art-ratio verir, bu deger olmadan cizim kutusu cozulmez. Yazi stilleri,
rise siralari, dugme, zemin rengi ve mobil duzen sitede kalir, buraya siteye
ozel hicbir sey girmez.

description: Sitelerin hero bolumlerinde metni ve cizimi header'in altinda kalan alanin dikey ortasina yerlestiren ortak masaustu yerlesimi.
*/

/* NOTE: site bu kurallari esit onemdeki bir kuralla ezer, mobil duzenler de
   boyle kurulur. Bu yalnizca buradaki kurallar derlenen CSS'te sitenin
   kurallarindan once gelirse calisir. Bilesende import sirasi bu yuzden
   once bu dosya, sonra kendi stil dosyasi.

   XXX: composes kullanilmaz. composes bu dosyanin kurallarini kullanan her
   stil dosyasinin icine ayrica kopyaliyor, 2026-10-09'da Vite 8 ile
   goruldu. Ikinci bir kullanici geldiginde, ornegin bulunamadi sayfasi,
   onun kopyasi data hero'sunun mobil kurallarindan sonra geldi ve mobil
   hero masaustu duzenine dondu. import ile dosya derlemeye bir kez girer */

/* hero ekrani kaplar ve alt cizgiyle bir sonraki bolumden ayrilir. Header
   seffaf olarak hero'nun ustunde durur ve kendi yuksekligi kadar yer kaplar,
   ust bosluk bu pay kadardir. Boylece metin de cizim de header'in altinda
   kalan alanin ortasina gore hizalanir */
._hero_murxq_3 {
  position: relative;
  min-height: 100svh;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 32px;
  padding: var(--header-height) var(--gutter) 0;
  border-bottom: 2px solid var(--ink);
  overflow: hidden;
}

/* metin ilk sutunda kendi genisligini alir ve header'in altindaki alanin
   dikey ortasinda durur. Satir ve sutun acikca verilir, cunku bazi sitelerde
   cizim DOM'da metinden once gelir */
._copy_murxq_3 {
  grid-column: 1;
  grid-row: 1;
  position: relative;
  z-index: 2;
  min-height: calc(100svh - var(--header-height));
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* cizim kalan sutuna sigar, dikeyde ortalanir ve zemine oturmadan havada
   durur. En fazla yuksekligi ve saga ne kadar yaklasacagi tokens.css'te
   --hero-art-height ve --hero-art-right-share olarak butun siteler icin ortak.
   Genislik siniri bu yukseklikten oranla hesaplanir, baslik alani daraldiginda
   cizim oranini bozmadan bundan da kuculur.
   Sutunda bosta kalan alan, sutun genisligi eksi cizimin en fazla
   genisligidir, bu alanin --hero-art-right-share kadari cizimin sagina kalir.
   Cizim sutunu tamamen doldurdugunda bosta alan sifirdir, sag bosluk da sifir
   kalir ve cizim hicbir ekranda tasmaz */
._art_murxq_3 {
  --art-width: calc(var(--hero-art-height) * var(--art-ratio));
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  /* grid ogesinde yuzdelik margin grid alaninin genisligine gore cozulur */
  margin-right: calc(max(0px, 100% - var(--art-width)) * var(--hero-art-right-share));
  width: 100%;
  max-width: var(--art-width);
  aspect-ratio: var(--art-ratio);
  z-index: 1;
}
._art_murxq_3 img {
  width: 100%;
  height: 100%;
}
/* veri sayfasinin hero'su. Masaustu yerlesimi landing'le ortak ve brand'deki
   HeroLayout.module.css'ten gelir, burada yalnizca bu sayfaya ozel olanlar
   durur. Metinler landing'deki gibi global.css'teki rise sinifiyla sirayla
   yukselir, burada yalnizca siralari verilir */
._hero_15oxl_5 {
}

._copy_15oxl_8 {
}

._title_15oxl_11 {
  --rise-delay: 0.12s;
  font-size: clamp(96px, 17vw, 300px);
  line-height: 0.82;
  letter-spacing: -0.055em;
}

._lead_15oxl_18 {
  --rise-delay: 0.24s;
  margin: 30px 0 0;
  max-width: 40ch;
  font-size: var(--text-lead);
  line-height: 1.62;
  color: var(--muted);
}

/* son yayin tarihi, ustunde kalin bir cizgiyle aciklamadan ayrilir. Gun, ay
   ve yil aralarinda soluk egik cizgilerle tek satir durur, etiket ustte */
._counts_15oxl_29 {
  --rise-delay: 0.36s;
  display: flex;
  gap: 32px;
  max-width: 460px;
  margin: 28px 0 0;
  padding: 18px 0 0;
  border-top: 2px solid var(--ink);
}
._counts_15oxl_29 div {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
._counts_15oxl_29 dt {
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
}
._counts_15oxl_29 dd {
  margin: 0;
  font: 700 28px/1 var(--font-display);
  letter-spacing: -0.03em;
}
._counts_15oxl_29 ._sep_15oxl_54 {
  color: var(--faint);
  font-weight: 500;
}

/* dugme landing'deki gibi yukselmez, yalnizca belirir. Metin blogu dikey
   flex oldugu icin dugme kendi genisliginde kalsin diye sola yaslanir, yoksa
   sutun boyunca uzanir */
._cta_15oxl_62 {
  align-self: flex-start;
  --rise-delay: 0.5s;
  --rise-offset: 0px;
  margin-top: 30px;
}

/* --art-ratio hero.svg'nin viewBox oranidir, cizim degisirse yalnizca bu
   deger guncellenir */
._art_15oxl_71 {
  --art-ratio: 2972.0993 / 1239.5531;
}

/* mobilde header akista durur, metin ustte, cizim altta icerik genisliginin
   tamamini kaplar ve alt cizgiden bir bosluk birakir */
@media (max-width: 768px) {
  ._hero_15oxl_5 {
    display: block;
    min-height: 0;
    padding: 0 var(--gutter);
  }
  ._copy_15oxl_8 {
    min-height: 0;
    padding: 40px 0 36px;
  }
  ._title_15oxl_11 {
    font-size: clamp(110px, 38vw, 220px);
  }
  ._art_15oxl_71 {
    max-width: none;
    margin: 0 0 48px;
  }
}
/* panoya tutturulmus kagit. Egiklik --tilt ile Services.module.css'ten
   gelir, kagit kendi yerini bilmez. Kagidin ustundeki altin raptiye
   ::before ile cizilir */
._note_gj1fu_4 {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  height: 100%;
  min-height: 196px;
  padding: 34px 24px 22px;
  color: var(--ink);
  background: var(--surface);
  border: 2px solid var(--ink);
  box-shadow: 4px 5px 0 var(--ink);
  rotate: var(--tilt, 0deg);
}
._note_gj1fu_4::before {
  content: '';
  position: absolute;
  top: -11px;
  left: 50%;
  width: 18px;
  height: 18px;
  margin-left: -9px;
  border-radius: 50%;
  background: var(--gold);
  border: 2px solid var(--ink);
}

/* belirme iletisim kutulari ve landing'in disiplin kartlari gibi: kagit on
   iki piksel yukaridan kisa surede duser, kagitlar kirk bes milisaniye
   arayla gelir. Brand'deki reveal varsayilan olarak asagidan ve daha yavas
   yukseliyor, burada yalnizca onun degiskenleri verilir. Egiklik rotate'te,
   kalkma translate'te durdugu icin belirme hareketi onlara karismaz.
   Egilme, kalkma ve golge gecisleri reveal'in transition'ini kendi
   baslarina veremedigi icin --reveal-extra'ya yazilir, belirmeden sonra
   gecikmesiz calisirlar */
._note_gj1fu_4 {
  --reveal-from: -12px;
  --reveal-time: 0.28s;
  --reveal-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --reveal-step: 45ms;
  --reveal-extra: rotate 0.2s ease, translate 0.2s ease, box-shadow 0.2s ease;
}

/* uzerine gelinen ya da klavyeyle odaklanan kagit duzlesir ve kalkar,
   basliginin altina altin bir cizgi cekilir */
._note_gj1fu_4:hover,
._note_gj1fu_4:focus-visible {
  rotate: 0deg;
  translate: 0 -4px;
  box-shadow: 6px 8px 0 var(--ink);
}
._note_gj1fu_4:hover ._title_gj1fu_55,
._note_gj1fu_4:focus-visible ._title_gj1fu_55 {
  text-decoration: underline;
  text-decoration-color: var(--gold);
  text-decoration-thickness: 4px;
  text-underline-offset: 5px;
}

._number_gj1fu_63 {
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.14em;
  color: var(--faint);
}
._title_gj1fu_55 {
  font: 700 clamp(22px, 2vw, 28px) / 1.05 var(--font-display);
  letter-spacing: -0.02em;
}
._summary_gj1fu_72 {
  margin: 0;
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.45;
  color: var(--muted);
}
._go_gj1fu_78 {
  margin-top: auto;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
}
/* hero'nun altinda, calismalarin ustunde panel zeminli bir pano. Hero alt
   cizgisini kendisi cizdigi icin bolum yalnizca altina cizgi ceker */
._services_ihzl5_3 {
  padding: clamp(56px, 6vw, 88px) var(--gutter) clamp(72px, 7vw, 104px);
  background: var(--panel);
  border-bottom: 2px solid var(--ink);
}

._head_ihzl5_9 {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px 40px;
  margin-bottom: clamp(40px, 4.5vw, 60px);
}
._head_ihzl5_9 .eyebrow {
  margin-bottom: 14px;
}
._head_ihzl5_9 h2 {
  font-size: var(--text-section);
  line-height: 1.12;
  letter-spacing: -0.02em;
}
._lead_ihzl5_24 {
  max-width: 40ch;
  margin: 0;
  font-size: var(--text-lead);
  line-height: 1.6;
  color: var(--muted);
}

/* kagitlarin egiklikleri sirayla tekrar eder, alti kagitta ayni ritim
   olusur. Yedinci bir hizmet gelirse dizi bastan doner, ayri bir ayar
   gerekmez */
._board_ihzl5_35 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 52px 40px;
  margin: 0;
  padding: 11px 12px 0;
  list-style: none;
}
._board_ihzl5_35 li:nth-child(6n + 1) {
  --tilt: -1.6deg;
}
._board_ihzl5_35 li:nth-child(6n + 2) {
  --tilt: 1.1deg;
}
._board_ihzl5_35 li:nth-child(6n + 3) {
  --tilt: -0.6deg;
}
._board_ihzl5_35 li:nth-child(6n + 4) {
  --tilt: 0.9deg;
}
._board_ihzl5_35 li:nth-child(6n + 5) {
  --tilt: -1.2deg;
}
._board_ihzl5_35 li:nth-child(6n + 6) {
  --tilt: 1.5deg;
}

@media (max-width: 1024px) {
  ._board_ihzl5_35 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 768px) {
  ._head_ihzl5_9 {
    flex-direction: column;
    align-items: flex-start;
  }
  ._board_ihzl5_35 {
    grid-template-columns: minmax(0, 1fr);
    gap: 40px;
    padding: 11px 6px 0;
  }
}
/* panel yuksekligi sifirdan icerigine kayarak acilir, satirlar sirayla
   duser. grid-template-rows gecisini desteklemeyen tarayicida panel
   animasyonsuz acilip kapanir, davranis ayni kalir. Zemin kagit, ustteki
   hizmetler panosunun panel zemininden ayrissin diye */
._panel_1txeg_5 {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s ease;
}
._open_1txeg_10 {
  grid-template-rows: 1fr;
}
._inner_1txeg_13 {
  overflow: hidden;
  min-height: 0;
}

._list_1txeg_18 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: clamp(24px, 3.4vw, 48px);
  margin: 0;
  padding: 8px var(--gutter) 28px;
  list-style: none;
  border-bottom: 2px solid var(--ink);
}
._open_1txeg_10 ._list_1txeg_18 li {
  animation: drop 0.28s cubic-bezier(0.2, 0.7, 0.2, 1) backwards;
  animation-delay: calc(var(--i) * 45ms);
}

/* her satir bir onay kutusu, etiketi ve sayisi. Gercek kutu gorunmez ama
   yerinde durur, odak ve secim onun uzerinden gelir, gorunen kare hemen
   yanindaki .box'tir */
._option_1txeg_35 {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line-strong);
  cursor: pointer;
}
._input_1txeg_44 {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
._box_1txeg_34 {
  flex: none;
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  background: var(--paper);
  border: 2px solid var(--ink);
  transition: background 0.15s ease;
}
._input_1txeg_44:checked + ._box_1txeg_34 {
  background: var(--gold);
}
._input_1txeg_44:checked + ._box_1txeg_34::after {
  content: '✓';
  font: 700 13px/1 var(--font-mono);
}
._input_1txeg_44:focus-visible + ._box_1txeg_34 {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}
._option_1txeg_35:hover ._box_1txeg_34 {
  background: var(--panel);
}
._option_1txeg_35:hover ._input_1txeg_44:checked + ._box_1txeg_34 {
  background: var(--gold);
}

._label_1txeg_79 {
  font: 500 clamp(17px, 1.5vw, 20px) / 1.2 var(--font-display);
  letter-spacing: -0.01em;
}
._count_1txeg_83 {
  margin-left: auto;
  font: 700 12px/1 var(--font-mono);
  color: var(--faint);
}

@media (max-width: 1024px) {
  ._list_1txeg_18 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  ._list_1txeg_18 {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* kutucuklar yan yana dizilir, sigmayan alt satira iner. Liste kendi
   disinda bosluk birakmaz, nerede duracagini kullanan yer belirler */
._tags_v6jux_3 {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
._tags_v6jux_3 li {
  padding: 5px 7px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--faint);
  border: 1.5px solid var(--gray);
}
/* logo dosyasi kalip olarak kullanilir, gorunen renk zemin rengidir ve o da
   yazi rengini izler. Maske yalnizca icerik kutusuna uygulanir, boylece
   kullanan yer padding ile logonun etrafinda bosluk birakabilir. Eski Safari
   maskeyi yalnizca -webkit- onekiyle taniyor */
._logo_i5qrw_5 {
  display: block;
  background-color: currentColor;
  -webkit-mask: var(--logo) center / contain no-repeat content-box;
  mask: var(--logo) center / contain no-repeat content-box;
  /* yuksek karsitlik modunda tarayici zemin rengini kendi rengiyle degistirir,
     logo zeminle ayni renge donup kaybolurdu */
  forced-color-adjust: none;
}
/* kart ayri kutulardan olusur, aralarinda alti piksellik bosluk kalir.
   Landing'deki disiplin kartlarinin dili: hover'da butun kutular birlikte
   kalkar ve altlarina sert bir golge duser */
._card_1cqtj_4 {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
  gap: 6px;
}

/* ayni satirdaki kartlarin baslik kutulari ortak bir satir yuksekligine
   baglanir. Baslik iki ya da uc satira kirildiginda o satirdaki butun baslik
   kutulari en uzununun boyunu alir, alt kutular ayni hizadan baslar. Kart
   izgarada iki satir tutar, satirlarini izgaradan alir. subgrid desteklemeyen
   tarayici bu blogu atlar ve kartlar ustteki kendi satirlariyla cizilir */
@supports (grid-template-rows: subgrid) {
  ._card_1cqtj_4 {
    grid-row: span 2;
    grid-template-rows: subgrid;
  }
}

._box_1cqtj_24 {
  background: var(--paper);
  border: var(--card-border);
  transition:
    transform var(--lift-time) ease,
    box-shadow var(--lift-time) ease;
}
._card_1cqtj_4:hover ._box_1cqtj_24 {
  transform: translateY(var(--lift));
  box-shadow: var(--lift-shadow);
}
._card_1cqtj_4:hover h3,
._card_1cqtj_4:hover ._go_1cqtj_36 {
  text-decoration: underline;
  text-underline-offset: 3px;
}

._head_1cqtj_41 {
  padding: clamp(18px, 2vw, 24px) 20px;
  text-align: center;
}
._head_1cqtj_41 .eyebrow {
  margin-bottom: 10px;
}
._head_1cqtj_41 h3 {
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.05;
  letter-spacing: -0.03em;
}

._panel_1cqtj_54 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  padding: 22px 24px 24px;
}
._body_1cqtj_61 {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
._body_1cqtj_61 p {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--muted);
}
._body_1cqtj_61 ._lead_1cqtj_72 {
  font-size: 15.5px;
  color: var(--ink);
}

._go_1cqtj_36 {
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
  color: var(--ink);
}

/* one cikan calisma tam satir tutar: baslik kutusu iki sutunu boydan boya
   kaplar, altinda solda metin, sagda teknik detaylar durur */
._feature_1cqtj_85 {
  grid-column: 1 / -1;
  grid-template-columns: 1fr 1.15fr;
  grid-template-rows: auto 1fr;
}
._feature_1cqtj_85 ._head_1cqtj_41 {
  grid-column: 1 / -1;
}
._feature_1cqtj_85 ._head_1cqtj_41 h3 {
  font-size: clamp(34px, 4.4vw, 64px);
  line-height: 0.98;
}
._feature_1cqtj_85 ._panel_1cqtj_54 {
  padding: clamp(22px, 2.6vw, 34px);
}
._feature_1cqtj_85 ._body_1cqtj_61 p {
  font-size: var(--text-lead);
  line-height: 1.62;
}
._feature_1cqtj_85 ._body_1cqtj_61 ._lead_1cqtj_72 {
  font-size: clamp(17px, 1.5vw, 20px);
}

._detail_1cqtj_108 {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22px;
  padding: clamp(22px, 2.6vw, 34px);
}
._facts_1cqtj_115 {
  margin: 0;
  padding: 0;
  list-style: none;
}
._facts_1cqtj_115 li {
  display: flex;
  gap: 18px;
  align-items: baseline;
  padding: 12px 0;
  border-top: 2px solid var(--ink);
  font: 500 clamp(15px, 1.4vw, 18px) var(--font-display);
}
._facts_1cqtj_115 li:last-child {
  border-bottom: 2px solid var(--ink);
}
._label_1cqtj_131 {
  flex: none;
  width: 96px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
}
._tools_1cqtj_139 {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
}
._mini_1cqtj_145 {
  display: flex;
  gap: 8px;
}
/* kutu ayri bir span, cunku TechLogo zemin rengini logonun rengi olarak
   kullaniyor, kutunun zemini onun uzerinde duramaz */
._tool_1cqtj_139 {
  width: 48px;
  height: 48px;
  padding: 7px;
  background: var(--surface);
  border: var(--card-border);
}
._toolLogo_1cqtj_158 {
  width: 100%;
  height: 100%;
  color: var(--ink);
}

/* tabletin dar ucunda one cikan kartin iki sutunu alt alta iner */
@media (max-width: 1100px) {
  ._feature_1cqtj_85 {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
  }
}
/* calismalar bolumu iki parcadir: kagit zeminde baslik ve suzgec satiri,
   altinda landing'in disiplin bandiyla ayni altin zeminde kart izgarasi.
   README'ye gore altin zemin olarak yalnizca burada kullanilir */
._head_1ol14_4 {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 28px 40px;
  margin-top: clamp(48px, 5vw, 72px);
  padding: 0 var(--gutter) clamp(28px, 3.5vw, 44px);
  border-bottom: 2px solid var(--ink);
}
._head_1ol14_4 .eyebrow {
  margin-bottom: 14px;
}
._head_1ol14_4 h2 {
  max-width: 24ch;
  font-size: var(--text-section);
  line-height: 1.12;
  letter-spacing: -0.02em;
}

/* Tumu ve Filtrele dugmeleri. Basilmis Tumu ile secim yapilmis Filtrele
   murekkep zemine doner, acik panelin dugmesi panel zemini alir */
._filters_1ol14_25 {
  display: flex;
  gap: 8px;
  min-width: 0;
}
._chip_1ol14_30 {
  padding: 9px 14px;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
  color: var(--ink);
  background: var(--paper);
  border: 2px solid var(--ink);
  cursor: pointer;
  white-space: nowrap;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
._chip_1ol14_30:hover,
._chip_1ol14_30[aria-expanded='true'] {
  background: var(--panel);
}
._chip_1ol14_30[aria-pressed='true'],
._chipOn_1ol14_48 {
  background: var(--ink);
  color: var(--on-ink);
}
._chipOn_1ol14_48:hover,
._chipOn_1ol14_48[aria-expanded='true'] {
  background: var(--ink);
}
._count_1ol14_56 {
  margin-left: 6px;
}
._caret_1ol14_59 {
  display: inline-block;
  margin-left: 8px;
  transition: transform 0.2s ease;
}
._chip_1ol14_30[aria-expanded='true'] ._caret_1ol14_59 {
  transform: rotate(180deg);
}

/* Alt cizgi yok, hemen alttaki ortak iletisim bolumu ust cizgisini kendisi
   cizer. */
._band_1ol14_70 {
  padding: clamp(40px, 5vw, 72px) var(--gutter) clamp(56px, 7vw, 96px);
  background: var(--gold);
}

._grid_1ol14_75 {
  max-width: var(--maxw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2.5vw, 28px);
}

/* bos sonuc uyarisi izgarayla ayni sutunda durur. Kutu kartlarin kutusuyla
   ayni malzemeden, kagit zemin ve murekkep cerceve, ama gosterissiz: tek
   paragraf, golge ve hover yok */
._status_1ol14_86 {
  max-width: var(--maxw);
  margin: 0 auto;
}
._empty_1ol14_90 {
  max-width: 560px;
  margin: 0;
  padding: 20px 24px;
  background: var(--paper);
  border: 2px solid var(--ink);
  font-size: 15px;
  line-height: 1.55;
}

@media (max-width: 1100px) {
  ._grid_1ol14_75 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 768px) {
  ._head_1ol14_4 {
    flex-direction: column;
    align-items: flex-start;
    margin-top: clamp(40px, 10vw, 64px);
  }
  ._filters_1ol14_25 {
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 4px;
  }
  ._grid_1ol14_75 {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* masaustu yerlesimi hero'larinki, bilesen HeroLayout'un siniflarini bu
   dosyanin siniflariyla birlikte verir. Hero'dan farki alt cizginin olmamasi,
   cunku hemen altinda alt bilgi geliyor ve onun kendi ust cizgisi var, ikisi
   ust uste binince iki kat kalin bir cizgi cikiyordu */
._notFound_x3lst_5 {
  border-bottom: 0;
}

._code_x3lst_9 {
  --rise-delay: 0s;
}

/* metin sutunu max-content oldugu icin baslik kendiliginden hic kirilmaz ve
   cizimin yerini yer. Genislik siniri onu iki satira indirir, balance da iki
   satiri dengeler. balance desteklemeyen tarayici bunu yok sayar */
._title_x3lst_16 {
  --rise-delay: 0.12s;
  max-width: 11ch;
  margin-top: 18px;
  text-wrap: balance;
  font-size: clamp(40px, 6vw, 88px);
  line-height: 0.98;
  letter-spacing: -0.03em;
}

._lead_x3lst_26 {
  --rise-delay: 0.24s;
  margin: 26px 0 0;
  max-width: 40ch;
  font-size: var(--text-lead);
  line-height: 1.62;
  color: var(--muted);
}

/* dugme hero'lardaki gibi yukselmez, yalnizca belirir. Dikey flex icinde
   sutun boyunca uzamasin diye sola yaslanir */
._back_x3lst_37 {
  --rise-delay: 0.36s;
  --rise-offset: 0px;
  align-self: flex-start;
  margin-top: 34px;
}

/* --art-ratio barrier.svg'nin viewBox oranidir, cizim degisirse yalnizca bu
   deger guncellenir */
._art_x3lst_46 {
  --art-ratio: 1134.8297 / 1198.7447;
}

/* mobilde header akista durur, metin ustte, cizim altta. Cizim neredeyse kare
   oldugu icin icerik genisligini tamamen kaplarsa telefonda ekrandan uzun
   olur, bu yuzden bir genislik siniri var ve sola yaslanir, metinle ayni
   kenardan baslasin diye */
@media (max-width: 768px) {
  ._notFound_x3lst_5 {
    display: block;
    min-height: calc(100svh - var(--header-height));
    padding: 0 var(--gutter);
  }
  ._copy_x3lst_60 {
    min-height: 0;
    padding: 56px 0 36px;
  }
  ._art_x3lst_46 {
    max-width: 360px;
    margin: 0 0 48px;
  }
}
/* hizmet sayfasinin bolumleri ekranin iki kenarina kadar uzanir, icerik
   landing'in icerik genisliginde ortalanir. Bolumleri iki piksellik
   murekkep cizgi ayirir, kapak cizgisiz baslar */
._section_123v7_4 {
  padding: clamp(56px, 7vw, 96px) var(--gutter);
  border-top: 2px solid var(--ink);
}
._inner_123v7_8 {
  max-width: var(--maxw);
  margin: 0 auto;
}

/* bolum basi: ustte mono etiket, altinda baslik */
._title_123v7_14 {
  margin-top: 14px;
  font-size: var(--text-section);
  line-height: 1;
  letter-spacing: -0.03em;
}

/* kapsam ve surec bolumlerinin cizimi. Bolumun icinde dikeyde ortada,
   havada durur, alt cizgiye basmaz. Orani burada sabit, cizim gelince
   yerlesim degismez */
._art_123v7_24 {
  margin: 0;
  aspect-ratio: 5 / 6;
}
._art_123v7_24 img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 768px) {
  ._art_123v7_24 {
    width: min(100%, 280px);
  }
}
/* koyu bant alt bilgiye kadar iner, alt boslugu gecis satiri tasir */
._closing_1gecn_2 {
  padding-bottom: 0;
  background: var(--ink);
  color: var(--on-ink);
  --focus-ring: var(--gold);
}
._closing_1gecn_2 .eyebrow {
  color: var(--gold);
}

._title_1gecn_12 {
  margin-top: 18px;
  max-width: 13ch;
  font-size: clamp(48px, 7vw, 104px);
  line-height: 0.92;
  letter-spacing: -0.05em;
}

._links_1gecn_20 {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 40px;
  margin-top: 36px;
}
._links_1gecn_20 a {
  padding-bottom: 6px;
  font: 700 15px/1 var(--font-mono);
  border-bottom: 3px solid var(--on-ink-muted);
}
._links_1gecn_20 a._primary_1gecn_31 {
  border-bottom-color: var(--gold);
}
._links_1gecn_20 a:hover {
  color: var(--gold);
}

/* onceki ve sonraki hizmet iki uca yaslanir */
._pager_1gecn_39 {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  margin-top: clamp(48px, 6vw, 72px);
  border-top: 2px solid var(--muted);
}
._pager_1gecn_39 a {
  padding: 20px 0 28px;
  font: 600 18px/1.2 var(--font-display);
  color: var(--on-ink-muted);
}
._pager_1gecn_39 a:last-child {
  text-align: right;
}
._pager_1gecn_39 a:hover {
  color: var(--on-ink);
}
._pager_1gecn_39 .eyebrow {
  margin-bottom: 8px;
  font-size: 11px;
}
/* ust bar seffaf olarak kapagin ustunde durdugu icin ust bosluk bar
   yuksekligi kadar artar. Kapak ekrani kaplamaz, icerik kadar uzar */
._hero_7id9l_3 {
  padding: calc(var(--header-height) + 40px) var(--gutter) clamp(56px, 7vw, 88px);
}
._inner_7id9l_6 {
  max-width: var(--maxw);
  margin: 0 auto;
}

._crumb_7id9l_11 {
  display: flex;
  align-items: center;
  gap: 14px;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
._crumb_7id9l_11 a {
  padding: 7px 10px;
  border: 2px solid var(--ink);
  transition: background 0.15s ease, color 0.15s ease;
}
._crumb_7id9l_11 a:hover {
  background: var(--ink);
  color: var(--on-ink);
}
._crumb_7id9l_11 span {
  color: var(--faint);
}

/* afis olcusunde baslik. Gorsellestirme gibi uzun tek kelimeler dar ekranda
   tasmasin diye alt sinir kucuk tutuldu ve kelime gerekirse bolunur */
._title_7id9l_34 {
  margin-top: 32px;
  font-size: clamp(44px, 9.4vw, 136px);
  line-height: 0.86;
  letter-spacing: -0.055em;
  overflow-wrap: anywhere;
}
/* altin blok harflerin kenarindan biraz tasar, harfler bloga yapismasin
   diye iki yanda kucuk bir pay var */
._mark_7id9l_43 {
  display: inline-block;
  margin: 0.04em 0 0 -0.06em;
  padding: 0.02em 0.08em 0.06em;
  background: var(--gold);
}

._row_7id9l_50 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 72px);
  margin-top: clamp(36px, 4vw, 56px);
  align-items: start;
}

._lede_7id9l_58 {
  margin: 0;
  max-width: 34ch;
  font: 600 clamp(20px, 1.9vw, 25px)/1.3 var(--font-display);
  letter-spacing: -0.01em;
}
._actions_7id9l_64 {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

/* kunye iki piksellik cerceve icinde ust uste iki satir */
._facts_7id9l_72 {
  margin: 0;
  border: var(--card-border);
  background: var(--surface);
}
._facts_7id9l_72 > div {
  padding: 14px 18px 16px;
}
._facts_7id9l_72 > div + div {
  border-top: 2px solid var(--ink);
}
._facts_7id9l_72 dt {
  font-size: 10px;
}
._facts_7id9l_72 dd {
  margin: 8px 0 0;
  font: 600 15px/1.4 var(--font-display);
}

@media (max-width: 768px) {
  ._row_7id9l_50 {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* altin burada zemin olarak kullaniliyor. Etiket rengi altin uzerinde
   okunsun diye murekkebe doner */
._outcomes_ux7qs_3 {
  background: var(--gold);
}
._outcomes_ux7qs_3 .eyebrow {
  color: var(--ink);
}

/* cerceve izgaranin disinda, kutular arasindaki cizgiler kutularin sag ve
   alt kenarindan gelir. Ilk kutu iki satiri kaplar */
._grid_ux7qs_12 {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr);
  margin: 36px 0 0;
  padding: 0;
  list-style: none;
  border: var(--card-border);
  background: var(--paper);
}
._grid_ux7qs_12 li {
  padding: 24px 24px 28px;
  border-right: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}
._grid_ux7qs_12 li:first-child {
  grid-row: span 2;
  background: var(--ink);
  color: var(--on-ink);
}
._grid_ux7qs_12 li:nth-child(3),
._grid_ux7qs_12 li:nth-child(5) {
  border-right: 0;
}
._grid_ux7qs_12 li:nth-child(4),
._grid_ux7qs_12 li:nth-child(5) {
  border-bottom: 0;
}

._grid_ux7qs_12 h3 {
  font-size: 22px;
  line-height: 1.2;
}
._grid_ux7qs_12 p {
  margin: 10px 0 0;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.5;
}
/* buyuk kutunun metni kutunun altina yaslanir, baslik ve cumle kutunun
   bosta kalan yuksekligini buyuk puntoyla doldurur */
._grid_ux7qs_12 li:first-child {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(28px, 3vw, 40px);
}
._grid_ux7qs_12 li:first-child h3 {
  max-width: 12ch;
  font-size: clamp(36px, 4.2vw, 58px);
  line-height: 0.95;
  letter-spacing: -0.035em;
}
._grid_ux7qs_12 li:first-child p {
  margin-top: 18px;
  max-width: 30ch;
  color: var(--on-ink-muted);
  font-size: clamp(17px, 1.5vw, 20px);
}

/* dar ekranda kutular alt alta, buyuk kutu tek satira iner */
@media (max-width: 768px) {
  ._grid_ux7qs_12 {
    grid-template-columns: minmax(0, 1fr);
  }
  ._grid_ux7qs_12 li,
  ._grid_ux7qs_12 li:nth-child(3) {
    border-right: 0;
  }
  ._grid_ux7qs_12 li:first-child {
    grid-row: auto;
  }
  ._grid_ux7qs_12 li:nth-child(4) {
    border-bottom: 2px solid var(--ink);
  }
}
._rows_1vy56_1 {
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}
/* numara, baslik ve cumle yan yana. Baslik sutunu sabit oranda kalir ki
   satirlarin cumleleri ayni hizadan baslasin */
._rows_1vy56_1 li {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) minmax(0, 1.7fr);
  gap: 20px;
  padding: 18px 0 20px;
  border-top: 2px solid var(--ink);
  align-items: baseline;
}
._number_1vy56_16 {
  font: 700 12px/1 var(--font-mono);
  color: var(--faint);
}
._rows_1vy56_1 h3 {
  font-size: 20px;
  line-height: 1.2;
}
._rows_1vy56_1 p {
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
}

@media (max-width: 768px) {
  ._rows_1vy56_1 li {
    grid-template-columns: 36px minmax(0, 1fr);
    row-gap: 6px;
  }
  ._rows_1vy56_1 p {
    grid-column: 2;
  }
}
/* metin solda, cizim sagda dar bir sutunda ve metnin dikey ortasinda */
._grid_1wndf_2 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

@media (max-width: 768px) {
  ._grid_1wndf_2 {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* kapsam bolumunun aynasi, cizim solda dar sutunda ve metnin dikey
   ortasinda. Dar ekranda cizim metnin altina iner */
._grid_5h2i4_3 {
  display: grid;
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}

@media (max-width: 768px) {
  ._grid_5h2i4_3 {
    grid-template-columns: minmax(0, 1fr);
  }
  ._grid_5h2i4_3 > figure {
    order: 1;
  }
}
/* henuz cizilmemis illustrasyonun yeri. Kutunun orani ve konumu disaridan
   gelir, cizim hazir oldugunda ayni yere tek bir img konur ve yerlesim
   degismez. Alt kenarda cizgi yok, cunku figurlerin ayaklari bolum cizgisine
   oturur ve o cizgi bolumun kendisinde */
._slot_pwdgj_5 {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 14px 16px;
  overflow: hidden;
  border: 2px dashed var(--gray);
  border-bottom: 0;
  background: repeating-linear-gradient(135deg, transparent 0 10px, rgba(45, 48, 55, 0.05) 10px 11px);
  color: var(--faint);
}
/* havada duran bir cizimin, ornegin hizmet sayfasindakilerin, basacagi bir
   cizgi yok, kutu dort kenardan da cizilir */
._floating_pwdgj_20 {
  border-bottom: 2px dashed var(--gray);
}
._label_pwdgj_23 {
  font: 700 11px/1.35 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink);
}
._note_pwdgj_29 {
  margin: 0;
  max-width: 40ch;
  font-size: 12px;
  line-height: 1.45;
}
/* siyah zeminli kutu, sayfanin geri kalanindan ayrilsin diye. Uzerine gelince
   kalkar ve altina altin golge duser */
._author_1vnbt_3 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  padding: 22px 24px;
  color: var(--on-ink);
  background: var(--ink);
  border: var(--card-border);
}

/* kutu brand paketindeki reveal sinifiyla belirir, reveal gecisleri yalnizca
   opacity ve transform icindir. Kalkis transform yerine translate ile yapilir
   ki belirme onu ezmesin. Reveal transition'i tek yerden verdigi icin kalkis
   ve golge gecisleri --reveal-extra'ya yazilir, bu liste olmadan kalkis
   geciste yumusamaz */
._author_1vnbt_3 {
  --reveal-extra: translate var(--lift-time) ease, box-shadow var(--lift-time) ease;
}
._author_1vnbt_3:hover {
  translate: 0 var(--lift);
  box-shadow: var(--lift-drop) var(--gold);
}
._author_1vnbt_3 .eyebrow {
  color: var(--gold);
}

._name_1vnbt_30 {
  display: block;
  margin-top: 10px;
  font: 700 clamp(24px, 2.4vw, 32px) / 1.05 var(--font-display);
  letter-spacing: -0.03em;
}
._author_1vnbt_3:hover ._name_1vnbt_30 {
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 5px;
}
._mail_1vnbt_41 {
  display: block;
  margin-top: 8px;
  font: 500 14px/1.3 var(--font-mono);
  color: var(--on-ink-muted);
}

/* kare fotograf, siyah zeminde altin cerceveyle durur. width ve height
   yalnizca yuklenmeden once yer ayirir, olcu buradan gelir */
._photo_1vnbt_50 {
  flex: none;
  width: clamp(80px, 8vw, 104px);
  height: auto;
  aspect-ratio: 1;
  object-fit: cover;
  border: 2px solid var(--gold);
}
._acceptance_11ssc_1 {
  width: 100%;
  border-collapse: collapse;
}
._acceptance_11ssc_1 th {
  padding: 0 10px 10px 0;
  font: 600 10.5px/1.2 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: left;
  color: var(--faint);
  border-bottom: 2px solid var(--ink);
}
._acceptance_11ssc_1 td {
  padding: 13px 10px 13px 0;
  font-size: 14px;
  line-height: 1.45;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
}
._acceptance_11ssc_1 tbody tr:last-child td {
  border-bottom: 2px solid var(--ink);
}
._number_11ssc_24 {
  font: 500 13px/1.45 var(--font-mono);
  white-space: nowrap;
}
._status_11ssc_28 {
  display: inline-block;
  padding: 5px 7px;
  font: 600 10.5px/1 var(--font-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  white-space: nowrap;
  background: var(--surface);
  border: 1.5px solid var(--ink);
}
/* tutmayan hedef saklanmaz, altin zeminle one cikar */
._missed_11ssc_39 {
  background: var(--gold);
}

@media (max-width: 768px) {
  ._acceptance_11ssc_1 th,
  ._acceptance_11ssc_1 td {
    padding-right: 6px;
    font-size: 13px;
  }
  ._number_11ssc_24 {
    font-size: 12px;
    white-space: normal;
  }
  ._status_11ssc_28 {
    padding: 4px 5px;
    font-size: 9.5px;
  }
}
._steps_iaf79_1 {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}
._steps_iaf79_1 li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: baseline;
  padding: 11px 0;
}
._steps_iaf79_1 li + li {
  border-top: 1px solid var(--line);
}
._op_iaf79_18 {
  font: 600 16px/1 var(--font-mono);
  text-align: center;
  color: var(--faint);
}
._label_iaf79_23 {
  font-size: 14.5px;
  line-height: 1.4;
}
._label_iaf79_23 small {
  display: block;
  font-size: 12.5px;
  color: var(--muted);
}
._value_iaf79_32 {
  font: 500 15px/1 var(--font-mono);
  text-align: right;
  white-space: nowrap;
}
/* sonuc satiri kalin bir cizgiyle ayrilir, degeri altin zeminde */
._steps_iaf79_1 li._result_iaf79_38 {
  border-top: 2px solid var(--ink);
}
._result_iaf79_38 ._label_iaf79_23 {
  font: 700 15px/1.4 var(--font-display);
}
._result_iaf79_38 ._value_iaf79_32 {
  padding: 5px 8px;
  font-weight: 700;
  background: var(--gold);
}
/* butun sekillerin ortak cercevesi. Seklin kendisi her parcanin kendi
   dosyasinda cizilir */
._figure_11u33_3 {
  margin: 0;
}
._figure_11u33_3 > * + * {
  margin-top: 24px;
}
._figure_11u33_3 > figcaption + * {
  margin-top: 24px;
}
/* seklin altindaki acilir kutu sekle biraz daha yakin durur */
._figure_11u33_3 > details {
  margin-top: 20px;
}

._title_11u33_17 {
  margin-top: 10px;
  font-size: clamp(19px, 1.7vw, 23px);
  letter-spacing: -0.02em;
}
._reading_11u33_22 {
  margin: 8px 0 0;
  max-width: 64ch;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--muted);
}
/* --- dikey sekil --- */
/* cubuk alani sifirdan max'a, ustte deger yazisi icin otuz piksel pay var */
._vertical_34gpy_3 {
  padding-left: 44px;
}
._plot_34gpy_6 {
  position: relative;
  display: grid;
  grid-template-columns: repeat(var(--n), minmax(0, 1fr));
  height: 260px;
  border-bottom: 2px solid var(--ink);
}
._grid_34gpy_13 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc((100% - 30px) * var(--y) / 100);
  border-top: 1px solid var(--line);
}
._grid_34gpy_13 em {
  position: absolute;
  left: -44px;
  top: -8px;
  width: 36px;
  font: 500 11px/1 var(--font-mono);
  font-style: normal;
  text-align: right;
  color: var(--faint);
}
._column_34gpy_30 {
  position: relative;
}
._bar_34gpy_33 {
  position: absolute;
  left: 24%;
  right: 24%;
  bottom: 0;
  height: max(2px, calc((100% - 30px) * var(--h) / 100));
  background: var(--ink);
}
._value_34gpy_41 {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc((100% - 30px) * var(--h) / 100 + 6px);
  font: 700 12px/1 var(--font-mono);
  text-align: center;
}
._labels_34gpy_49 {
  display: grid;
  grid-template-columns: repeat(var(--n), minmax(0, 1fr));
}
._labels_34gpy_49 span {
  padding-top: 8px;
  font: 500 11px/1.3 var(--font-mono);
  text-align: center;
  color: var(--faint);
}
._zones_34gpy_59 {
  display: grid;
  margin-top: 10px;
}
._zones_34gpy_59 span {
  padding: 8px 6px;
  font: 600 13px/1.3 var(--font-display);
  text-align: center;
  border-top: 2px solid var(--ink);
}
._zones_34gpy_59 span + span {
  border-left: 2px solid var(--paper);
}

/* bolge zeminleri. Sutunda taramali altin, bantta duz altin, golgeli bolge
   ikisinde de acik gri */
._column_34gpy_30._hatched_34gpy_75 {
  background: repeating-linear-gradient(135deg, var(--gold-wash) 0 6px, transparent 6px 10px);
}
._column_34gpy_30._shaded_34gpy_78 {
  background: rgba(45, 48, 55, 0.06);
}
._zones_34gpy_59 ._hatched_34gpy_75 {
  background: var(--gold-wash);
}
._zones_34gpy_59 ._shaded_34gpy_78 {
  background: var(--panel);
}

/* --- yatay sekil --- */
._row_34gpy_89 {
  display: grid;
  grid-template-columns: minmax(120px, 220px) minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 7px 0;
}
._name_34gpy_96 {
  font: 600 14.5px/1.3 var(--font-display);
}
/* ince dikey cizgiler eksen degerlerinin hizasinda */
._track_34gpy_100 {
  position: relative;
  height: 24px;
  background: linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0 / var(--step) 100%;
  border-left: 2px solid var(--ink);
}
._track_34gpy_100 i {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: var(--w);
  background: var(--ink);
}
._track_34gpy_100 i._highlight_34gpy_114 {
  background: var(--gold);
  border: 2px solid var(--ink);
  border-left: 0;
}
/* deger cubugun hemen ucunda durur, goz sayiyi ayri bir sutunda aramasin */
._track_34gpy_100 b {
  position: absolute;
  left: calc(var(--w) + 8px);
  top: 50%;
  font: 700 13px/1 var(--font-mono);
  translate: 0 -50%;
}
._group_34gpy_127 {
  margin-top: 14px;
  padding-top: 12px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
  border-top: 2px solid var(--ink);
}
._horizontal_34gpy_136 > :first-child ._group_34gpy_127 {
  margin-top: 0;
}
._ticks_34gpy_139 {
  position: relative;
  height: 14px;
  border-top: 2px solid var(--ink);
}
._ticks_34gpy_139 em {
  position: absolute;
  left: var(--x);
  top: 4px;
  font: 500 11px/1 var(--font-mono);
  font-style: normal;
  color: var(--faint);
  translate: -50% 0;
}
._ticks_34gpy_139 em:first-child {
  translate: 0 0;
}

/* dar ekranda etiket sutunlari daralir */
@media (max-width: 768px) {
  ._vertical_34gpy_3 {
    padding-left: 34px;
  }
  ._plot_34gpy_6 {
    height: 220px;
  }
  ._grid_34gpy_13 em {
    left: -34px;
    width: 28px;
    font-size: 10px;
  }
  ._value_34gpy_41 {
    font-size: 11px;
  }
  ._labels_34gpy_49 span {
    font-size: 10px;
  }
  ._zones_34gpy_59 span {
    font-size: 12px;
  }
  ._row_34gpy_89 {
    grid-template-columns: minmax(96px, 120px) minmax(0, 1fr);
    gap: 10px;
  }
  ._name_34gpy_96 {
    font-size: 13px;
  }
}
._compare_85mtt_1 {
  display: grid;
  grid-template-columns: minmax(140px, 0.9fr) 1fr 1fr;
  border: 2px solid var(--ink);
}
._compare_85mtt_1 > * {
  padding: 14px 16px;
  border-bottom: 1px solid var(--line);
}
._compare_85mtt_1 > :nth-last-child(-n + 3) {
  border-bottom: 0;
}

._head_85mtt_14 {
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
  background: var(--paper);
  border-bottom: 2px solid var(--ink);
}
._afterHead_85mtt_22 {
  color: var(--gold);
  background: var(--ink);
}
._label_85mtt_26 {
  font: 600 14.5px/1.35 var(--font-display);
}
._before_85mtt_29 {
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--muted);
  border-left: 1px solid var(--line);
}
._after_85mtt_22 {
  font-size: 14.5px;
  line-height: 1.5;
  background: var(--surface);
  border-left: 2px solid var(--ink);
}
._after_85mtt_22 strong {
  font-family: var(--font-display);
}

/* dar ekranda satir adi ustte tam genislikte, iki hal altinda yan yana */
@media (max-width: 768px) {
  ._compare_85mtt_1 {
    grid-template-columns: 1fr 1fr;
  }
  ._compare_85mtt_1 > ._head_85mtt_14:first-child {
    display: none;
  }
  ._label_85mtt_26 {
    grid-column: 1 / -1;
    background: var(--panel);
  }
  ._before_85mtt_29 {
    border-left: 0;
  }
  ._compare_85mtt_1 > :nth-last-child(-n + 3) {
    border-bottom: 1px solid var(--line);
  }
  ._compare_85mtt_1 > :nth-last-child(-n + 2) {
    border-bottom: 0;
  }
}
._row_rqffm_1 {
  display: grid;
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
  align-items: center;
  gap: 14px;
  padding: 7px 0;
}
._name_rqffm_8 {
  font: 600 14.5px/1.3 var(--font-display);
}
._bar_rqffm_11 {
  display: flex;
  height: 30px;
  border: 2px solid var(--ink);
}
/* dilimlerin arasinda murekkep bir cizgi, ilk dilimde cizgi yok */
._part_rqffm_17 {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--w);
  overflow: hidden;
  font: 600 11.5px/1 var(--font-mono);
  white-space: nowrap;
}
._part_rqffm_17 + ._part_rqffm_17 {
  border-left: 2px solid var(--ink);
}

/* parca zeminleri. Ayni siniflar renk aciklamasindaki kutularda da kullanilir */
._ink_rqffm_31 {
  background: var(--ink);
  color: var(--paper);
}
._light_rqffm_35 {
  background: var(--panel);
}
._gold_rqffm_38 {
  background: var(--gold);
}
._hatched_rqffm_41 {
  background: repeating-linear-gradient(135deg, var(--surface) 0 5px, var(--line-strong) 5px 6.5px);
}

._legend_rqffm_45 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  margin-top: 14px;
  font-size: 13.5px;
  color: var(--muted);
}
._legend_rqffm_45 span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
._legend_rqffm_45 i {
  width: 14px;
  height: 14px;
  border: 1.5px solid var(--ink);
}

@media (max-width: 768px) {
  ._row_rqffm_1 {
    grid-template-columns: minmax(84px, 110px) minmax(0, 1fr);
    gap: 10px;
  }
  ._name_rqffm_8 {
    font-size: 13px;
  }
  ._part_rqffm_17 {
    font-size: 10.5px;
  }
}
/* dar ekranda tablo kendi alaninda yana kaydirilir, sayfa tasmaz */
._scroll_1a6ab_2 {
  overflow-x: auto;
}
._corr_1a6ab_5 {
  border-collapse: separate;
  border-spacing: 4px;
  margin-left: -4px;
}
._corr_1a6ab_5 thead th {
  width: 84px;
  padding: 0 6px 6px;
  font: 600 10.5px/1.25 var(--font-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  vertical-align: bottom;
  color: var(--faint);
}
._corr_1a6ab_5 tbody th {
  padding-right: 10px;
  font: 600 13px/1.2 var(--font-display);
  text-align: left;
  white-space: nowrap;
}
._corr_1a6ab_5 td {
  width: 84px;
  height: 48px;
  font: 500 13px/1 var(--font-mono);
  text-align: center;
  border: 1.5px solid transparent;
}
/* kendisiyle iliski bilgi tasimaz, hucre kesikli ve soluk */
._corr_1a6ab_5 td._self_1a6ab_34 {
  font-size: 11px;
  color: var(--faint);
  border: 1.5px dashed var(--line-strong);
}
._positive_1a6ab_39 {
  background: color-mix(in srgb, var(--ink) var(--depth), var(--surface));
}
._negative_1a6ab_42 {
  background: color-mix(in srgb, var(--gold) var(--depth), var(--surface));
}
._corr_1a6ab_5 td._strong_1a6ab_45 {
  border-color: var(--ink);
}
._corr_1a6ab_5 td._light_1a6ab_48 {
  color: var(--paper);
}
._scale_1a6ab_51 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  font: 500 11px/1 var(--font-mono);
  color: var(--faint);
}
._scale_1a6ab_51 i {
  width: 90px;
  height: 10px;
  border: 1px solid var(--line-strong);
}
._negativeScale_1a6ab_64 {
  background: linear-gradient(90deg, var(--gold), var(--surface));
}
._positiveScale_1a6ab_67 {
  background: linear-gradient(90deg, var(--surface), var(--ink));
}

@media (max-width: 768px) {
  ._corr_1a6ab_5 thead th {
    width: auto;
    font-size: 8.5px;
    letter-spacing: 0.04em;
  }
  ._corr_1a6ab_5 tbody th {
    font-size: 11.5px;
    white-space: normal;
  }
  ._corr_1a6ab_5 td {
    width: auto;
    min-width: 44px;
    height: 40px;
    font-size: 11px;
  }
}

/* katsayinin neden sonuc gostermedigini soyleyen not, tabloya yakin durur */
._note_1a6ab_90 {
  margin: 12px 0 0;
  font: 400 12.5px/1.5 var(--font-mono);
  color: var(--faint);
}
._frame_1tefp_1 {
  background: var(--surface);
  border: 2px solid var(--ink);
}
/* ustteki murekkep serit, tablonun adi ve neyin gosterildigi */
._bar_1tefp_6 {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  padding: 8px 12px;
  color: var(--paper);
  background: var(--ink);
}
._bar_1tefp_6 b {
  font: 600 13px/1 var(--font-mono);
}
._bar_1tefp_6 b::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 8px;
  background: var(--gold);
}
._bar_1tefp_6 span {
  font: 400 11px/1 var(--font-mono);
  color: var(--on-ink-muted);
}
._scroll_1tefp_30 {
  overflow-x: auto;
}
._table_1tefp_33 {
  width: 100%;
  border-collapse: collapse;
  font: 400 12px/1.35 var(--font-mono);
}
._table_1tefp_33 th {
  padding: 8px 10px;
  font: 600 10px/1.2 var(--font-mono);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: left;
  white-space: nowrap;
  color: var(--faint);
  background: var(--panel);
  border-bottom: 1.5px solid var(--ink);
}
._table_1tefp_33 td {
  padding: 7px 10px;
  vertical-align: top;
  white-space: nowrap;
  border-top: 1px solid var(--line);
}
._index_1tefp_55 {
  width: 28px;
  text-align: right;
  color: var(--faint);
  border-right: 1px solid var(--line);
}
._table_1tefp_33 th._index_1tefp_55 {
  text-align: right;
}
._name_1tefp_64 {
  font-weight: 500;
}
._key_1tefp_67 {
  background: var(--gold-wash);
}
._pk_1tefp_70,
._fk_1tefp_71 {
  display: inline-block;
  margin-right: 6px;
  padding: 3px;
  font: 600 9px/1 var(--font-mono);
  font-style: normal;
  border: 1.5px solid var(--ink);
}
._pk_1tefp_70 {
  background: var(--gold);
}
._fk_1tefp_71 {
  background: var(--surface);
}
._type_1tefp_85,
._faint_1tefp_86 {
  color: var(--faint);
}
._ref_1tefp_89 {
  font-weight: 500;
}
._table_1tefp_33 td._note_1tefp_92 {
  min-width: 120px;
  font: 400 12.5px/1.4 var(--font-body);
  white-space: normal;
  color: var(--muted);
}
/* sorgu sonucunda basliklar kucuk harfle, sutunun gercek adi gibi */
._rows_1tefp_99 th {
  font-size: 11.5px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink);
}
._rows_1tefp_99 th small {
  display: block;
  margin-top: 2px;
  font: 400 10px/1.2 var(--font-mono);
  color: var(--faint);
}
._rows_1tefp_99 td:not(._index_1tefp_55):not(._number_1tefp_111) {
  min-width: 90px;
  white-space: normal;
}
._number_1tefp_111 {
  text-align: right;
}
._table_1tefp_33 th._number_1tefp_111 {
  text-align: right;
}
._null_1tefp_121 {
  display: inline-block;
  padding: 2px 4px;
  font: 500 9.5px/1 var(--font-mono);
  letter-spacing: 0.08em;
  color: var(--faint);
  border: 1px dashed var(--line-strong);
}
._foot_1tefp_129 {
  padding: 6px 12px;
  font: 400 11px/1 var(--font-mono);
  color: var(--faint);
  border-top: 1.5px solid var(--ink);
}
/* kararlar arasinda kalin cizgi, landing listelerinin ritmi. Ilk kararin
   ustundeki bosluk bolumun parca araligindan gelir */
._decision_15660_3 {
  padding-top: 18px;
  border-top: 2px solid var(--ink);
}
._decision_15660_3 + ._decision_15660_3 {
  margin-top: 32px;
}
._title_15660_10 {
  margin: 10px 0 14px;
  font-size: clamp(18px, 1.6vw, 22px);
  letter-spacing: -0.02em;
}
._text_15660_15 {
  margin: 0;
  max-width: 64ch;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--muted);
}
/* kapali kutu cerceveli bir satir. Uzerine gelince kartlar gibi kalkar ve
   altina sert golge duser. Acikken satir koyulasir, etiket altin olur */
._summary_qirlg_3 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  list-style: none;
  background: var(--paper);
  border: var(--card-border);
  cursor: pointer;
  transition: transform var(--lift-time) ease, box-shadow var(--lift-time) ease;
}
._summary_qirlg_3::-webkit-details-marker {
  display: none;
}
._summary_qirlg_3:hover {
  transform: translateY(var(--lift));
  box-shadow: var(--lift-shadow);
}

._meta_qirlg_23 {
  display: block;
  margin-bottom: 6px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
}

._title_qirlg_32 {
  margin: 0;
  font-size: clamp(16px, 1.4vw, 19px);
  letter-spacing: -0.015em;
}

._details_qirlg_38[open] > ._summary_qirlg_3 {
  color: var(--on-ink);
  background: var(--ink);
}
._details_qirlg_38[open] ._meta_qirlg_23 {
  color: var(--gold);
}

._content_qirlg_46 {
  --pad: clamp(18px, 2.2vw, 28px);
  margin-top: 6px;
  padding: var(--pad);
  font-size: 15px;
  line-height: 1.65;
  color: var(--muted);
  background: var(--surface);
  border: var(--card-border);
}
._details_qirlg_38[open] ._content_qirlg_46 {
  --drop-from: -10px;
  animation: drop 0.28s cubic-bezier(0.2, 0.7, 0.2, 1);
}

._content_qirlg_46 > * + * {
  margin-top: 14px;
}

/* hesap tablosu kutunun ic boslugunu yok sayip kenara kadar uzanir, sutunlar
   sigsin diye. Tablonun kendi cercevesinden yalnizca alt cizgi kalir, kutunun
   cercevesiyle ust uste binmesin diye */
._content_qirlg_46 > [data-sheet] {
  margin-left: calc(-1 * var(--pad));
  margin-right: calc(-1 * var(--pad));
  border-width: 2px 0;
}
._content_qirlg_46 > [data-sheet]:first-child {
  margin-top: calc(-1 * var(--pad));
  border-top-width: 0;
}
._sign_qseqn_1 {
  position: relative;
  flex: none;
  width: 26px;
  height: 26px;
  border: 2px solid currentColor;
}
._sign_qseqn_1::before,
._sign_qseqn_1::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 12px;
  height: 2px;
  background: currentColor;
  translate: -50% -50%;
  transition: transform 0.2s ease;
}
._sign_qseqn_1::after {
  transform: rotate(90deg);
}
._small_qseqn_23 {
  width: 22px;
  height: 22px;
}
._small_qseqn_23::before,
._small_qseqn_23::after {
  width: 10px;
}

/* kutu acikken dikey cizgi yatar, isaret eksiye doner. Renk summary'nin
   yazi renginden gelir, acik kutuda summary koyulastigi icin isaret de
   kendiliginden acik renge doner */
details[open] > summary > ._sign_qseqn_1::after {
  transform: rotate(0deg);
}
/* renklendirmenin dort rengi, sinif adlari highlight.ts'teki parca turleridir.
   Anahtar kelimeler altin, yorumlar soluk ve egik, docstring'ler ve metin
   sabitleri yesile calan iki acik ton */
._keyword_u0rvj_4 {
  color: var(--gold);
}
._string_u0rvj_7 {
  color: var(--code-string);
}
._comment_u0rvj_10 {
  font-style: italic;
  color: var(--code-comment);
}
._doc_u0rvj_14 {
  color: var(--code-doc);
}
/* kucuk cerceveli mono dugme. Indirme altin dolu durur, sayfadaki asil
   eylem o oldugu icin */
._action_1yu9i_3 {
  flex: none;
  padding: 5px 9px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.06em;
  color: var(--on-ink);
  background: none;
  border: 1.5px solid var(--code-faint);
  cursor: pointer;
}
._action_1yu9i_3:hover {
  border-color: var(--on-ink);
}

._download_1yu9i_17 {
  color: var(--ink);
  background: var(--gold);
  border-color: var(--gold);
  text-decoration: none;
}
/* koyu zeminli dosya cercevesi. Kod sayfanin asil icerigi oldugu icin kapali
   gelmez. Cerceveler arasindaki bosluk bolum cercevesinden gelir. Icindeki
   Kopyala ve Indir dugmeleri ile yana kayan metin koyu zeminde durur, brand'in
   murekkep renkli odak cercevesi orada gorunmez, bu yuzden altina doner */
._frame_dbjjq_5 {
  --focus-ring: var(--gold);
  margin: 0;
  background: var(--ink);
  border: 2px solid var(--ink);
}
._output_dbjjq_11 {
  background: var(--code-output);
}

._head_dbjjq_15 {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px 14px;
  font: 500 12.5px/1.3 var(--font-mono);
  color: var(--code-meta);
  border-bottom: 1px solid var(--code-rule);
}
._path_dbjjq_24 {
  font-weight: 700;
  color: var(--on-ink);
}
._meta_dbjjq_28 {
  margin-left: auto;
}

/* satir numaralari ve metin yan yana iki ayri pre. Numaralar ayri durur,
   kopyalanan metne karismasin diye. Cerceve yalnizca ust ve alt boslugu
   verir, yatay bosluk govdenin kendi sutunlarindan gelir */
._body_dbjjq_35 {
  display: flex;
}
._body_dbjjq_35 pre {
  margin: 0;
  padding-top: 14px;
  padding-bottom: 16px;
  font: 400 13px/1.7 var(--font-mono);
  tab-size: 4;
}

@media (max-width: 768px) {
  ._head_dbjjq_15 {
    flex-wrap: wrap;
    gap: 6px 12px;
  }
  ._meta_dbjjq_28 {
    order: 3;
    width: 100%;
    margin-left: 0;
  }
  ._body_dbjjq_35 pre {
    font-size: 12px;
  }
}
/* numaralar secilemez, okur metni surukleyerek sectiginde de numaralar
   gelmez */
._numbers_lclg1_3 {
  flex: none;
  padding-right: 12px;
  padding-left: 14px;
  text-align: right;
  color: var(--code-faint);
  border-right: 1px solid var(--code-rule);
  user-select: none;
}

._text_lclg1_13 {
  flex: 1;
  min-width: 0;
  padding-right: 16px;
  padding-left: 16px;
  overflow-x: auto;
  color: var(--on-ink);
}
._header_vm47d_1 {
  font-weight: 700;
  color: var(--gold);
}

/* uzun dosyanin penceresi, yaklasik otuz satir. Cerceve govdesi gibi esnek
   kutudur, numaralar ve metin yan yana kalir. Odaklaninca ortak odak
   cercevesi gorunur, kaydirma cubugu kod alaninin rengini alir */
._window_vm47d_9 {
  display: flex;
  flex: 1;
  align-items: flex-start;
  min-width: 0;
  max-height: 680px;
  overflow: auto;
  scrollbar-color: var(--code-faint) transparent;
}

/* pencere iki yonde de kendisi kayar, yoksa uzun satirlarin yatay cubugu
   yuzlerce satir asagida, metnin en altinda kalirdi. Numaralar yana
   kayarken solda sabit durur ve altlarindaki metni ortmek icin cercevenin
   zeminini alir */
._window_vm47d_9 pre {
  overflow: visible;
}
._window_vm47d_9 pre:first-child {
  position: sticky;
  left: 0;
  background: var(--ink);
}

._note_vm47d_32 {
  max-width: 64ch;
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.65;
  color: var(--muted);
}
/* satir numarasi olmadigi icin metin cercevenin kenarindan baslar, uzun
   satirlar dar ekranda yatay kayar */
._text_1fqtm_3 {
  flex: 1;
  min-width: 0;
  padding-right: 16px;
  padding-left: 16px;
  overflow-x: auto;
  color: var(--code-output-text);
}
._heat_ebvr9_1 {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
._heat_ebvr9_1 thead th {
  padding: 0 4px 10px;
  font: 600 10.5px/1.2 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: center;
  color: var(--faint);
}
._heat_ebvr9_1 thead th:first-child {
  width: 150px;
}
._heat_ebvr9_1 tbody th {
  padding-right: 10px;
  font: 600 14px/1.3 var(--font-display);
  text-align: left;
}
/* hucreler arasinda kagit renginde ince bir bosluk, zemin degerle koyulasir */
._heat_ebvr9_1 td {
  height: 44px;
  font: 500 13px/1 var(--font-mono);
  text-align: center;
  background: color-mix(in srgb, var(--ink) var(--depth), var(--surface));
  border: 2px solid var(--paper);
}
._heat_ebvr9_1 td._light_ebvr9_30 {
  color: var(--paper);
}
._scale_ebvr9_33 {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 14px;
  font: 500 11px/1 var(--font-mono);
  color: var(--faint);
}
/* olcek bes kademenin kendisidir, aralarinda bosluk yok */
._scale_ebvr9_33 {
  gap: 0;
}
._scale_ebvr9_33 i {
  width: 36px;
  height: 10px;
  background: color-mix(in srgb, var(--ink) var(--depth), var(--surface));
}
._scale_ebvr9_33 i:first-of-type {
  margin-left: 10px;
}
._scale_ebvr9_33 i:last-of-type {
  margin-right: 10px;
}

@media (max-width: 768px) {
  ._heat_ebvr9_1 thead th {
    font-size: 9px;
    letter-spacing: 0.04em;
  }
  ._heat_ebvr9_1 thead th:first-child {
    width: 88px;
  }
  ._heat_ebvr9_1 tbody th {
    font-size: 12.5px;
  }
  ._heat_ebvr9_1 td {
    height: 38px;
    font-size: 11px;
  }
}
/* solda eksen, ortada cizim, sagda serilerin uc etiketleri, altta noktalarin
   adlari. Cizim alani sabit yukseklikte, cizgi bu alana gore olceklenir */
._line_1usy4_3 {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 104px;
  grid-template-rows: 240px auto;
}
._axis_1usy4_8 {
  position: relative;
}
._axis_1usy4_8 span {
  position: absolute;
  right: 8px;
  top: var(--y);
  font: 500 11px/1 var(--font-mono);
  color: var(--faint);
  translate: 0 -50%;
}
._plot_1usy4_19 {
  position: relative;
  border-left: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}
._grid_1usy4_24 {
  position: absolute;
  left: 0;
  right: 0;
  top: var(--y);
  border-top: 1px solid var(--line);
}
/* cizgi kalinligi olcekten etkilenmesin, viewBox yuzlukken kalinlik piksel kalir */
._svg_1usy4_32 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
._svg_1usy4_32 polyline {
  fill: none;
  stroke-width: 2.5;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}
._svg_1usy4_32 ._ink_1usy4_45 {
  stroke: var(--ink);
}
._svg_1usy4_32 ._gold_1usy4_48 {
  stroke: var(--gold);
}
._svg_1usy4_32 ._gray_1usy4_51 {
  stroke: var(--gray);
}
._dot_1usy4_54 {
  position: absolute;
  left: var(--x);
  top: var(--y);
  width: 8px;
  height: 8px;
  border: 1.5px solid var(--ink);
  border-radius: 50%;
  translate: -50% -50%;
}
._dot_1usy4_54._ink_1usy4_45 {
  background: var(--ink);
}
._dot_1usy4_54._gold_1usy4_48 {
  background: var(--gold);
}
._dot_1usy4_54._gray_1usy4_51 {
  background: var(--gray);
}
/* deger cizginin ucunda yazar, okur renk aciklamasi aramasin */
._ends_1usy4_74 {
  position: relative;
}
._ends_1usy4_74 span {
  position: absolute;
  left: 10px;
  top: var(--y);
  font: 400 11.5px/1.25 var(--font-body);
  color: var(--muted);
  translate: 0 -50%;
}
._ends_1usy4_74 b {
  display: block;
  font: 700 12.5px/1.2 var(--font-mono);
  color: var(--ink);
}
._points_1usy4_90 {
  grid-column: 2;
  position: relative;
  height: 26px;
}
._points_1usy4_90 span {
  position: absolute;
  left: var(--x);
  top: 8px;
  font: 500 11px/1 var(--font-mono);
  color: var(--faint);
  white-space: nowrap;
  translate: -50% 0;
}

@media (max-width: 768px) {
  ._line_1usy4_3 {
    grid-template-columns: 34px minmax(0, 1fr) 78px;
    grid-template-rows: 210px auto;
  }
  ._axis_1usy4_8 span,
  ._points_1usy4_90 span {
    font-size: 10px;
  }
  /* sekizden fazla nokta dar ekranda yan yana sigmaz, adlarin biri atlanir */
  ._dense_1usy4_115 ._points_1usy4_90 span:nth-child(even) {
    visibility: hidden;
  }
}
._title_1ily9_1 {
  margin-bottom: 14px;
  font-size: clamp(19px, 1.7vw, 23px);
  letter-spacing: -0.02em;
}

._list_1ily9_7 {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 15px;
  color: var(--muted);
}
._list_1ily9_7 strong {
  color: var(--ink);
}

/* yan yana uc sutun, her maddenin ustunde kalin cizgi ve kucuk numara.
   Bas cumlesi kendi satirinda buyuk durur */
._columns_1ily9_20 {
  counter-reset: item;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0 24px;
  line-height: 1.55;
}
._columns_1ily9_20 li {
  counter-increment: item;
  padding-top: 14px;
  border-top: 2px solid var(--ink);
}
._columns_1ily9_20 li::before {
  content: counter(item, decimal-leading-zero);
  display: block;
  margin-bottom: 10px;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  color: var(--faint);
}
._columns_1ily9_20 strong {
  display: block;
  margin-bottom: 4px;
  font: 700 17px/1.25 var(--font-display);
  letter-spacing: -0.01em;
}

/* alt alta maddeler, solda kucuk bos bir kare, aralarda ve en altta kalin
   cizgi. Bas cumlesi metnin icinde kalin yazilir */
._stack_1ily9_49 {
  line-height: 1.6;
}
._stack_1ily9_49 li {
  display: grid;
  grid-template-columns: 20px 1fr;
  gap: 14px;
  padding: 16px 0;
  border-top: 2px solid var(--ink);
}
._stack_1ily9_49 li:last-child {
  border-bottom: 2px solid var(--ink);
}
._stack_1ily9_49 li::before {
  content: '';
  width: 12px;
  height: 12px;
  margin-top: 6px;
  border: 1.5px solid var(--gray);
}

@media (max-width: 768px) {
  ._columns_1ily9_20 {
    grid-template-columns: 1fr;
    gap: 18px;
  }
}
/* eksen adi, satir adlari, n hucre sutunu ve toplamlar */
._grid_gis53_2 {
  display: grid;
  grid-template-columns: 34px 110px repeat(var(--n), minmax(0, 1fr)) 84px;
  gap: 6px;
}
._axis_gis53_7 {
  font: 600 10.5px/1 var(--font-mono);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--faint);
}
._top_gis53_13 {
  padding-bottom: 6px;
  text-align: center;
  border-bottom: 1.5px solid var(--ink);
}
/* soldaki eksen adi dikey okunur, alttan yukari */
._side_gis53_19 {
  writing-mode: vertical-rl;
  rotate: 180deg;
  padding-left: 8px;
  text-align: center;
  border-left: 1.5px solid var(--ink);
}
._column_gis53_26 {
  padding: 6px 0 4px;
  font: 600 14px/1.2 var(--font-display);
  text-align: center;
}
._row_gis53_31 {
  display: flex;
  align-items: center;
  font: 600 14px/1.25 var(--font-display);
}
._sum_gis53_36 {
  color: var(--muted);
}
._cell_gis53_39 {
  min-height: 112px;
  padding: 12px 14px 14px;
  background: var(--surface);
  border: 2px solid var(--ink);
}
._cell_gis53_39 em {
  font: 600 10px/1 var(--font-mono);
  font-style: normal;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--faint);
}
._cell_gis53_39 b {
  display: block;
  margin: 12px 0 6px;
  font: 700 30px/1 var(--font-display);
}
._cell_gis53_39 span {
  font-size: 13.5px;
  line-height: 1.35;
  color: var(--muted);
}
/* hatali kararlar altin zeminli, etiketleri altin seritte */
._error_gis53_63 {
  background: var(--gold-wash);
}
._error_gis53_63 em {
  margin-left: -5px;
  padding: 3px 5px;
  color: var(--ink);
  background: var(--gold);
}
._number_gis53_72 {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 0;
  font: 500 14px/1 var(--font-mono);
  color: var(--muted);
}
._all_gis53_80 {
  font-weight: 700;
  color: var(--ink);
}
._key_gis53_84 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
  margin: 22px 0 0;
}
._key_gis53_84 dt {
  font: 700 14px/1.3 var(--font-display);
}
._key_gis53_84 dd {
  margin: 2px 0 0;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--muted);
}

@media (max-width: 768px) {
  ._grid_gis53_2 {
    grid-template-columns: 22px 70px repeat(var(--n), minmax(0, 1fr)) 44px;
    gap: 4px;
  }
  ._cell_gis53_39 {
    min-height: 96px;
    padding: 10px;
  }
  ._cell_gis53_39 b {
    font-size: 24px;
  }
  ._cell_gis53_39 span {
    font-size: 12px;
  }
  ._column_gis53_26,
  ._row_gis53_31 {
    font-size: 12.5px;
  }
  ._number_gis53_72 {
    font-size: 12.5px;
  }
}
/* acik zeminli, ince cerceveli kutu. Solundaki altin cizgi notu paragraflardan
   ayirir, kutunun geri kalani sakin kalir */
._note_mwhxo_3 {
  max-width: 64ch;
  padding: 16px 20px 18px;
  background: var(--surface);
  border: 2px solid var(--ink);
  border-left: 6px solid var(--gold);
}
._text_mwhxo_10 {
  margin: 8px 0 0;
  font-size: 15px;
  line-height: 1.65;
  color: var(--ink);
}
/* bolum girisinden daha kucuk ve soluk, okur once girisi okusun diye. Satir
   uzunlugu okunakli kalsin diye sinirli */
._paragraph_1v6hs_3 {
  margin: 0;
  max-width: 64ch;
  font-size: 16px;
  line-height: 1.7;
  color: var(--muted);
}
/* solda daire, sagda dilimlerin listesi. Dar ekranda liste dairenin altina iner */
._pie_1vezk_2 {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 36px;
  align-items: center;
}
._disc_1vezk_8 {
  position: relative;
  width: 240px;
  aspect-ratio: 1;
}
._disc_1vezk_8 svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
/* dilimlerin arasinda kagit renginde ince bir bosluk, cevresinde murekkep */
._disc_1vezk_8 path {
  stroke: var(--paper);
  stroke-width: 0.8;
}
._rim_1vezk_24 {
  fill: none;
  stroke: var(--ink);
  stroke-width: 0.8;
}
._ink_1vezk_29 {
  fill: var(--ink);
}
._gold_1vezk_32 {
  fill: var(--gold);
}
._gray_1vezk_35 {
  fill: var(--gray);
}
._light_1vezk_38 {
  fill: var(--panel);
}
._hatchBase_1vezk_41 {
  fill: var(--surface);
}
._hatchLine_1vezk_44 {
  fill: var(--line-strong);
}
._value_1vezk_47 {
  position: absolute;
  left: var(--x);
  top: var(--y);
  font: 700 12.5px/1 var(--font-mono);
  translate: -50% -50%;
}
._onInk_1vezk_54 {
  color: var(--paper);
}

._list_1vezk_58 {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 2px solid var(--ink);
  border-bottom: 2px solid var(--ink);
}
._list_1vezk_58 li {
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 9px 0;
  font-size: 14.5px;
}
._list_1vezk_58 li + li {
  border-top: 1px solid var(--line);
}
._list_1vezk_58 b {
  font: 600 13px/1 var(--font-mono);
}
._key_1vezk_79 {
  width: 14px;
  height: 14px;
  border: 1.5px solid var(--ink);
}
._key-ink_1vezk_84 {
  background: var(--ink);
}
._key-gold_1vezk_87 {
  background: var(--gold);
}
._key-gray_1vezk_90 {
  background: var(--gray);
}
._key-light_1vezk_93 {
  background: var(--panel);
}
._key-hatched_1vezk_96 {
  background: repeating-linear-gradient(135deg, var(--surface) 0 4px, var(--line-strong) 4px 5.5px);
}

@media (max-width: 768px) {
  ._pie_1vezk_2 {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    justify-items: center;
  }
  ._list_1vezk_58 {
    width: 100%;
  }
}
/* dar ekranda sema kendi alaninda yana kaydirilir, sayfa tasmaz */
._scroll_z6cbi_2 {
  overflow-x: auto;
}

/* iki katman: cizgiler kartlarin altinda, numaralar ve etiketler ustunde */
._under_z6cbi_7,
._over_z6cbi_8 {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
._under_z6cbi_7 {
  z-index: 0;
}
._over_z6cbi_8 {
  z-index: 2;
}
._under_z6cbi_7 path {
  fill: none;
  stroke: var(--ink);
  stroke-width: 1.5;
}
._under_z6cbi_7 circle {
  fill: var(--ink);
}
._over_z6cbi_8 circle {
  fill: var(--paper);
  stroke: var(--ink);
  stroke-width: 1.5;
}
._over_z6cbi_8 text {
  font: 600 10px/1 var(--font-mono);
  fill: var(--ink);
  text-anchor: middle;
  dominant-baseline: central;
}
._over_z6cbi_8 text._end_z6cbi_41 {
  font-size: 11px;
  dominant-baseline: auto;
}

/* --- tablo karti --- */
._card_z6cbi_47 {
  position: relative;
  z-index: 1;
  align-self: start;
  background: var(--surface);
  border: 1.5px solid var(--ink);
}
._card_z6cbi_47 header {
  padding: 8px 10px;
  border-bottom: 1.5px solid var(--ink);
}
._card_z6cbi_47 header b {
  display: block;
  font: 600 12.5px/1.2 var(--font-mono);
}
._card_z6cbi_47 header small {
  display: block;
  margin-top: 3px;
  font: 400 10.5px/1 var(--font-mono);
  color: var(--faint);
  white-space: nowrap;
}
._card_z6cbi_47 ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
._card_z6cbi_47 li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  gap: 6px;
  align-items: center;
  padding: 5px 10px;
  font: 400 11.5px/1.3 var(--font-mono);
}
._card_z6cbi_47 li + li {
  border-top: 1px solid var(--line);
}
._card_z6cbi_47 li em {
  font-size: 10.5px;
  font-style: normal;
  color: var(--faint);
}
._card_z6cbi_47 li._link_z6cbi_90 {
  background: var(--gold-wash);
}
._card_z6cbi_47 li._more_z6cbi_93 {
  font-size: 11px;
  color: var(--faint);
}
._pk_z6cbi_97,
._fk_z6cbi_98 {
  display: inline-block;
  padding: 3px;
  font: 600 9px/1 var(--font-mono);
  font-style: normal;
  text-align: center;
  border: 1.5px solid var(--ink);
}
._pk_z6cbi_97 {
  background: var(--gold);
}
._fk_z6cbi_98 {
  background: var(--surface);
}

/* --- cizim levhasi: cift cerceve, sag altta antet --- */
._plate_z6cbi_114 {
  min-width: 600px;
  padding: 6px;
  background: var(--paper);
  border: 2px solid var(--ink);
}
._sheet_z6cbi_120 {
  position: relative;
  display: grid;
  column-gap: 50px;
  row-gap: 40px;
  padding: 30px 20px 92px;
  border: 1px solid var(--ink);
}
._antet_z6cbi_128 {
  position: absolute;
  right: 0;
  bottom: 0;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, auto);
  margin: 0;
  background: var(--surface);
  border-top: 1px solid var(--ink);
  border-left: 1px solid var(--ink);
}
._antet_z6cbi_128 div {
  padding: 7px 12px;
}
._antet_z6cbi_128 div + div {
  border-left: 1px solid var(--line);
}
._antet_z6cbi_128 dt {
  font: 600 9px/1 var(--font-mono);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--faint);
}
._antet_z6cbi_128 dd {
  margin: 5px 0 0;
  font: 600 13px/1 var(--font-mono);
}

/* levhanin altindaki numarali bag cumleleri */
._legend_z6cbi_158 {
  margin-top: 22px;
}
._links_z6cbi_161 {
  display: grid;
  gap: 9px;
  margin: 0;
  padding: 0;
  list-style: none;
}
._links_z6cbi_161 li {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  gap: 12px;
  font-size: 14px;
  line-height: 1.45;
}
._links_z6cbi_161 b {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  font: 600 10px/1 var(--font-mono);
  background: var(--paper);
  border: 1.5px solid var(--ink);
  border-radius: 50%;
}
._links_z6cbi_161 code {
  display: block;
  font: 500 11.5px/1.5 var(--font-mono);
  color: var(--faint);
}
._ends_z6cbi_190 {
  margin: 14px 0 0;
  font: 400 12.5px/1.5 var(--font-mono);
  color: var(--faint);
}

/* --- ortadaki tablo --- */
._center_z6cbi_197 {
  position: relative;
  display: grid;
  min-width: 600px;
  column-gap: 56px;
  row-gap: 46px;
  padding: 10px 2px 14px;
}
._center_z6cbi_197 ._card_z6cbi_47:not(._main_z6cbi_205) {
  align-self: center;
}
._main_z6cbi_205 {
  border-width: 2px;
  box-shadow: 0 4px 0 var(--ink);
}
._main_z6cbi_205 header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 11px 12px;
  color: var(--paper);
  background: var(--ink);
  border-bottom: 0;
}
._main_z6cbi_205 header b {
  font: 700 16px/1 var(--font-display);
}
._main_z6cbi_205 header small {
  margin-top: 0;
  color: var(--on-ink-muted);
}
._main_z6cbi_205 li {
  padding: 7px 12px;
  font-size: 12.5px;
}
/* tablo gercek bir disa aktarimin ekran goruntusu gibi durur. Bu yuzden hucre
   yazisi marka fontu degil, hesap tablosu programlarinin varsayilan fontu.
   Ic renkler programlarin kendi gri tonlari, marka paletinden degil. Dis
   cerceve yine iki piksellik murekkep, sayfanin geri kalanina baglansin diye.
   Bu renkler markanin degil tablo programinin oldugu icin tokens.css'e girmez,
   yalnizca burada, dosyanin basinda toplanir */
._sheet_urrf2_7 {
  --sheet-text: #1f1f1f;
  --sheet-bg: #fbfbf8;
  --sheet-line: #c4c3b8;
  --sheet-grid: #dcdad0;
  --sheet-head-bg: #ecebe4;
  --sheet-head-line: #c9c8bd;
  --sheet-filter-bg: #f3f2ec;
  --sheet-label: #555;
  --sheet-fx: #6b6b6b;
  --sheet-soft: #8a8a84;
  --sheet-empty: #a0a09a;

  font: 400 13px/1.3 Calibri, Carlito, 'Segoe UI', Arial, sans-serif;
  color: var(--sheet-text);
  background: var(--sheet-bg);
  border: 2px solid var(--ink);
}

._file_urrf2_26 {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 10px;
  font: 500 12px/1.3 var(--font-mono);
  color: var(--muted);
  background: var(--panel);
  border-bottom: 1px solid var(--sheet-line);
}

._bar_urrf2_37 {
  display: grid;
  grid-template-columns: 74px 30px minmax(0, 1fr);
  background: var(--sheet-bg);
  border-bottom: 1px solid var(--sheet-line);
}
._bar_urrf2_37 span {
  padding: 5px 8px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
._address_urrf2_49 {
  border-right: 1px solid var(--sheet-line);
}
._fx_urrf2_52 {
  font-style: italic;
  text-align: center;
  color: var(--sheet-fx);
  border-right: 1px solid var(--sheet-line);
}

._scroll_urrf2_59 {
  overflow-x: auto;
}
._scroll_urrf2_59 table {
  min-width: 100%;
  border-collapse: collapse;
}
._scroll_urrf2_59 th,
._scroll_urrf2_59 td {
  padding: 4px 6px;
  white-space: nowrap;
  text-align: left;
  border: 1px solid var(--sheet-grid);
}
/* sutun harfleri ve satir numaralari programlardaki gibi gri baslik hucreleri */
._scroll_urrf2_59 thead th,
._scroll_urrf2_59 tbody th {
  font-weight: 400;
  text-align: center;
  color: var(--sheet-label);
  background: var(--sheet-head-bg);
  border-color: var(--sheet-head-line);
}
._scroll_urrf2_59 thead th:first-child,
._scroll_urrf2_59 tbody th {
  width: 36px;
}

/* baslik satirinda hucrelerin yaninda filtre oku durur */
._head_urrf2_88 td {
  font-weight: 700;
  background: var(--sheet-filter-bg);
}
._head_urrf2_88 td::after {
  content: '▾';
  margin-left: 8px;
  font-size: 10px;
  color: var(--sheet-soft);
}
._total_urrf2_98 td {
  font-weight: 700;
  border-top: 2px solid var(--sheet-soft);
}
._scroll_urrf2_59 ._number_urrf2_102 {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
._selected_urrf2_106 {
  outline: 2px solid var(--ink);
  outline-offset: -2px;
}
._empty_urrf2_110 {
  color: var(--sheet-empty);
}

._tabs_urrf2_114 {
  display: flex;
  align-items: stretch;
  overflow-x: auto;
  white-space: nowrap;
  font-size: 12.5px;
  background: var(--panel);
  border-top: 1px solid var(--sheet-line);
}
._tabs_urrf2_114 span {
  padding: 6px 14px;
  color: var(--sheet-label);
  border-right: 1px solid var(--sheet-line);
}
._tabs_urrf2_114 ._active_urrf2_128 {
  font-weight: 700;
  color: var(--sheet-text);
  background: var(--sheet-bg);
  box-shadow: inset 0 -2px 0 var(--ink);
}

/* notlar tablonun parcasi, araliklarini kendileri verir. Acilir kutunun
   parca araligi kurali bu dosyadan once derlendigi icin buradaki kurala
   yenilir, deger burada acikca yaziliyor */
._note_urrf2_138 {
  margin: 14px 0 0;
  max-width: 70ch;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--muted);
}
._record_176ns_1 table {
  width: 100%;
  border-collapse: collapse;
  background: var(--surface);
  border: 2px solid var(--ink);
}
._record_176ns_1 thead th {
  padding: 11px 14px;
  font: 600 10.5px/1.2 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-align: left;
  color: var(--faint);
  border-bottom: 2px solid var(--ink);
}
._record_176ns_1 thead th:first-child {
  width: 110px;
}
._record_176ns_1 tbody th,
._record_176ns_1 td {
  padding: 11px 14px;
  text-align: left;
  vertical-align: top;
  border-top: 1px solid var(--line);
}
._record_176ns_1 tbody tr:first-child th,
._record_176ns_1 tbody tr:first-child td {
  border-top: 0;
}
._record_176ns_1 tbody th {
  font: 500 12px/1.6 var(--font-mono);
  color: var(--faint);
}
._before_176ns_34 {
  font: 400 13px/1.5 var(--font-mono);
  color: var(--muted);
}
._after_176ns_38 {
  font: 700 14px/1.45 var(--font-body);
}
/* degisen alanin yeni degeri altin bir cizgiyle isaretlenir */
._changed_176ns_42 ._after_176ns_38 {
  box-shadow: inset 4px 0 0 var(--gold);
}
._same_176ns_45 td {
  font-weight: 400;
  color: var(--faint);
}
._record_176ns_1 ._empty_176ns_49 {
  color: var(--line-strong);
  font-weight: 400;
}
._note_176ns_53 {
  margin: 12px 0 0;
  font: 400 12.5px/1.5 var(--font-mono);
  color: var(--faint);
}

@media (max-width: 768px) {
  ._record_176ns_1 thead th:first-child {
    width: 72px;
  }
  ._record_176ns_1 thead th,
  ._record_176ns_1 tbody th,
  ._record_176ns_1 td {
    padding: 9px 8px;
  }
  ._before_176ns_34 {
    font-size: 11.5px;
  }
  ._after_176ns_38 {
    font-size: 12.5px;
  }
}
/* soldaki iki piksellik cizgi hattin kendisi, istasyonlar onun boyunca alt
   alta durur */
._line_1f4o8_3 {
  counter-reset: station;
  position: relative;
  display: grid;
  gap: 28px;
  padding-left: 72px;
}
._line_1f4o8_3::before {
  content: '';
  position: absolute;
  left: 26px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: var(--ink);
}

._station_1f4o8_20 {
  counter-increment: station;
  position: relative;
  background: var(--surface);
  border: var(--card-border);
}
/* numara hattin uzerinde, istasyonun sol ust kosesinin hizasinda koyu bir
   kutuya oturur */
._station_1f4o8_20::before {
  content: counter(station, decimal-leading-zero);
  position: absolute;
  left: -72px;
  top: -2px;
  display: grid;
  place-items: center;
  width: 54px;
  height: 40px;
  font: 700 13px/1 var(--font-mono);
  color: var(--gold);
  background: var(--ink);
}

._text_1f4o8_42 {
  padding: clamp(20px, 2.4vw, 32px);
}
._text_1f4o8_42 h3 {
  margin: 0 0 12px;
  font-size: clamp(22px, 2.2vw, 30px);
  letter-spacing: -0.025em;
}
._text_1f4o8_42 p {
  margin: 0;
  max-width: 58ch;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--muted);
}

/* ayrinti seridi istasyonun alt kenarinda. Kapaliyken istasyonda yalnizca ne
   yapildigi yazar */
._more_1f4o8_60 > summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px clamp(20px, 2.4vw, 32px);
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  list-style: none;
  background: var(--paper);
  border-top: 2px solid var(--ink);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
._more_1f4o8_60 > summary::-webkit-details-marker {
  display: none;
}
._more_1f4o8_60 > summary:hover {
  background: var(--panel);
}
._more_1f4o8_60[open] > summary {
  color: var(--on-ink);
  background: var(--ink);
}

._details_1f4o8_85 {
  padding: clamp(18px, 2.2vw, 28px) clamp(20px, 2.4vw, 32px);
  border-top: 2px solid var(--ink);
}
._more_1f4o8_60[open] ._details_1f4o8_85 {
  --drop-from: -10px;
  animation: drop 0.28s cubic-bezier(0.2, 0.7, 0.2, 1);
}
._details_1f4o8_85 p {
  margin: 0;
  max-width: 64ch;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--muted);
}
._details_1f4o8_85 p + p {
  margin-top: 12px;
}

/* dar ekranda hat cizgisi kalkar, numara kutusu istasyonun ust kenarina
   biner */
@media (max-width: 768px) {
  ._line_1f4o8_3 {
    gap: 40px;
    padding-left: 0;
  }
  ._line_1f4o8_3::before {
    display: none;
  }
  ._station_1f4o8_20::before {
    left: -2px;
    top: -26px;
    width: 48px;
    height: 26px;
    font-size: 12px;
  }
}
._wrap_o9cif_1 {
  overflow-x: auto;
}

._table_o9cif_5 {
  width: 100%;
  min-width: 620px;
  font-size: 14.5px;
  border-collapse: collapse;
}
._table_o9cif_5 th {
  padding: 10px 12px 10px 0;
  font: 700 11px/1.2 var(--font-mono);
  letter-spacing: 0.12em;
  text-align: left;
  text-transform: uppercase;
  color: var(--faint);
  border-bottom: 2px solid var(--ink);
}
._table_o9cif_5 td {
  padding: 14px 12px 14px 0;
  line-height: 1.5;
  vertical-align: top;
  color: var(--muted);
  border-bottom: 1px solid var(--line);
}
._table_o9cif_5 tr:last-child td {
  border-bottom: 2px solid var(--ink);
}
._table_o9cif_5 ._key_o9cif_30 {
  font: 600 15px/1.35 var(--font-display);
  white-space: nowrap;
  color: var(--ink);
}

/* hucre ici kucuk oran cubugu. Cerceve ve dolgu murekkep, deger hemen yaninda */
._meter_o9cif_37 {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 150px;
}
._meter_o9cif_37 i {
  position: relative;
  flex: 1;
  height: 12px;
  background: var(--paper);
  border: 1.5px solid var(--ink);
}
._meter_o9cif_37 i::after {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--w);
  background: var(--ink);
}
._meter_o9cif_37 b {
  width: 34px;
  font: 700 12px/1 var(--font-mono);
  text-align: right;
  color: var(--ink);
}
._timeline_mgxkf_1 {
  background: var(--surface);
  border: 2px solid var(--ink);
}

._row_mgxkf_6 {
  display: grid;
  grid-template-columns: minmax(150px, 1.1fr) repeat(var(--n), minmax(0, 1fr));
  border-bottom: 1px solid var(--line);
}
._row_mgxkf_6:last-child {
  border-bottom: 0;
}
._row_mgxkf_6 > * {
  padding: 10px 12px;
}

._head_mgxkf_18 {
  background: var(--paper);
  border-bottom: 2px solid var(--ink);
}
._head_mgxkf_18 span {
  padding: 12px 0;
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.1em;
  text-align: center;
  color: var(--faint);
  border-left: 1px solid var(--line);
}
._head_mgxkf_18 span:first-child {
  padding-left: 12px;
  text-align: left;
  border-left: 0;
}

._task_mgxkf_36 {
  font: 600 14px/1.3 var(--font-display);
  letter-spacing: -0.01em;
}

/* donem cizgileri izin satirinda arka planla cizilir, cubuk basladigi
   donemin solundan baslar ve suresi kadar uzanir. Iki yandan dorder piksel
   bosluk, bitisik isler birbirine yapismasin diye */
._track_mgxkf_44 {
  grid-column: 2 / -1;
  position: relative;
  padding: 8px 0;
  background-image: linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: calc(100% / var(--n)) 100%;
}
._track_mgxkf_44 i {
  display: block;
  width: calc(var(--l) * 100% / var(--n) - 8px);
  height: 22px;
  margin-left: calc((var(--s) - 1) * 100% / var(--n) + 4px);
  background: var(--ink);
}
._track_mgxkf_44 i._highlight_mgxkf_58 {
  background: var(--gold);
  border: 2px solid var(--ink);
}

._legend_mgxkf_63 {
  margin: 12px 0 0;
  font: 500 12.5px/1.5 var(--font-mono);
  color: var(--faint);
}

@media (max-width: 768px) {
  ._timeline_mgxkf_1 {
    overflow-x: auto;
  }
  ._row_mgxkf_6 {
    min-width: 560px;
  }
}
/* agac koyu zeminde, kod bloklariyla ayni ailede */
._tree_1hv2d_2 {
  margin: 0;
  padding: 18px 20px;
  overflow-x: auto;
  font: 400 13px/1.8 var(--font-mono);
  white-space: pre;
  color: var(--on-ink);
  background: var(--ink);
  border: 2px solid var(--ink);
}
._root_1hv2d_12 {
  font-weight: 700;
  color: var(--gold);
}
._note_1hv2d_16 {
  color: var(--code-comment);
}
/* kod sayfasinda paylasilan dosyalar altin, paylasilmayanlar soluk */
._highlight_1hv2d_20 {
  font-weight: 700;
  color: var(--gold);
}
._muted_1hv2d_24 {
  color: var(--code-muted);
}
/* govde landing'in icerik genisligi artisi iki kenar boslugu kadar genisler.
   Kenar boslugu genisligin icinden dusmesin diye boyle, kapak ve ozet bandiyla
   ayni sol hizaya oturur. Sol sutun icindekiler icin */
._body_kqgvz_4 {
  max-width: calc(var(--maxw) + 2 * var(--gutter));
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  gap: clamp(32px, 4vw, 72px);
}

._chapters_kqgvz_13 {
  grid-column: 2;
  min-width: 0;
}

/* icindekiler bu genisligin altinda ustte bir bara donusur, govde tek
   sutuna iner */
@media (max-width: 1100px) {
  ._body_kqgvz_4 {
    display: block;
  }
}
/* bolumler arasinda kalin cizgi var, ilk bolumun ustunde yok. min-width
   sifir, cunku bolum bir izgara sutununda duruyor ve icindeki genis bir
   tablo sutunu disari itmesin */
._chapter_1hury_4 {
  min-width: 0;
  padding: 64px 0 72px;
  border-top: 2px solid var(--ink);
}
._chapter_1hury_4:first-child {
  border-top: 0;
}

._head_1hury_13 {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}

._number_1hury_20 {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  font: 700 18px/1 var(--font-mono);
  background: var(--surface);
  border: 2px solid var(--ink);
  box-shadow: var(--lift-shadow);
}

._title_1hury_31 {
  margin-top: 10px;
  max-width: 22ch;
  font-size: clamp(28px, 3.3vw, 46px);
  line-height: 1.06;
  letter-spacing: -0.03em;
}

/* giris ve parcalar numara kutusunun genisligi ve aradaki bosluk kadar
   iceriden baslar, basligin hizasina oturur. Giris bolumun kisa halidir,
   okur yalnizca bunlari okusa bile isin hikayesini alir */
._lede_1hury_42 {
  margin: 26px 0 0 74px;
  max-width: 60ch;
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.55;
}

._body_1hury_49 {
  margin: 36px 0 0 74px;
}

/* parcalar arasi bosluk burada verilir, parcalar kendi disinda bosluk
   birakmaz. Art arda gelen paragraflar birbirine daha yakin durur */
._body_1hury_49 > * + * {
  margin-top: 36px;
}
._body_1hury_49 > p + p {
  margin-top: 14px;
}
/* acilir kutular bir paragraftan sonra biraz daha yakin, art arda geldiklerinde
   birbirine cok yakin durur, bir grup gibi okunsunlar diye */
._body_1hury_49 > p + details {
  margin-top: 28px;
}
._body_1hury_49 > details + details {
  margin-top: 10px;
}
/* art arda gelen sekiller arasinda daha genis bosluk, her biri ayri bir
   soruya cevap verir */
._body_1hury_49 > figure + figure {
  margin-top: 64px;
}
/* kod sayfasinda art arda gelen dosyalar bir grup gibi daha yakin durur.
   Veri dosyalarinin altinda birer not oldugu icin aralari biraz daha genis.
   Isaretler FileFrame ve DataFile'in kok ogesinde */
._body_1hury_49 > [data-file] + [data-file] {
  margin-top: 28px;
}
._body_1hury_49 > [data-datafile] + [data-datafile] {
  margin-top: 36px;
}

/* icindekiler ustte bara donustugunde giris ve parcalar sol kenardan baslar */
@media (max-width: 1100px) {
  ._lede_1hury_42,
  ._body_1hury_49 {
    margin-left: 0;
  }
}

@media (max-width: 768px) {
  ._chapter_1hury_4 {
    padding: 48px 0 56px;
  }
  ._head_1hury_13 {
    gap: 14px;
  }
  ._number_1hury_20 {
    width: 44px;
    height: 44px;
    font-size: 15px;
  }
}
._switch_v9kk7_1 {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* mockup'taki secim dugmesi: kagit zeminde murekkep cerceve, secili olan
   koyu zemine doner */
._option_v9kk7_9 {
  padding: 9px 14px;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: var(--ink);
  background: var(--paper);
  border: 2px solid var(--ink);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
._option_v9kk7_9:hover {
  background: var(--panel);
}
._option_v9kk7_9[aria-pressed='true'] {
  color: var(--on-ink);
  background: var(--ink);
}
/* masaustunde liste solda sabit durur, okur kaydirdikca ekranda kalir */
._toc_7mfqi_2 {
  position: sticky;
  top: 0;
  align-self: start;
  padding: 64px 0 40px;
}
/* Bolum sayisi cok olup liste ekrandan uzun duserse kendi icinde kayar,
   yoksa alttaki bolumlere hic ulasilamazdi, blok katalogunda boyle. Liste
   ekrana sigiyorsa kaydirma cubugu cikmaz, gorunus degismez. Yalnizca
   masaustunde, dar ekrandaki barin altindaki okuma cizgisi kutunun disinda
   durur ve kirpilmamali */
@media (min-width: 1101px) {
  ._toc_7mfqi_2 {
    max-height: 100vh;
    overflow-y: auto;
  }
}

/* bar yalnizca dar ekranda gorunur */
._bar_7mfqi_21 {
  display: none;
}

._list_7mfqi_25 {
  position: relative;
  margin: 18px 0 0;
  padding: 0 0 0 18px;
  list-style: none;
}
/* listenin solundaki ince cizgi, ustunde okudukca altinla dolan ikinci cizgi.
   Doluluk --p'den gelir, sifir ile bir arasinda */
._list_7mfqi_25::before,
._list_7mfqi_25::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 2px;
}
._list_7mfqi_25::before {
  bottom: 0;
  background: var(--line);
}
._list_7mfqi_25::after {
  height: calc(var(--p, 0) * 100%);
  background: var(--gold);
}

._list_7mfqi_25 a {
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 10px;
  padding: 7px 0;
  font: 600 14.5px/1.25 var(--font-display);
  color: var(--muted);
  transition: color 0.15s ease;
}
._list_7mfqi_25 a:hover {
  color: var(--ink);
}

._number_7mfqi_64 {
  display: grid;
  place-items: center;
  height: 26px;
  font: 700 11px/1 var(--font-mono);
  color: var(--faint);
  border: 2px solid var(--line);
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

/* okunan bolumun numara kutusu koyulasir, numara altin olur */
._list_7mfqi_25 a[aria-current] {
  color: var(--ink);
}
._list_7mfqi_25 a[aria-current] ._number_7mfqi_64 {
  color: var(--gold);
  background: var(--ink);
  border-color: var(--ink);
}

/* okuma suresi listenin altinda kalin bir cizgiyle ayrilir */
._time_7mfqi_85 {
  margin: 28px 0 0;
  padding-top: 16px;
  font: 500 12px/1.4 var(--font-mono);
  color: var(--faint);
  border-top: 2px solid var(--ink);
}

/* dar ekranda icindekiler sayfanin ustune yapisan bir bara donusur. Kenar
   boslugunu tasarak tam genislige yayilir, liste bara dokununca acilir.
   Altin cizgi okudukca soldan saga dolar. Cizgi barin degil butun kutunun
   alt kenarinda durur, liste acikken listenin altina iner */
@media (max-width: 1100px) {
  ._toc_7mfqi_2 {
    z-index: 15;
    margin: 0 calc(-1 * var(--gutter));
    padding: 0;
    background: var(--paper);
    border-bottom: 2px solid var(--ink);
  }
  /* global.css'teki .eyebrow derlenen CSS'te bu dosyadan sonra gelir ve
     display: block verir, esit onemde bir kural onu ezemiyor. Kural bu
     yuzden kutuya baglanip daha belirgin yazildi */
  ._toc_7mfqi_2 ._title_7mfqi_108,
  ._time_7mfqi_85 {
    display: none;
  }
  ._bar_7mfqi_21 {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 12px var(--gutter);
    font: 700 15px/1.2 var(--font-display);
    color: var(--ink);
    text-align: left;
    background: none;
    border: 0;
    cursor: pointer;
  }
  ._bar_7mfqi_21 ._number_7mfqi_64 {
    width: 34px;
    color: var(--gold);
    background: var(--ink);
    border-color: var(--ink);
  }
  ._bar_7mfqi_21::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2px;
    width: calc(var(--p, 0) * 100%);
    height: 2px;
    background: var(--gold);
  }
  ._caret_7mfqi_140 {
    margin-left: auto;
    font-family: var(--font-mono);
    transition: transform 0.2s ease;
  }
  ._open_7mfqi_145 ._caret_7mfqi_140 {
    transform: rotate(180deg);
  }
  ._list_7mfqi_25 {
    display: none;
    margin: 0;
    padding: 4px var(--gutter) 14px;
    border-top: 1px solid var(--line);
  }
  ._list_7mfqi_25::before,
  ._list_7mfqi_25::after {
    display: none;
  }
  ._open_7mfqi_145 ._list_7mfqi_25 {
    display: block;
  }
}
/* kapak ekrani kaplar ve alt cizgiyle ozet bandindan ayrilir. Header seffaf
   olarak ustunde durdugu icin ust bosluk header yuksekligi artisi kadardir,
   mockup'taki yuz yirmi piksel. Metin ve facts birlikte dikeyde ortalanir */
._cover_khgxr_4 {
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding: 0 var(--gutter);
  border-bottom: 2px solid var(--ink);
}

/* facts sagda dar bir sutun. Iki sutun alt kenarlarindan hizalanir, boylece
   facts alaninin son satiri aciklamanin son satiriyla ayni hizada biter */
._inner_khgxr_14 {
  width: 100%;
  padding: calc(var(--header-height) + 36px) 0 72px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
  column-gap: clamp(40px, 6vw, 112px);
  align-items: end;
}

._crumb_khgxr_23 {
  display: flex;
  align-items: center;
  gap: 12px;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
}
._crumb_khgxr_23 a {
  padding: 7px 10px;
  border: 2px solid var(--ink);
  background: var(--paper);
  transition: background 0.15s ease, color 0.15s ease;
}
._crumb_khgxr_23 a:hover {
  background: var(--ink);
  color: var(--on-ink);
}
._crumb_khgxr_23 span {
  color: var(--faint);
}

._tags_khgxr_44 {
  margin-top: 34px;
}

._title_khgxr_48 {
  margin-top: 18px;
  max-width: 18ch;
  font-size: clamp(38px, 5.2vw, 76px);
  line-height: 1;
  letter-spacing: -0.04em;
}

._lede_khgxr_56 {
  margin: 26px 0 0;
  max-width: 54ch;
  font-size: clamp(16px, 1.45vw, 19px);
  line-height: 1.6;
  color: var(--muted);
}

/* satirlar arasinda kalin cizgi var, uclarda yok */
._facts_khgxr_65 {
  margin: 0;
}
._facts_khgxr_65 div {
  padding: 16px 0;
  border-top: 2px solid var(--ink);
}
._facts_khgxr_65 div:first-child {
  padding-top: 0;
  border-top: 0;
}
._facts_khgxr_65 div:last-child {
  padding-bottom: 0;
}
._facts_khgxr_65 dt {
  font: 700 11px/1 var(--font-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
}
._facts_khgxr_65 dd {
  margin: 10px 0 0;
  font: 600 var(--text-lead)/1.3 var(--font-display);
  letter-spacing: -0.01em;
}

/* mobilde header akista durur, kapak ekranin kalanini kaplar, icerik alta
   yaslanir ve facts basligin altina iner */
@media (max-width: 768px) {
  ._cover_khgxr_4 {
    min-height: calc(100svh - var(--header-height));
    align-items: flex-end;
  }
  ._inner_khgxr_14 {
    padding: 36px 0 40px;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 40px;
  }
}
/* bant zemininde, ustte kalin cizgiyle govdeden ayrilir. Figur alanin altina
   yaslanir, ayaklari alt bilginin ust cizgisine oturur. Mobilde figur yok,
   iletisim bolumuyle ayni */
._closing_fhlbp_4 {
  padding: clamp(48px, 6vw, 88px) var(--gutter) 0;
  background: var(--panel);
  border-top: 2px solid var(--ink);
}
._inner_fhlbp_9 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: clamp(24px, 4vw, 72px);
  align-items: end;
  max-width: var(--maxw);
  margin: 0 auto;
}
._copy_fhlbp_17 {
  padding-bottom: clamp(48px, 6vw, 88px);
}
._copy_fhlbp_17 h2 {
  margin-top: 16px;
  max-width: 18ch;
  font-size: clamp(32px, 4vw, 56px);
  line-height: 1;
  letter-spacing: -0.03em;
}

/* donus ve sonraki calisma kartlari yan yana, iki kutulu kart dili */
._next_fhlbp_29 {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
  max-width: 760px;
  margin-top: 32px;
}
._next_fhlbp_29 a {
  display: grid;
  gap: 6px;
}
._box_fhlbp_40 {
  background: var(--paper);
  border: var(--card-border);
  transition: transform var(--lift-time) ease, box-shadow var(--lift-time) ease;
}
._next_fhlbp_29 a:hover ._box_fhlbp_40 {
  transform: translateY(var(--lift));
  box-shadow: var(--lift-shadow);
}
._next_fhlbp_29 a:hover h3,
._next_fhlbp_29 a:hover ._go_fhlbp_50 {
  text-decoration: underline;
  text-underline-offset: 3px;
}
._head_fhlbp_54 {
  padding: 16px 18px;
}
._head_fhlbp_54 .eyebrow {
  margin-bottom: 10px;
}
._head_fhlbp_54 h3 {
  font-size: clamp(22px, 2.2vw, 30px);
  letter-spacing: -0.03em;
}
._back_fhlbp_64 ._head_fhlbp_54 {
  background: var(--surface);
}
._panel_fhlbp_67 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  font-size: 14px;
  color: var(--muted);
}
._go_fhlbp_50 {
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: var(--ink);
}

._mail_fhlbp_83 {
  display: inline-block;
  margin-top: 28px;
  font: 500 clamp(16px, 1.6vw, 20px) / 1 var(--font-mono);
}
._mail_fhlbp_83:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

._art_fhlbp_93 {
  display: block;
  position: relative;
  top: 1px;
  height: clamp(300px, 32vw, 440px);
  width: auto;
}
._art_fhlbp_93 img {
  display: block;
  height: 100%;
  width: auto;
}

@media (max-width: 768px) {
  ._inner_fhlbp_9 {
    grid-template-columns: 1fr;
  }
  ._copy_fhlbp_17 {
    padding-bottom: 36px;
  }
  ._next_fhlbp_29 {
    grid-template-columns: 1fr;
  }
  ._art_fhlbp_93 {
    display: none;
  }
}
/* iki kutulu kart: ustte etiket ve baslik, altinda aciklama ve gecis. Uzerine
   gelince kutular kalkar, altina sert golge duser */
._card_1m1ku_3 {
  display: grid;
  gap: 6px;
}
._box_1m1ku_7 {
  display: block;
  background: var(--paper);
  border: var(--card-border);
  transition: transform var(--lift-time) ease, box-shadow var(--lift-time) ease;
}
._card_1m1ku_3:hover ._box_1m1ku_7 {
  transform: translateY(var(--lift));
  box-shadow: var(--lift-shadow);
}
._card_1m1ku_3:hover h3,
._card_1m1ku_3:hover ._go_1m1ku_18 {
  text-decoration: underline;
  text-underline-offset: 3px;
}

._head_1m1ku_23 {
  padding: 18px 22px;
}
._head_1m1ku_23 .eyebrow {
  margin-bottom: 10px;
}
._head_1m1ku_23 h3 {
  margin: 0;
  font-size: clamp(22px, 2.2vw, 30px);
  letter-spacing: -0.03em;
}

._panel_1m1ku_35 {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  padding: 18px 22px;
}
._text_1m1ku_42 {
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.65;
  color: var(--muted);
}
._go_1m1ku_18 {
  flex: none;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.04em;
  color: var(--ink);
}

@media (max-width: 768px) {
  ._panel_1m1ku_35 {
    flex-direction: column;
    align-items: flex-start;
  }
}
/* kapagin altinda bant zemininde duran serit. Icerik landing'in genisligine
   ortalanir, zemin ve alt cizgi tam genislikte kalir */
._summary_1wjxo_3 {
  padding: clamp(36px, 4.4vw, 60px) var(--gutter);
  background: var(--panel);
  border-bottom: 2px solid var(--ink);
}

._inner_1wjxo_9 {
  max-width: var(--maxw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* sutunlar arasinda dikey cizgi var, kapaktaki facts alaninin yatay cizgileriyle
   karismasin diye. Ilk sutunun solunda cizgi ve bosluk yok */
._column_1wjxo_18 {
  padding: 0 clamp(20px, 2.6vw, 40px);
  border-left: 2px solid var(--ink);
}
._column_1wjxo_18:first-child {
  padding-left: 0;
  border-left: 0;
}
._column_1wjxo_18 h2 {
  margin-bottom: 12px;
  font-size: clamp(19px, 1.6vw, 22px);
  letter-spacing: -0.02em;
}
._column_1wjxo_18 p {
  margin: 0;
  font-size: 16px;
  line-height: 1.65;
}

/* mobilde sutunlar alt alta iner, aradaki cizgiler yataya doner */
@media (max-width: 768px) {
  ._inner_1wjxo_9 {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  ._column_1wjxo_18 {
    padding: 22px 0 0;
    border-left: 0;
    border-top: 2px solid var(--ink);
  }
  ._column_1wjxo_18:first-child {
    padding-top: 0;
    border-top: 0;
  }
}
/*
file: global.css
importable: .wrap, .eyebrow, .mono, .sr, .cta, .cta.primary, .reveal, .rise

Site genelinde paylasilan taban stiller: reset, tipografi ve birden fazla
bolumde tekrar eden birkac yardimci sinif. Bolume ozel hicbir sey burada
durmaz, o bilgi kendi bilesenin css modulunde kalir.

description: Reset, temel tipografi ve tum sayfalarda tekrar eden birkac paylasilan yardimci sinifi tanimlayan global stil dosyasi.
*//*
file: tokens.css
importable: bu dosyadaki --degiskenlerin hepsi

PaktLabs'in butun sitelerinin ortak marka paleti, bosluk olcegi ve golge
degerleri. Landing ve disiplin subdomainleri bu dosyayi global.css uzerinden
alir, kendi stillerinde renk ya da font sabiti tekrar yazmaz. Burada bir
deger degisirse butun siteler birlikte degisir, o yuzden landing'in gorsel
testleri her degisiklikte calistirilmali.

description: PaktLabs sitelerinin paylastigi renk, bosluk ve golge degiskenlerini tanimlayan tek dosya.
*/

/* renk degerleri dogrudan landing_mockup.html'deki :root'tan tasindi, hue'lara
   dokunulmadi. yeni bir disiplin sayfasi acilirsa tone eslesmesi (--web/--auto/--data)
   burada guncellenir, baska hicbir dosyada renk sabiti tekrar tanimlanmaz. */
:root {
  /* her hex degeri tek bir adda durur, ayni renge giden diger adlar var() ile
     buna baglanir. Bir renk degisirse yalnizca burada degisir */
  --gold: #e5b32e;
  --gray: #7e909e;

  --paper: #e9e8e0;
  --surface: #f2f1ea;
  --panel: #dcdbd0;
  --ink: #2d3037;
  --muted: #565a62;
  /* soluk metin rengi. --gray ile ayni ton ama daha koyu, kucuk etiketler
     paper, panel ve surface zeminlerin hepsinde en az 4.5 kontrasti gecsin diye.
     dekoratif cizgiler bu degiskeni degil --gray'i kullanir */
  --faint: #52626e;
  /* altinin kagit zemine karismis acik tonu. Sekillerde vurgulu bolgenin
     zemini gibi altinin dolu haliyle bagirmamasi gereken yerlerde */
  --gold-wash: color-mix(in srgb, var(--gold) 26%, var(--paper));
  --line: #d3d2c6;
  --line-strong: #b7b6a8;
  --on-ink: var(--paper);
  /* murekkep zeminde ikinci planda kalan yazi, e-posta ve kisa aciklamalar
     gibi. data'daki yazar kutusu ve landing'deki profil bandi kullanir */
  --on-ink-muted: #c9cbd0;
  /* klavye odak cercevesinin rengi. Acik zeminde murekkep. Koyu zeminli bir
     alan, ornegin data'daki kod cercevesi, bunu kendi kutusunda altina cevirir,
     icindeki dugmelerin cercevesi koyu zeminde kaybolmasin diye */
  --focus-ring: var(--ink);

  --tone-web: var(--gray);
  --tone-auto: var(--gold);
  --tone-data: var(--ink);

  --maxw: 1040px;
  --measure: 780px;

  /* sayfanin sag ve sol kenar boslugu. Bolumlerin ic boslugu, header ve kenara
     hizalanan figurler hep bunu kullanir, bosluk degisirse hepsi birlikte kayar */
  --gutter: clamp(20px, 4vw, 56px);

  /* ust barin yuksekligi. Bar hero'larin ustunde seffaf durdugu icin hero'lar
     ve tam ekran bolumler bu kadar payi kendileri birakir, mobilde de akista
     bu kadar yer kaplar. Bar degisirse hepsi buradan birlikte kayar */
  --header-height: 84px;

  /* sitelerin hero cizimleri ayni his ve olcuyle durur. Cizimin en fazla
     yuksekligi ve sutunda bosta kalan alanin ne kadarinin cizimin saginda
     kalacagi burada tek yerde tutulur, her site yalnizca kendi cizim oranini
     verir. 0.5 tam ortalamadir, daha kucuk deger cizimi saga yaklastirir */
  --hero-art-height: min(70.4svh, 660px);
  --hero-art-right-share: 0.25;

  --gap: 112px;

  /* giris metni ve bolum basliginin boyutu. Landing ve data ayni olcuyu
     kullanir, degisirse hepsi birlikte kayar */
  --text-lead: clamp(15px, 1.3vw, 17px);
  --text-section: clamp(32px, 3.8vw, 52px);

  /* kart dili: iki piksellik cerceve, uzerine gelince uc piksel yukari kalkis
     ve altina dusen sert golge. Hangi kutunun kalkacagini bilesen secer,
     olculer buradan gelir. Altin golgeli kart --lift-drop'u kendi rengiyle
     kullanir */
  --card-border: 2px solid var(--ink);
  --lift: -3px;
  --lift-drop: 0 3px 0;
  --lift-shadow: var(--lift-drop) var(--ink);
  --lift-time: 0.16s;

  --font-display: 'Space Grotesk', 'Atkinson Hyperlegible', system-ui, sans-serif;
  --font-body: 'Atkinson Hyperlegible', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

/* sayfa ici bir baglantiya tiklaninca sayfa hedefe atlamak yerine kayarak
   gider, okur nereye geldigini gorur. Hedefin ustunde biraz pay kalir ki
   baslik ekranin tam kenarina yapismasin */
html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 24px;
}

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

/* img varsayilan olarak inline gelir, akisa girdigi her yerde metin satiri
   gibi altina birkac pikselik bosluk birakir. bunu reset katmaninda kapatiyoruz
   ki akisa giren hicbir gorsel bu sessiz bosluga bir daha yakalanmasin */
img {
  display: block;
}

h1,
h2,
h3 {
  font-weight: 700;
  font-family: var(--font-display);
  margin: 0;
}

/* klavyeyle gelinen her eleman ayni cerceveyi alir. Yalnizca baglanti ve dugme
   yetmiyor, acilir kutu basliklari ve tarayicinin Tab sirasina kendisi aldigi
   yana kayan kutular da var, onlar yoksa tarayicinin ince halkasinda kalir.
   Fareyle tiklamada :focus-visible devreye girmez, cerceve yalnizca klavyede
   gorunur */
:focus-visible {
  outline: 2px solid var(--focus-ring);
  outline-offset: 2px;
}

/* ekran okuyucu icin gorunmez ama erisilebilir metin, gorsel olarak hicbir yer kaplamaz */
.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.mono {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

/* icerigi maxw'e kilitleyen, sayfada tekrar eden tek sutun */
.wrap {
  max-width: var(--maxw);
  margin: 0 auto;
  padding: 0 32px;
}

/* viewport'un iki kenarina kadar kirilan bolumler icin ortak desen, dort
   bolumde (biz kimiz / disiplinler / isler / iletisim) ayni sekilde kullanilir */
.full-bleed {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
}

.eyebrow {
  display: block;
  font: 700 12px/1 var(--font-mono);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--faint);
}

/* butonlarin ortak temeli, disiplinler bandindaki ve isler seritlerindeki
   varyantlar bu sinifi genisletir, renkleri kendi css modullerinde degistirir */
.cta {
  display: inline-block;
  padding: 12px 22px;
  font: 700 14px/1 var(--font-display);
  letter-spacing: -0.005em;
  color: var(--ink);
  background: transparent;
  border: 1px solid var(--ink);
  border-radius: 3px;
  cursor: pointer;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
.cta:hover {
  background: var(--ink);
  color: var(--on-ink);
}
.cta.primary {
  background: var(--ink);
  color: var(--on-ink);
}
.cta.primary:hover {
  background: transparent;
  color: var(--ink);
}

/* useReveal görünür olan elemana in sınıfını ekler. Buradaki transform
   yalnızca belirme hareketini taşır. Kalıcı konumu bileşenin kendi CSS
   modülü belirler, animasyon kaldırıldığında yerleşim değişmez.

   Hareketi bileşen değişkenle ayarlar, bu sınıfı ezmesi gerekmez:
   --reveal-from kaç piksel uzaktan geldiği (eksi değer yukarıdan),
   --reveal-time süre, --reveal-ease transform eğrisi, --i ile --reveal-step
   elemanlar arası sıra gecikmesi. Belirme dışında geçiş isteyen bileşen
   (kalkış, gölge, dönüş) onları --reveal-extra'ya virgülle yazar, çünkü
   reveal transition'ı tek yerden verir ve bileşenin kendi transition'ını
   zaten ezerdi. Ek geçişler gecikmesiz çalışır */
.reveal {
  opacity: 0;
  transform: translateY(var(--reveal-from, 22px));
  transition:
    opacity var(--reveal-time, 0.6s) ease calc(var(--i, 0) * var(--reveal-step, 0ms)),
    transform var(--reveal-time, 0.6s) var(--reveal-ease, ease)
      calc(var(--i, 0) * var(--reveal-step, 0ms)),
    var(--reveal-extra, color 0s);
}
.reveal.in {
  opacity: 1;
  transform: translateY(0);
}

/* hero metinleri sayfa acilirken sirayla asagidan yukselir. Siradaki yeri
   --rise-delay, ne kadar asagidan geldigi --rise-offset ile bilesenin kendi
   CSS modulunden verilir. Offset sifir verilirse eleman yalnizca belirir.
   reveal'dan farki ekrana girmeyi beklememesi, sayfa acilir acilmaz baslamasi.

   Elemanin kendi stili son halidir, animasyon yalnizca girisi oynatir. from
   karesi gecikme boyunca backwards ile tutulur, animasyon bitince geride hic
   etkisi kalmaz. Son hal animasyonla tutulsaydi eleman ayri bir cizim
   katmaninda kalir ve yazinin kenar yumusatmasi duragan sayfadan farkli
   olurdu. Hareket azaltma tercihinde animasyon hic calismadigi icin eleman
   zaten son halinde baslar, ayrica bir kurala gerek yok */
.rise {
  animation: rise 0.7s cubic-bezier(0.2, 0.7, 0.2, 1) var(--rise-delay, 0s) backwards;
}
@keyframes rise {
  from {
    opacity: 0;
    transform: translateY(var(--rise-offset, 20px));
  }
}

/* kutular ve paneller acilirken yukaridan duser. Bilesenin css modulu bu
   animasyonu global(drop) adiyla cagirir, modul kendi adina cevirmesin diye.
   Mesafe --drop-from ile ayarlanir, sira gecikmesi bilesende --i ile verilir */
@keyframes drop {
  from {
    opacity: 0;
    transform: translateY(var(--drop-from, -12px));
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
  }
}
/*
file: tokens.css
importable: bu dosyadaki --degiskenlerin hepsi

data sitesine ozel renk degiskenleri. Ortak marka paleti brand'deki
tokens.css'tedir, burada yalnizca bugun yalnizca data'nin kullandigi
tonlar durur: kod bloklarinin, terminal ciktisinin ve dosya agacinin koyu
zemini uzerindeki ikincil renkler. Degerler kod ve veri sayfasinin
mockup'indan alindi.

description: data sitesinin koyu kod zemini icin kullandigi renk degiskenleri.
*/

/* NOTE: web ya da automation sitesi de kod gostermeye baslarsa bu degiskenler
   brand'in tokens.css'ine tasinir, boylece iki site ayni kod gorunusunu
   paylasir. */

/* zemin --ink, ana metin --on-ink, vurgu --gold, bunlar brand'den gelir.
   Buradakiler o zeminde okunan ara tonlar */
:root {
  /* bolme cizgileri: baslik satirinin alti, satir numaralarinin sagi */
  --code-rule: #484b52;
  /* satir numaralari, agac cizgileri ve dugme cercevesi */
  --code-faint: #6b6e76;
  /* baslik satirindaki satir sayisi ve dil gibi bilgiler */
  --code-meta: #a9aab0;
  /* yorumlar ve agactaki aciklamalar */
  --code-comment: #9a9ca3;
  /* docstring'ler */
  --code-doc: #b7c0aa;
  /* metin sabitleri */
  --code-string: #c9d3c0;
  /* agacta paylasilmayan, soluk dosyalar */
  --code-muted: #8f9198;
  /* terminal ciktisinin biraz daha koyu zemini ve metni */
  --code-output: #1f2126;
  --code-output-text: #d9dacf;
}