/* ---------- Renkler ---------- */
:root {
  --zemin: #f7f2ea;
  --kagit: #fffdf8;
  --metin: #2a2420;
  --soluk: #6e6359;
  --cizgi: #e3d9cb;
  --vurgu: #7a2e2e;
  --vurgu-acik: #f1e3dc;
  --serif-baslik: "Cormorant Garamond", Georgia, serif;
  --serif-govde: "Lora", Georgia, serif;
  --genislik: 46rem;
  color-scheme: light;
}

/* Koyu tema: ziyaretçi düğmeyle seçtiyse ya da cihazı koyu temadaysa. */
:root[data-tema="koyu"] {
  --zemin: #1b1816;
  --kagit: #232020;
  --metin: #ece4d8;
  --soluk: #a99d90;
  --cizgi: #3a3431;
  --vurgu: #e39b8a;
  --vurgu-acik: #3a2725;
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) {
    --zemin: #1b1816;
    --kagit: #232020;
    --metin: #ece4d8;
    --soluk: #a99d90;
    --cizgi: #3a3431;
    --vurgu: #e39b8a;
    --vurgu-acik: #3a2725;
    color-scheme: dark;
  }
}

/* ---------- Temel ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: var(--zemin);
  color: var(--metin);
  font-family: var(--serif-govde);
  font-size: 1.0625rem;
  line-height: 1.75;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

main { flex: 1; padding-block: 3rem 4rem; }

.kap {
  width: 100%;
  max-width: var(--genislik);
  margin-inline: auto;
  padding-inline: 1.25rem;
}

h1, h2, h3 {
  font-family: var(--serif-baslik);
  font-weight: 600;
  line-height: 1.15;
  margin: 0 0 .5rem;
  text-wrap: balance;
}

h1 { font-size: clamp(2.2rem, 6vw, 3.2rem); }
h2 { font-size: 1.75rem; }

a { color: var(--vurgu); text-underline-offset: .2em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }

:focus-visible { outline: 2px solid var(--vurgu); outline-offset: 3px; border-radius: 2px; }

time { color: var(--soluk); font-size: .9rem; }

.atla {
  position: absolute; left: -999px; top: .5rem;
  background: var(--kagit); padding: .5rem 1rem; z-index: 10;
}
.atla:focus { left: .5rem; }

.gizli { display: none; }
.not { color: var(--soluk); font-style: italic; }
.bos { color: var(--soluk); font-style: italic; list-style: none; }

.ust-etiket {
  font-family: var(--serif-govde);
  font-size: .78rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--soluk);
  margin: 0 0 .5rem;
}
.ust-etiket a { color: inherit; text-decoration: none; }
.ust-etiket a:hover { color: var(--vurgu); }

.devam { font-size: .95rem; text-decoration: none; }
.devam:hover { text-decoration: underline; }

/* ---------- Üst ve alt bilgi ---------- */
.ust { border-bottom: 1px solid var(--cizgi); }

.ust-ic {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .75rem 2rem;
  padding-block: 1.25rem;
}

.logo { text-decoration: none; color: var(--metin); display: flex; flex-direction: column; }
.logo-ad { font-family: var(--serif-baslik); font-size: 1.6rem; font-weight: 600; line-height: 1.1; }
.logo-alt { font-size: .82rem; color: var(--soluk); font-style: italic; }

.menu { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin: 0; padding: 0; }
.menu a { color: var(--soluk); text-decoration: none; font-size: .98rem; padding-block: .25rem; }
.menu a:hover, .menu a[aria-current="page"] { color: var(--vurgu); }
.menu a[aria-current="page"] { border-bottom: 1px solid currentColor; }

.sag { display: flex; align-items: center; gap: 1.25rem; }

.tema-dugme {
  display: inline-grid; place-items: center;
  width: 2.25rem; height: 2.25rem; padding: 0;
  background: transparent; color: var(--soluk);
  border: 1px solid var(--cizgi); border-radius: 50%; cursor: pointer;
}
.tema-dugme:hover { color: var(--vurgu); border-color: var(--vurgu); }
.tema-dugme svg { width: 1.1rem; height: 1.1rem; }
.tema-dugme .gunes { display: none; }
:root[data-tema="koyu"] .tema-dugme .gunes { display: block; }
:root[data-tema="koyu"] .tema-dugme .ay { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="acik"]) .tema-dugme .gunes { display: block; }
  :root:not([data-tema="acik"]) .tema-dugme .ay { display: none; }
}

.alt { border-top: 1px solid var(--cizgi); font-size: .9rem; color: var(--soluk); }
.alt-ic { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .25rem 1.5rem; padding-block: 1.5rem; }
.alt p { margin: 0; }
.alt a { color: var(--soluk); }

/* ---------- Ana sayfa ---------- */
.karsilama { text-align: center; padding-block: 1rem 3rem; }
.karsilama-ust { font-style: italic; color: var(--soluk); margin: 0 0 .25rem; }
.karsilama-metin { max-width: 32rem; margin: .75rem auto 0; color: var(--soluk); }

.one-cikan {
  background: var(--kagit);
  border: 1px solid var(--cizgi);
  border-radius: 6px;
  padding: 2rem clamp(1.25rem, 5vw, 3rem);
  margin-bottom: 3.5rem;
  text-align: center;
}
.one-cikan h2 { font-size: 2rem; }
.one-cikan h2 a { color: var(--metin); text-decoration: none; }
.one-cikan h2 a:hover { color: var(--vurgu); }

.dize { white-space: pre-line; font-style: italic; color: var(--soluk); margin: .75rem 0 1rem; }

