/* ============================================================================
   Temel katman (W-03): sıfırlama, ızgara/kap, tipografi sınıfları, yardımcılar,
   TEK hareket deseni (scroll-into-view fade).
   Hiçbir çıplak renk yok; ölçüler tokens.css'ten.
   ============================================================================ */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--b6)}
body{
  margin:0;
  background:var(--kagit);
  color:var(--murekkep);
  font-family:var(--aile-govde);
  font-size:var(--t8);
  line-height:var(--t8-s);
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;                 /* yatay kaydırma kapısı; ölçüm 4 genişlikte */
}
h1,h2,h3,h4,h5,h6,p,figure,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
img,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--vurgu);outline-offset:3px;border-radius:var(--y-hap)}
.koyu :focus-visible{outline-color:var(--vurgu-acik)}

/* ---- Kap ve bölüm ritmi --------------------------------------------------- */
.kap{max-width:var(--kap);margin-inline:auto;padding-inline:var(--gutter);width:100%}
.bolum{padding-block:var(--b6)}
.bolum-buyuk{padding-block:var(--b7)}
@media (max-width:991px){ .bolum,.bolum-buyuk{padding-block:calc(var(--b6) - var(--b3))} }
@media (max-width:767px){ .bolum{padding-block:var(--b5)} .bolum-buyuk{padding-block:calc(var(--b6) - var(--b3))} }

.bolum-tint{background:var(--kagit2)}
/* Koyu bölüm: eşleme TOKEN'de, sınıf listesinde DEĞİL — test/siteKontrast.test.ts */
.koyu{background:var(--murekkep);color:var(--kagit);--soluk:var(--koyu-soluk);--metin:var(--kagit);--yt-cizgi:var(--koyu-cizgi)}

/* ---- Tipografi rolleri ---------------------------------------------------- */
.d1,.d2,.d3,.d4{font-family:var(--aile-display);font-weight:400;letter-spacing:normal;text-wrap:balance}
.d1{font-size:var(--t1);line-height:var(--t1-s)}
.d2{font-size:var(--t2);line-height:var(--t2-s)}
.d3{font-size:var(--t3);line-height:var(--t3-s)}
.d4{font-size:var(--t4);line-height:var(--t4-s)}
.g-iri{font-size:var(--t6);line-height:var(--t6-s)}
.g-alt{font-size:var(--t7);line-height:var(--t7-s)}
.g-kucuk{font-size:var(--t9);line-height:var(--t9-s)}
.soluk{color:var(--soluk)}
.sayi{font-variant-numeric:tabular-nums}

/* Etiket rolü (eyebrow + chip). Referansın kendi ölçüm dosyasında (fonts.json)
   HİÇBİR mono aile geçmiyor — bizdeki JetBrains Mono fazlalıktı ve kaldırıldı.
   Etiket hissi artık gövde ailesinin küçük boyu + AÇILMIŞ harf aralığından
   geliyor (mono doğal olarak daha geniştir; .06 → .09 onu telafi ediyor). */
.mono{
  font-family:var(--aile-govde);font-weight:500;
  font-size:var(--tm);line-height:var(--tm-s);
  text-transform:uppercase;letter-spacing:.09em;
}

/* ---- Yardımcılar ---------------------------------------------------------- */
.gizli-okur{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.atla{position:absolute;left:var(--b2);top:calc(-1 * var(--b7));z-index:100;background:var(--kagit);color:var(--murekkep);padding:var(--b2) var(--b3);border-radius:var(--y-hap);box-shadow:var(--golge)}
.atla:focus{top:var(--b2)}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ikon{width:var(--t5);height:var(--t5);flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ikon-k{width:var(--t7);height:var(--t7)}

/* ---- TEK hareket deseni: scroll-into-view fade ---------------------------- */
/* JS `.js` sınıfını <html>'e koyar. JS yoksa hiçbir şey opacity:0'da KALMAZ. */
.js .ac{opacity:0;transform:translateY(var(--b3));transition:opacity var(--sure) var(--egri),transform var(--sure) var(--egri)}
.js .ac.acik{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .ac{opacity:1;transform:none;transition:none}
  /* ⚠️ 29 Eylül: `animation-delay` EZİLMİYORDU ve ölçüldü — `.yor-u4` (5,4s) ile `.yor-u5`
     (7,2s) az-hareket kipinde HÂLÂ ilerliyor sayılıyordu, çünkü süre ~0 olsa da eleman
     GECİKME fazında bekliyor: o saniyeler boyunca taban karede (görünmez) kalıyor.
     README bu satırda *"çalışan 0, ilerleyen 0"* diyordu, yani beyan BAYATTI.
     `animation-delay:0s` eklendi: her animasyon anında GÖRÜNÜR son karesine oturuyor. */
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important}
}