/* ==================================================================
   poyrazkartal.com
   ================================================================== */

:root{
  --kagit:#E7E8E2;
  --murekkep:#1D2124;
  --ikincil:#39403E;
  --cizgi:#9DA29D;
  --isaret:#6C736F;
  --iz:#1D2124;
  --iz-vurgu:#8E3B32;
  --olcek:clamp(17px, 2.28vmin, 32px);
  --gecis:.9s cubic-bezier(.2,.6,.2,1);
  --sonme:1.6s ease;
  --zemin-h:clamp(64px, 9.5svh, 190px);
  --zemin-bosluk:clamp(6px, 1.6svh, 26px);
}

/* gece — 00.00 ile 04.30 arası */
html[data-vakit="gece"]{
  --kagit:#0D0F11;
  --murekkep:#E2E3DE;
  --ikincil:#B2B8B6;
  --cizgi:#454C4B;
  --isaret:#949B97;
  --iz:#E2E3DE;
  --iz-vurgu:#C05248;
}

*{box-sizing:border-box}
html{font-size:var(--olcek)}
html,body{margin:0;padding:0;background:var(--kagit)}
body{
  min-height:100vh;
  min-height:100svh;
  color:var(--murekkep);
  font-family:"EB Garamond","Newsreader", Charter, Georgia, serif;
  font-size:1rem;
  font-weight:400;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  padding:clamp(8px,2.2svh,40px);
  transition:background var(--gecis), color var(--gecis);
}

/* ---- çerçeve --------------------------------------------------- */
.cerceve{
  position:relative;
  min-height:calc(100vh - clamp(16px,4.4svh,80px));
  min-height:calc(100svh - clamp(16px,4.4svh,80px));
}
body.zeminli .cerceve{
  min-height:calc(100svh - clamp(16px,4.4svh,80px) - var(--zemin-h) - var(--zemin-bosluk));
  border:1px solid var(--cizgi);
  display:flex;flex-direction:column;
  padding:clamp(18px,3.4svh,70px);
  overflow:hidden;
}

/* ---- kapı: sayfa kitabın kapağı ------------------------------- */
body.kapi .cerceve{border-color:rgba(29,33,36,.40)}
body.kapi .cerceve::before{
  content:"";
  position:absolute;inset:0;z-index:0;
  background:url(/varlik/ahsap.webp) center/cover no-repeat, #E7E8E2;
  transition:filter var(--gecis);
}
body.kapi .kose{display:none}

.mentese,.kol{position:absolute;z-index:2}
.mentese{pointer-events:none}
.kol{cursor:pointer;-webkit-tap-highlight-color:transparent}
.kol:focus-visible{outline:2px solid var(--murekkep);outline-offset:6px;border-radius:6px}
.mentese{
  left:.55%;width:clamp(15px,2.4svh,42px);height:clamp(42px,7svh,120px);
  border:1.4px solid rgba(29,33,36,.28);border-radius:4px;
}
.mentese.m1{top:14.5%} .mentese.m2{top:49%} .mentese.m3{top:83.5%}
.kol{
  right:2.4%;top:54%;
  /* en ve boy AYRI AYRI yazılı: 168/282 oranı sayılara işlendi.
     var() ya da calc() kullanılmıyor; biri ayrıştırılamazsa en auto'ya
     düşüyor ve satır içi SVG bütün kapıyı kaplıyordu. */
  height:clamp(86px,14.5svh,250px);
  width:clamp(51px,8.64svh,149px);
}
.kol svg{display:block;width:100%;height:100%}

/* kapı kolu: otuz üçüncü adımdan sonra bir kez iner */
.kol-kolu{
  transform-box:fill-box;
  transform-origin:105.6% 60.6%;
  transition:transform 1.5s cubic-bezier(.33,.9,.3,1);
}
body.kol-indi .kol-kolu{
  transform:rotate(-13deg);
  transition:transform 1.05s cubic-bezier(.5,.02,.25,1.04);
}