.iki-sutun { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 2.5rem; }

.bolum-baslik { font-size: 1.5rem; padding-bottom: .5rem; border-bottom: 1px solid var(--cizgi); }

.kisa-liste { list-style: none; padding: 0; margin: 0 0 1rem; }
.kisa-liste li {
  display: flex; justify-content: space-between; align-items: baseline; gap: 1rem;
  padding-block: .55rem; border-bottom: 1px dotted var(--cizgi);
}
.kisa-liste a { color: var(--metin); text-decoration: none; }
.kisa-liste a:hover { color: var(--vurgu); }
.kisa-liste time { flex-shrink: 0; font-size: .82rem; }

/* ---------- Liste sayfaları ---------- */
.liste-bas { text-align: center; margin-bottom: 2.5rem; }
.liste-bas p { color: var(--soluk); font-style: italic; margin: 0; }

.siir-liste, .yazi-liste { list-style: none; padding: 0; margin: 0; }
.siir-liste li, .yazi-liste li { border-bottom: 1px solid var(--cizgi); }
.siir-liste a, .yazi-liste a {
  display: block; padding: 1.5rem .75rem; color: inherit; text-decoration: none;
  border-radius: 6px; transition: background-color .15s;
}
.siir-liste a:hover, .yazi-liste a:hover { background: var(--kagit); }
.siir-liste a:hover h2, .yazi-liste a:hover h2 { color: var(--vurgu); }
.siir-liste h2, .yazi-liste h2 { margin-bottom: .25rem; }
.siir-liste .dize { margin: .25rem 0 .5rem; }
.yazi-liste p { margin: .25rem 0 0; color: var(--soluk); }

.yakinda {
  border: 1px dashed var(--cizgi);
  border-radius: 6px;
  padding: 1.25rem 1.5rem;
  margin-bottom: 2rem;
}
.yakinda .ust-etiket { color: var(--vurgu); }
.yakinda ul { list-style: none; margin: 0; padding: 0; }
.yakinda li { padding-block: .35rem; }
.yakinda li + li { border-top: 1px dotted var(--cizgi); }
.yakinda-ad { display: block; font-family: var(--serif-baslik); font-size: 1.4rem; font-weight: 600; line-height: 1.25; }
.yakinda-not { display: block; color: var(--soluk); font-size: .92rem; font-style: italic; }

/* ---------- Şiir / yazı sayfası ---------- */
.eser-bas { text-align: center; margin-bottom: 2.5rem; }

.eser-govde > :first-child { margin-top: 0; }

.siir .eser-govde {
  font-size: 1.15rem;
  line-height: 1.9;
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
}
.siir .eser-govde p { margin: 0 0 1.6em; }

.duzyazi .eser-govde p { margin: 0 0 1.25em; }
.duzyazi .eser-govde h2 { font-size: 1.6rem; margin: 2.2em 0 .6em; }

.eser-govde blockquote {
  margin: 1.5em 0; padding: .25em 1.25em;
  border-left: 3px solid var(--vurgu); color: var(--soluk); font-style: italic;
}
.eser-govde img { max-width: 100%; height: auto; border-radius: 4px; }

.imza { text-align: center; font-style: italic; color: var(--soluk); margin-top: 2.5rem; }

.komsu {
  display: flex; justify-content: space-between; gap: 1rem;
  margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--cizgi);
}
.komsu a { display: flex; flex-direction: column; text-decoration: none; color: var(--metin); max-width: 48%; }
.komsu a span { font-size: .8rem; color: var(--soluk); }
.komsu a:hover { color: var(--vurgu); }
.komsu .sonraki { text-align: right; margin-left: auto; }

.yorumlar {
  margin-top: 3rem; padding: 1.75rem clamp(1rem, 4vw, 2rem);
  background: var(--kagit); border: 1px solid var(--cizgi); border-radius: 6px;
}
.yorumlar h2 { font-size: 1.6rem; }

/* ---------- Düz sayfalar ve form ---------- */
.sayfa { max-width: 38rem; margin-inline: auto; }
.sayfa h1 { margin-bottom: 1.25rem; }
.sayfa .eser-govde p { margin: 0 0 1.1em; }
.ortala { text-align: center; }
.giris { color: var(--soluk); font-size: 1.1rem; }

.form { display: flex; flex-direction: column; margin-top: 2rem; }
.form label { font-size: .92rem; margin: 1rem 0 .3rem; }
.form input, .form select, .form textarea {
  font: inherit; color: var(--metin);
  background: var(--kagit);
  border: 1px solid var(--cizgi); border-radius: 4px;
  padding: .65rem .8rem; width: 100%;
}
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--vurgu); box-shadow: 0 0 0 3px var(--vurgu-acik); }
.form textarea { resize: vertical; min-height: 9rem; }

.form .onay { display: flex; gap: .65rem; align-items: flex-start; font-size: .88rem; color: var(--soluk); margin-top: 1.25rem; }
.form .onay input { width: auto; margin-top: .35rem; flex-shrink: 0; }

.form button {
  align-self: flex-start; margin-top: 1.5rem;
  font: inherit; font-weight: 500;
  background: var(--vurgu); color: var(--kagit);
  border: 0; border-radius: 4px; padding: .7rem 1.8rem; cursor: pointer;
}
.form button:hover { filter: brightness(1.1); }

@media (max-width: 520px) {
  main { padding-block: 2rem 3rem; }
  .ust-ic { flex-direction: column; align-items: flex-start; }
  .sag { width: 100%; justify-content: space-between; }
  .kisa-liste li { flex-direction: column; gap: 0; }
}