/* Yasam Gecisleri . SAKIN DENEME
   Duzen: sessiz tipografi acilisi, genis nefes ritmi, tek kolon deneme.
   Kart izgarasi YOK. Bolum hiyerarsisi punto ile degil BOSLUK ile kurulur.
   Bu ag icindeki en az hareketli site; bu bilincli bir karardir.
   Palet: Pantone 15-4020 Cerulean. Aydinlik. Koyu tema yok.

   Yazi tipleri kendi sunucumuzdan verilir. Gizlilik sayfasinda "yazi tipleri
   disaridan cagrilmaz" taahhudu var; harici bir @import o cumleyi yalanlardi. */

@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/assets/fonts/cY9AfjOCX1hbuyalUrK4397yjIJFJpc.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/assets/fonts/cY9AfjOCX1hbuyalUrK439DyjIJFJpeBZQ.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url(/assets/fonts/cY9AfjOCX1hbuyalUrK439HyjIJFJpeBZQ.woff2) format("woff2");
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

:root{
  --font-display:"Newsreader",Georgia,"Times New Roman",serif;
  --font-body:"Newsreader",Georgia,"Times New Roman",serif;

  --brand:#7C9FC4;            /* Pantone 15-4020 Cerulean, yalnizca kural ve zemin */
  --brand-derin:#3D6087;      /* aynı maviden okunabilir bag rengi */
  --arduvaz:#3E4A57;          /* ikincil: acil kurali ve kucuk basliklar */
  --mavi-zemin:#EDF3F9;
  --mavi-kenar:#DCE7F1;

  --bg:#F8FAFC; --kagit:#FFFFFF;
  --ink:#161B21; --ink-2:#46515C; --ink-3:#6F7B87;
  --cizgi:#DFE6EE;
  --link:#3D6087; --focus:#3D6087;

  --wrap:50rem;               /* deneme genisligi, gazete degil */
  --dar:34rem;
  --measure:54ch;             /* dar kolon: okuma yorucu olmasin */

  --nefes:clamp(5.5rem,4rem + 6vw,9.5rem);   /* bolumler arasi genis bosluk */
}

/* --- Govde: uzun satir araligi, acele ettirmeyen olcu --- */
body{
  font-size:clamp(1.04rem,1rem + .22vw,1.14rem);
  line-height:1.8;
  letter-spacing:.002em;
}
p{max-width:var(--measure);margin:0 0 1.6em}
a{color:var(--link)}

/* Hiyerarsi punto ile degil boslukla kurulur: h1 olculu, h2 kucuk. */
h1{font-size:clamp(1.85rem,1.35rem + 1.9vw,2.75rem);font-weight:600;line-height:1.24;
   letter-spacing:-.012em;max-width:22ch;margin:0 0 var(--space-5)}
h2{font-size:1.06rem;font-weight:600;line-height:1.5;letter-spacing:.005em;
   color:var(--arduvaz);max-width:40ch;margin:0 0 var(--space-4)}
h3{font-size:1rem;font-weight:600;letter-spacing:.004em;color:var(--arduvaz);margin:0 0 var(--space-3)}

.lede{font-size:1.12rem;line-height:1.7;color:var(--ink-2);max-width:var(--measure);
      font-style:italic;letter-spacing:0}

/* --- Baslik cubugu: sabit degil, akip gider. Sabit baslik dikkat cagirir. --- */
.chrome{border-bottom:1px solid var(--cizgi);background:var(--bg)}
.chrome .bar{display:flex;align-items:center;gap:var(--space-5);
             padding:var(--space-5) 0;flex-wrap:wrap}
.brand{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;
       color:var(--ink);font-weight:600;font-size:1.02rem;letter-spacing:.004em}
.brand .mark{color:var(--brand);flex:none}
.nav{display:flex;gap:var(--space-5);margin-left:auto;flex-wrap:wrap}
.nav a{color:var(--ink-3);text-decoration:none;font-size:.92rem;letter-spacing:.008em;
       transition:color 240ms ease}
.nav a:hover,.nav a[aria-current="page"]{color:var(--brand-derin)}
.navtoggle{display:none;margin-left:auto;background:none;border:0;color:var(--ink-2);
           padding:var(--space-2);cursor:pointer;line-height:0}

.crumbs{padding:var(--space-6) 0 0;font-size:.85rem;color:var(--ink-3);letter-spacing:.01em}
.crumbs a{color:var(--ink-3)}

/* --- Acilis: tek cumle, ekranin buyuk bolumu bos, sola yasli --- */
.acilis{padding:clamp(5rem,3rem + 8vw,10.5rem) 0 var(--nefes)}
.acilis h1{max-width:19ch;margin-bottom:var(--space-5)}
.acilis .altsatir{font-size:1.02rem;color:var(--ink-3);max-width:64ch;margin:0;
                  letter-spacing:.012em;line-height:1.7}
/* Acilis ile giris cumlesi tek bir kompozisyon olusturur; aralarindaki bosluk
   bolumler arasi nefesten belirgin biçimde kucuktur. */
.acilis .giris{margin:var(--space-8) 0 0}

/* --- Bolum: aralarinda genis nefes, kural cizgisi seyrek --- */
.bolum{padding:0 0 var(--nefes)}
.bolum + .bolum{padding-top:0}
/* Son bolumden sonra alt bilgi zaten kendi boslugunu getirir */
main > .bolum:last-child,main > .prose:last-child{padding-bottom:var(--space-7)}
.bolum-etiket{font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
              color:var(--ink-3);margin:0 0 var(--space-6);font-weight:600}