/* gece: ahşap, kalem izleri ve kol birlikte tersine döner */
html[data-vakit="gece"] .cerceve::before,
html[data-vakit="gece"] .cevrilir{filter:invert(1) hue-rotate(180deg)}
html[data-vakit="gece"] .cerceve{border-color:rgba(226,227,222,.30)}
html[data-vakit="gece"] .mentese{border-color:rgba(226,227,222,.26)}
.kose{
  position:absolute;width:clamp(20px,3.8vmin,62px);height:clamp(20px,3.8vmin,62px);
  pointer-events:none;z-index:2;
}
.kose.su{top:-1px;left:-1px;border-top:1px solid var(--murekkep);border-left:1px solid var(--murekkep)}
.kose.sa{top:-1px;right:-1px;border-top:1px solid var(--murekkep);border-right:1px solid var(--murekkep)}
.kose.au{bottom:-1px;left:-1px;border-bottom:1px solid var(--murekkep);border-left:1px solid var(--murekkep)}
.kose.aa{bottom:-1px;right:-1px;border-bottom:1px solid var(--murekkep);border-right:1px solid var(--murekkep)}
.kose::after{content:"";position:absolute;width:calc(100% - 6px);height:calc(100% - 6px)}
.kose.su::after{top:5px;left:5px;border-top:1px solid var(--cizgi);border-left:1px solid var(--cizgi)}
.kose.sa::after{top:5px;right:5px;border-top:1px solid var(--cizgi);border-right:1px solid var(--cizgi)}
.kose.au::after{bottom:5px;left:5px;border-bottom:1px solid var(--cizgi);border-left:1px solid var(--cizgi)}
.kose.aa::after{bottom:5px;right:5px;border-bottom:1px solid var(--cizgi);border-right:1px solid var(--cizgi)}

/* ---- ayak izleri: otuz üç adım --------------------------------- */
/* kapının altındaki zemin — otuz üç adım soldan sağa */
.zemin{
  position:relative;
  height:var(--zemin-h);
  margin-top:var(--zemin-bosluk);
}
.iz{position:absolute;inset:0;pointer-events:none}
.iz svg{display:block;width:100%;height:100%}
.iz g{opacity:0}

/* ---- ortak gövde ----------------------------------------------- */
main{
  position:relative;z-index:1;
  flex:1 1 auto;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding-bottom:3vh;
  animation:gir 1.1s cubic-bezier(.2,.6,.2,1) .15s both;
}
main.genis{justify-content:flex-start;padding-top:clamp(18px,4.9vmin,80px)}
main.kapi-yuz{
  justify-content:space-between;
  gap:clamp(14px,3svh,60px);
  padding:clamp(4px,1.4svh,26px) 0 clamp(4px,1svh,20px);
  text-align:center;
}
main.kapi-yuz>*{width:100%}
.imza{
  display:grid;grid-template-columns:1fr auto 1fr;
  align-items:baseline;gap:0 16px;
}
.imza .yazar{grid-column:2;grid-row:1}
.eposta{
  grid-column:3;grid-row:1;justify-self:end;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.9rem;letter-spacing:.02em;color:var(--ikincil);
  text-decoration:none;border-bottom:1px solid var(--cizgi);padding-bottom:2px;
}
.eposta:hover{color:var(--murekkep);border-bottom-color:var(--murekkep)}
.eposta:focus-visible{outline:2px solid var(--murekkep);outline-offset:3px;border-bottom-color:transparent}
@keyframes gir{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

.orta{text-align:center;width:min(100%, clamp(420px,84vmin,1400px))}
.orta>*,main.kapi-yuz>*{transition:opacity var(--sonme)}

.ad{
  display:block;margin:0 auto;
  width:min(70%, clamp(280px,43.6svh,900px));height:auto;
  animation:gir 1.3s cubic-bezier(.2,.6,.2,1) .25s backwards;
}
.cetele{
  display:block;margin:clamp(12px,2.8svh,52px) auto 0;
  width:min(80%, clamp(300px,43svh,950px));height:auto;
  animation:gir 1.5s cubic-bezier(.2,.6,.2,1) .45s backwards;
}
.yazar{
  margin:0;
  font-size:1.0rem;letter-spacing:.3em;text-indent:.3em;
  text-transform:uppercase;color:var(--murekkep);
}
.gizli-baslik{
  position:absolute;width:1px;height:1px;overflow:hidden;
  clip-path:inset(50%);white-space:nowrap;margin:0;
}
h1{
  margin:0;
  font-weight:300;
  font-size:clamp(52px,11.6vmin,190px);
  line-height:.98;
  letter-spacing:.005em;
  font-variant-numeric:lining-nums;
}

.tur{
  margin:1.1em 0 0;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.92rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;
  color:var(--ikincil);text-indent:.18em;
}

hr{
  border:0;border-top:1px solid var(--cizgi);
  width:clamp(84px,9.4vmin,150px);margin:clamp(22px,3.8vmin,62px) auto;
}

/* ---- künye — kitaptaki birim künyesinin aynısı ------------------ */
.kunye{
  margin:0 0 clamp(18px,3svh,54px);
  display:flex;flex-direction:column;gap:.15em;
  font-size:.94rem;line-height:1.7;
  color:var(--ikincil);
  letter-spacing:.05em;
}
body.kapi .kunye{margin:0}
.kunye span:first-child{text-transform:uppercase;letter-spacing:.17em;font-size:.95em}
.kunye b{font-weight:400;font-variant-numeric:lining-nums}

/* ---- işaretler -------------------------------------------------- */
.isaret{
  margin:clamp(10px,2.2svh,44px) auto 0;
  width:min(88%, clamp(280px,48svh,1000px));
  color:var(--isaret);
  transform-origin:center center;
  transition:color var(--sonme), transform 1.8s cubic-bezier(.2,.6,.2,1);
}
.isaret svg{display:block;width:100%;height:auto}
.isaret-ek{display:block;margin-top:clamp(14px,2.5vmin,40px);width:64%;margin-inline:auto}
.isaret-ek svg{display:block;width:100%;height:auto}

/* yirmi saniye hiç kımıldamayan: sayfa çekilir, yalnız işaretler kalır */
body.durgun main>*:not(.orta),
body.durgun .orta>*:not(.isaret),
body.durgun footer{opacity:0;pointer-events:none}
body.durgun .isaret{color:var(--murekkep)}

/* ---- epigraf ve açılış ----------------------------------------- */
.epigraf{
  margin:0 auto;
  max-width:min(100%, clamp(420px,84vmin,1400px));
  font-style:italic;font-weight:400;
  font-size:1.1rem;line-height:1.72;
  color:var(--ikincil);letter-spacing:.01em;
}
.acilis{
  margin:clamp(30px,5.4vmin,88px) 0 0;
  text-align:left;
  font-size:1.02rem;line-height:1.85;
  color:var(--murekkep);
  hanging-punctuation:first;
}

/* ---- 404 -------------------------------------------------------- */
.yok{margin:0;font-size:clamp(30px,5.6vmin,92px);font-weight:400;line-height:1.25}
.yok-alt{margin:clamp(26px,4.5vmin,74px) 0 0;font-size:.95rem;letter-spacing:.05em}
.yok-alt a{color:var(--ikincil);text-decoration:none;border-bottom:1px solid var(--cizgi);padding-bottom:2px}
.yok-alt a:hover{color:var(--murekkep);border-bottom-color:var(--murekkep)}

/* ---- dosya sayfası ---------------------------------------------- */
.dosya{width:min(100%, clamp(420px,80vmin,1320px));text-align:left}
.dosya h1{font-size:clamp(40px,8vmin,132px)}
.dosya .tur{margin-top:.9em}
.dosya hr{margin-left:0}
.ust-etiket{
  margin:0 0 1.4em;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.78rem;font-weight:500;
  letter-spacing:.2em;text-transform:uppercase;
  color:var(--ikincil);
}
.dosya-yazar{margin:.5em 0 0;font-size:1.08rem;color:var(--ikincil)}

.kunye-tablo{margin:0 0 clamp(30px,5.4vmin,88px);display:grid;gap:.1em}
.kunye-tablo>div{display:flex;gap:1.2em;border-bottom:1px solid var(--cizgi);padding:.6em 0}
.kunye-tablo dt{
  flex:0 0 clamp(96px,23%,158px);margin:0;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.8rem;font-weight:500;
  letter-spacing:.13em;text-transform:uppercase;
  color:var(--ikincil);padding-top:.4em;
}
.kunye-tablo dd{margin:0;font-size:1.05rem}

.dosya section{margin:0 0 clamp(30px,5.6vmin,92px)}
.dosya h2{margin:0 0 .8em;font-weight:400;font-size:1.34rem;letter-spacing:.01em}
.dosya .metin{font-size:1.02rem}
.dosya .metin p{
  margin:0 0 1em;
  text-align:justify;
  text-justify:inter-word;
  /* Türkçe uzun kelimeler iki yana yaslanınca satır içinde boşluk nehirleri
     açıyor; heceleme onu kapatıyor. <html lang="tr"> tanımlı olduğu için
     tarayıcı Türkçe heceleme kurallarını kullanır. */
  -webkit-hyphens:auto;
  hyphens:auto;
  hyphenate-limit-chars:7 3 3;
  overflow-wrap:break-word;
}
.dosya .metin p:last-child{margin-bottom:0}
.dosya .metin a{color:var(--murekkep);text-decoration:none;border-bottom:1px solid var(--cizgi);padding-bottom:2px}
.dosya .metin a:hover{border-bottom-color:var(--murekkep)}
.uyari{
  margin:0 0 1.3em;
  font-style:italic;font-size:.96rem;
  color:var(--ikincil);
  border-left:2px solid var(--cizgi);padding-left:.9em;
}
.indirme{margin:0;padding:0;list-style:none;font-size:1.02rem}
.indirme li{padding:.45em 0;border-bottom:1px solid var(--cizgi)}
.indirme li:first-child{border-top:1px solid var(--cizgi)}
.indirme a{color:var(--murekkep);text-decoration:none;border-bottom:1px solid var(--cizgi);padding-bottom:2px}
.indirme a:hover{border-bottom-color:var(--murekkep)}
.dosya-not{margin:1.1em 0 0;font-size:.95rem;color:var(--ikincil)}

/* ---- kapı kolunun sözü ----------------------------------------- */
.soz{
  position:fixed;z-index:20;
  left:50%;top:50%;transform:translate(-50%,-50%) scale(.97);
  width:min(84vw, clamp(340px,52vmin,900px));
  background:var(--kagit);
  border:1px solid var(--cizgi);
  box-shadow:0 2px 4px rgba(21,24,26,.06), 0 24px 60px -24px rgba(21,24,26,.45);
  padding:clamp(26px,4.2vmin,70px) clamp(24px,4.2vmin,70px) clamp(18px,2.7vmin,44px);
  text-align:center;
  opacity:0;pointer-events:none;
  transition:opacity .5s ease, transform .5s cubic-bezier(.2,.6,.2,1);
}
.soz.acik{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1)}
.soz-metin{
  margin:0;font-style:italic;font-size:1.08rem;line-height:1.75;
  color:var(--murekkep);
}
.soz-kapat{
  margin:clamp(18px,2.9vmin,48px) 0 0;
  font:inherit;font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;
  background:none;border:0;border-bottom:1px solid var(--cizgi);
  color:var(--ikincil);padding:0 0 2px;cursor:pointer;
}
.soz-kapat:hover{color:var(--murekkep);border-bottom-color:var(--murekkep)}
.perde{
  position:fixed;inset:0;z-index:19;
  background:rgba(21,24,26,.18);
  opacity:0;pointer-events:none;transition:opacity .5s ease;
}
.perde.acik{opacity:1;pointer-events:auto}
html[data-vakit="gece"] .perde{background:rgba(0,0,0,.45)}