/* --- Konu dizini: kart YOK. Kitap icindekiler sayfasi gibi ince kural satirlari --- */
.dizin{list-style:none;margin:0;padding:0;border-top:1px solid var(--cizgi)}
.dizin li{border-bottom:1px solid var(--cizgi)}
.dizin a{display:grid;grid-template-columns:15rem 1fr;gap:var(--space-3) var(--space-6);
         align-items:baseline;padding:var(--space-6) 0;text-decoration:none;color:inherit;
         transition:color 260ms ease}
.dizin .ad{font-size:1.18rem;font-weight:600;letter-spacing:-.004em;color:var(--ink)}
.dizin .ne{color:var(--ink-2);font-size:.98rem;line-height:1.65;max-width:44ch;margin:0}
.dizin a:hover .ad,.dizin a:focus-visible .ad{color:var(--brand-derin)}
.dizin a:hover .ne{color:var(--ink-2)}

/* --- Tek gorsel: genis ve sessiz. Sayfada baska fotograf yok. --- */
/* margin kisayolu .wrap'in margin-inline:auto degerini ezerdi, blok ekseni ayri yazilir */
.sessiz-gorsel{margin-block:0 var(--nefes)}
.sessiz-gorsel img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:.5rem}
.sessiz-gorsel figcaption{color:var(--ink-3);margin-top:var(--space-3);font-size:.8rem;
                          letter-spacing:.012em}

/* --- Profesyonel destek yonlendirmesi: yumusak mavi zemin, alarm tonu yok --- */
.destek{background:var(--mavi-zemin);border:1px solid var(--mavi-kenar);
        border-radius:1.15rem;padding:clamp(1.75rem,1.2rem + 1.8vw,2.75rem);
        margin:0 0 var(--space-7);max-width:38rem}
.destek p{color:var(--ink-2);max-width:52ch}
.destek p:last-child{margin-bottom:0}

/* Acil yonlendirme: koyu arduvaz kural yeter, korkutucu kirmizi yok. */
.acil{border-left:2px solid var(--arduvaz);padding-left:var(--space-4);
      margin-top:var(--space-5);color:var(--ink)!important}

/* --- Deneme govdesi: 54ch dar kolon, paragraf aralari genis --- */
.prose{padding:var(--space-8) 0 0}
.prose > h1{margin-bottom:var(--space-6)}
.prose > .lede{margin-bottom:var(--space-8)}
.prose h2{margin-top:var(--nefes);position:relative;padding-top:var(--space-5)}
.prose h2::before{content:"";position:absolute;top:0;left:0;width:2.5rem;height:1px;
                  background:var(--brand)}
.prose p{color:var(--ink-2)}
.prose ul,.prose ol{max-width:var(--measure);color:var(--ink-2);padding-left:1.2rem;
                    margin:0 0 1.6em}
.prose li{margin-bottom:var(--space-3)}

/* Sik sorulanlar: kutu degil, kural satiri */
.qa{max-width:var(--measure);padding:var(--space-5) 0;border-top:1px solid var(--cizgi)}
.qa h3{margin-bottom:var(--space-3)}
.qa p{margin:0;color:var(--ink-2)}

/* Kardes sayfalara koprü: kutu degil, sessiz bir satir */
.callout{max-width:var(--measure);margin:var(--space-8) 0 0;padding-top:var(--space-4);
         border-top:1px solid var(--cizgi);font-size:.94rem;color:var(--ink-3)}
.callout p{margin:0;color:inherit;max-width:none}
.callout a{color:var(--brand-derin);text-decoration:none}
.callout a:hover{text-decoration:underline}

/* --- Alt bilgi: sessiz --- */
footer{border-top:1px solid var(--cizgi);margin-top:var(--space-8);
       padding:var(--space-7) 0 var(--space-8);color:var(--ink-3);font-size:.9rem}
footer p{max-width:62ch;line-height:1.75}
.footlinks{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-5);
           margin-bottom:var(--space-6)}
.footlinks a{color:var(--ink-2);text-decoration:none}
.footlinks a:hover{text-decoration:underline}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
                 overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* --- Tek efekt: cok yumusak opaklik girisi (0.9s). Kaydirma efekti,
       paralaks, manyetik dugme, sayac ve yatay kaydirma bilincli olarak yok. --- */
[data-anim]{opacity:1}
html:not(.no-js) [data-anim]:not(.gorunur){opacity:0}

/* Okuma ilerleme cubugu bu sitede kullanilmaz: dikkat cagiran bir uyarandir. */
.ilerleme{display:none}

@media (prefers-reduced-motion:reduce){
  html:not(.no-js) [data-anim]:not(.gorunur){opacity:1}
}

/* --- Dar ekran --- */
@media (max-width:52rem){
  .dizin a{grid-template-columns:1fr;gap:var(--space-2);padding:var(--space-5) 0}
  .dizin .ne{max-width:none}
}
@media (max-width:46rem){
  .chrome .bar{flex-wrap:wrap;padding:var(--space-4) 0}
  .navtoggle{display:inline-flex}
  .nav{flex-basis:100%;margin-left:0;flex-direction:column;gap:0;overflow:hidden;height:0}
  .nav a{padding:var(--space-3) 0;border-top:1px solid var(--cizgi);font-size:1rem}
  html.no-js .nav{height:auto}
  .acilis{padding-top:clamp(3.5rem,2rem + 8vw,6rem)}
  .destek{padding:var(--space-5);border-radius:.9rem}
  .sessiz-gorsel img{aspect-ratio:4/3}
}