/* ---- alt satır --------------------------------------------------- */
body.kapi footer{justify-content:center;text-align:center;position:relative}

footer{
  position:relative;z-index:1;
  flex:0 0 auto;
  display:flex;justify-content:space-between;align-items:baseline;
  gap:12px 24px;flex-wrap:wrap;
  font-family:ui-sans-serif,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:.95rem;font-weight:400;letter-spacing:.02em;color:var(--ikincil);
  transition:opacity var(--sonme);
}
footer a{color:var(--ikincil);text-decoration:none;border-bottom:1px solid var(--cizgi);padding-bottom:2px}
footer a:hover{color:var(--murekkep);border-bottom-color:var(--murekkep)}
footer a:focus-visible{outline:2px solid var(--murekkep);outline-offset:3px;border-bottom-color:transparent}

@media (max-width:560px){
  .imza{grid-template-columns:1fr;justify-items:center;gap:10px 0}
  .imza .yazar{grid-column:1;grid-row:1}
  .eposta{grid-column:1;grid-row:2;justify-self:center}
}

@media (max-width:420px){
  .cerceve{padding:22px 16px}
  footer{justify-content:center;text-align:center}
  .kunye-tablo>div{flex-direction:column;gap:.15em}
  .kunye-tablo dt{padding-top:0}
}

@media (prefers-reduced-motion:reduce){
  main{animation:none}
  .kol-kolu{transition:none}
  body,.isaret,.orta>*,footer{transition:none}
  .iz{display:none}
}