﻿/* Fontlar Base.astro içinde sürüm damgalı <link> ile yüklenir. */

:root {
  --kagit: #e9e5dd;
  --kagit-koyu: #ded8cd;
  --kagit-acik: #f2eee6;
  --kagit-sicak: #fff6e2;
  --murekkep: #1e1830;
  --mor: #4a2d7a;
  --mor-koyu: #2e1b52;
  --kirmizi: #b3261e;
  --kirmizi-parlak: #d4382b;
  --sari: #f1d64b;
  --gri: #5d5668;
  --cizgi: #1e1830;
  --cizgi-acik: #b9b1a4;
  --display: "Bricolage Grotesque", "Arial Narrow", sans-serif;
  --ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --serif: var(--ui);
  --mono: var(--ui);
  --olcu: 1200px;
  --gecis-hizli: 160ms;
  --gecis-orta: 280ms;
  --gecis-uzun: 520ms;
  --egri: cubic-bezier(0.2, 0.8, 0.2, 1);
  --egri-cikis: cubic-bezier(0.4, 0, 1, 1);
}

* { box-sizing: border-box; }

[hidden] { display: none !important; }

html {
  scroll-behavior: smooth;
  scrollbar-color: var(--kirmizi) var(--kagit-koyu);
  scrollbar-width: thin;
}

::selection { background: var(--sari); color: var(--murekkep); }

::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-track { background: var(--kagit-koyu); }
::-webkit-scrollbar-thumb {
  background: var(--kirmizi);
  border: 3px solid var(--kagit-koyu);
}

body {
  margin: 0;
  background: var(--kagit);
  color: var(--murekkep);
  font-family: var(--serif);
  font-size: 15px;
  line-height: 1.6;
  caret-color: var(--kirmizi);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Sayfanın en üstündeki ince kırmızı şerit (panel ve haber takip ile aynı). */
body::before {
  content: "";
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  background: var(--kirmizi);
  transform-origin: left center;
  z-index: 100;
}

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

a { color: inherit; }

img { display: block; max-width: 100%; }

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

.atla {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 50;
  padding: 10px 14px;
  background: var(--murekkep);
  color: var(--kagit);
  font-family: var(--mono);
  font-size: 12px;
  text-decoration: none;
  transform: translateY(-160%);
  transition: transform 0.15s ease;
}

.atla:focus { transform: none; }

/* ---------- Okuma ilerlemesi ---------- */

.ilerleme {
  position: fixed;
  inset: 3px 0 auto 0;
  z-index: 60;
  height: 2px;
  opacity: 0;
  transition: opacity 0.2s ease;
  pointer-events: none;
}

.ilerleme.gorunur { opacity: 1; }

.ilerleme-cubuk {
  display: block;
  height: 100%;
  background: var(--kirmizi);
  transform: scaleX(0);
  transform-origin: 0 50%;
}

.ilerleme-uc {
  position: absolute;
  top: 50%;
  left: calc(var(--oran, 0) * 100%);
  width: 6px;
  height: 6px;
  margin: -3px 0 0 -3px;
  background: var(--kirmizi);
  opacity: 0;
  transition: opacity var(--gecis-hizli) ease;
  pointer-events: none;
}

.ilerleme.gorunur .ilerleme-uc { opacity: 1; }

.sayfa {
  position: relative;
  width: min(var(--olcu), calc(100% - 64px));
  margin: 0 auto;
  padding: 11px 0 42px;
}

.krop {
  position: absolute;
  width: 22px;
  height: 22px;
  border-color: var(--cizgi);
  border-style: solid;
  pointer-events: none;
}

.krop-sol-ust { top: 0; left: 0; border-width: 1px 0 0 1px; }
.krop-sag-ust { top: 0; right: 0; border-width: 1px 1px 0 0; }
.krop-sol-alt { bottom: 0; left: 0; border-width: 0 0 1px 1px; }
.krop-sag-alt { bottom: 0; right: 0; border-width: 0 1px 1px 0; }

/* ---------- Masthead ---------- */

.ust { padding-top: 10px; }

.masthead {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px 30px;
  padding: 24px 0 14px;
  border-bottom: 1px solid var(--cizgi);
}

.yayinci {
  margin: 0;
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--murekkep);
}

.marka-yazi {
  margin: 0;
  font-family: "Now", var(--display);
  font-size: clamp(4rem, 13vw, 9.5rem);
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: -0.02em;
  text-transform: lowercase;
}

.satir { display: block; }

.marka-yazi.marka-tek {
  display: inline-flex;
  align-items: baseline;
  gap: 0.06em;
}

/* Kırmızı çizgi yalnızca kelime markasının altında kalır. */
.marka-tek .satir {
  position: relative;
  padding-bottom: 0.03em;
}

.satir-ic {
  position: relative;
  display: inline-block;
}

/* Baskı hatası: hover'da 2px kaymış kırmızı kopya. */
.satir-ic::after {
  content: attr(data-kelime) / "";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--kirmizi);
  opacity: 0;
  transform: translate(3px, -2px);
  pointer-events: none;
  transition:
    opacity 120ms ease,
    transform 120ms ease;
}

.marka-tek:hover .satir-ic::after {
  opacity: 0.45;
  transform: translate(2px, -1px);
}

.marka-tek .satir::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 4px;
  background: var(--kirmizi);
  transform-origin: left center;
}

/* Paneldeki "PANEL" etiketinin karşılığı. */
.marka-etiket {
  font-family: var(--ui);
  font-size: clamp(17px, 1.7vw, 26px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--kirmizi);
  transform: translateY(-0.12em);
}

.marka-yan {
  padding-bottom: 8px;
  text-align: right;
}

/* Alt sayfalarda kompakt masthead */
.ust-kompakt { padding-top: 8px; }

.ust-kompakt .masthead {
  padding: 14px 0 12px;
}

.ust-kompakt .marka-yazi {
  font-size: clamp(2.6rem, 7vw, 4.4rem);
}

.ust-kompakt .marka-tek .satir::after { height: 2px; }

.menu-sinir { height: 0; }

/* Yapışkan menü, bölüm başlıklarını örtmesin. */
main section[id],
footer[id] { scroll-margin-top: 78px; }

.menu {
  position: sticky;
  top: 0;
  z-index: 40;
  border-top: 1px solid var(--cizgi);
  border-bottom: 2px solid var(--cizgi);
  background: var(--kagit);
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.menu-ic {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 24px;
  padding: 12px 0 0;
}

.menu-cizgi {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 1px;
  height: 2px;
  background: var(--kirmizi);
  transform: translateX(var(--x, 0px)) scaleX(var(--g, 0));
  transform-origin: left center;
  pointer-events: none;
}

.menu[data-hazir="evet"] .menu-cizgi {
  transition:
    transform var(--gecis-orta) var(--egri),
    opacity var(--gecis-hizli) ease;
}

html:not(.js) .menu-cizgi { display: none; }

.menu.yapisik {
  background: var(--kagit-acik);
  border-bottom-color: var(--kirmizi);
}

.menu a {
  padding: 0 0 10px;
  border-bottom: 2px solid transparent;
  font: 700 14px/1 var(--display);
  letter-spacing: -0.01em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--gri);
  transition: color 0.15s ease, border-color 0.15s ease;
}

.menu a:hover,
.menu a:focus-visible {
  color: var(--murekkep);
  border-color: var(--kirmizi);
}

.menu a[aria-current="page"] {
  border-color: var(--kirmizi);
  color: var(--kirmizi);
}

/* JS varsa alt çizgiyi tek bir kayan çubuk çizer. */
html.js .menu a[aria-current="page"] { border-color: transparent; }

html.js .menu[data-cizgi="yok"] a[aria-current="page"] { border-color: var(--kirmizi); }

/* ---------- Düğmeler ---------- */

.dugme {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 10px;
  padding: 12px 16px;
  border: 1px solid var(--cizgi);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.dugme-dolu {
  border-color: var(--murekkep);
  background: var(--murekkep);
  color: var(--kagit);
}

.dugme-dolu:hover,
.dugme-dolu:focus-visible {
  border-color: var(--kirmizi);
  background: var(--kirmizi);
}

.dugme:active { transform: translateY(2px); }

.dugme-cizgi {
  background: transparent;
  color: var(--murekkep);
}

.dugme-cizgi:hover,
.dugme-cizgi:focus-visible {
  border-color: var(--kirmizi);
  color: var(--kirmizi);
}

.ok {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  transition: transform 0.15s ease;
}

.dugme:hover .ok,
.metin-link:hover .ok { transform: translateX(3px); }

.metin-link {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  gap: 5px;
  padding: 6px 0 4px;
  border-bottom: 1px solid currentColor;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-decoration: none;
  text-transform: uppercase;
}

/* ---------- İçindekiler ---------- */

.yazilar {
  padding: 32px 0 36px;
  border-bottom: 1px solid var(--cizgi);
}

.bolum-bos {
  max-width: 62ch;
  margin: 12px 0 0;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 12px;
  line-height: 1.55;
  letter-spacing: 0.02em;
}

/* Sekmeler arasında başlık hep aynı yerde dursun: beş bölümün de üst
   boşluğu eşit. */
main > section[data-bolum] { padding-top: 38px; }

.bolum-ust {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 18px;
  padding-bottom: 11px;
}

.bolum-ust::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--cizgi-acik);
  transform-origin: left center;
}

.bolum-ust h2 {
  margin: 0;
  font: 700 2rem/1 var(--display);
  letter-spacing: -0.03em;
}

.bolum-giris {
  max-width: 62ch;
  margin: -6px 0 18px;
  color: var(--gri);
  font-size: 14px;
  line-height: 1.55;
}

.bolum-alt {
  margin: 18px 0 0;
}

/* ---------- Ankara ---------- */

.ankara {
  padding: 38px 0 40px;
  border-bottom: 1px solid var(--cizgi);
}

.duraklar {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 2px solid var(--kirmizi);
}

.duraklar article {
  position: relative;
  padding: 22px 22px 0 0;
  border-right: 1px solid var(--cizgi-acik);
}

.duraklar article:last-child { border-right: 0; }

.duraklar article + article { padding-left: 22px; }

.duraklar article::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 0;
  width: 9px;
  height: 9px;
  border: 2px solid var(--kirmizi);
  border-radius: 50%;
  background: var(--kagit);
}

.duraklar article + article::before { left: 22px; }

.durak {
  margin: 0 0 8px;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.duraklar h3 {
  margin: 0 0 8px;
  font-family: var(--display);
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.01em;
}

.duraklar p:last-child {
  max-width: 32ch;
  margin: 0;
  color: #3b3447;
  font-size: 14px;
  line-height: 1.5;
}

/* ---------- Hareket · ilk sayı ---------- */

.hareket {
  padding: 38px 0;
  border-bottom: 1px solid var(--cizgi);
}

.ilk-sayi {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 28px;
  padding: 24px;
  border: 2px solid var(--kirmizi);
  background: var(--kagit-acik);
}

.ilk-sayi-etiket {
  margin: 0 0 10px;
  color: var(--kirmizi);
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ilk-sayi-giris {
  max-width: 58ch;
  margin: 0 0 18px;
  font-size: 1rem;
  line-height: 1.6;
}

.ilk-sayi-alt-baslik {
  margin: 0 0 8px;
  font-family: var(--display);
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.01em;
}

.ilk-sayi-liste {
  max-width: 58ch;
  margin: 0;
  padding-left: 18px;
  font-size: 14px;
  line-height: 1.55;
}

.ilk-sayi-liste li { margin: 0 0 6px; }
.ilk-sayi-liste strong { font-weight: 700; }

.ilk-sayi-not {
  max-width: 58ch;
  margin: 16px 0 0;
  color: var(--gri);
  font-size: 13px;
  line-height: 1.55;
}

.ilk-sayi-kunye {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  padding-left: 20px;
  border-left: 1px solid var(--cizgi-acik);
}

.ilk-sayi-kunye img {
  width: 64px;
  height: 64px;
  padding: 4px;
  object-fit: contain;
  border: 1px solid var(--cizgi-acik);
  background: #fff;
  filter: grayscale(1) contrast(1.1);
  mix-blend-mode: multiply;
  transform: rotate(-2deg);
}

.ilk-sayi-kunye-baslik {
  margin: 4px 0 0;
  font-family: var(--display);
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.01em;
}

.ilk-sayi-kunye-meta,
.ilk-sayi-kunye-yayinci {
  margin: 0;
  color: var(--gri);
  font-size: 12px;
  line-height: 1.45;
}

.ilk-sayi-kunye-yayinci { color: var(--murekkep); }

/* Calameo yer tutucusu */
.calameo { margin-top: 20px; }

.calameo-cerceve {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  max-width: 760px;
  min-height: 380px;
  aspect-ratio: 4 / 3;
  margin: 0 auto;
  padding: 24px;
  overflow: hidden;
  border: 1px dashed var(--cizgi-acik);
  background: var(--kagit-acik);
  text-align: center;
}

.calameo-tarama {
  position: absolute;
  inset: 0;
  border-top: 2px solid var(--kirmizi);
  opacity: 0;
  pointer-events: none;
}

html.js .calameo.belirdi .calameo-tarama {
  animation: tarama 1000ms var(--egri) 200ms both;
}

html.giris .calameo.belirdi .calameo-tarama {
  animation-delay: 720ms;
}

@keyframes tarama {
  0% { opacity: 0; transform: translateY(0); }
  10% { opacity: 1; }
  80% { opacity: 1; }
  100% { opacity: 0; transform: translateY(100%); }
}

.calameo-etiket {
  margin: 0;
  color: var(--kirmizi);
  font-family: var(--ui);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.calameo-baslik {
  margin: 0;
  font-family: var(--display);
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.01em;
}

.calameo-not {
  max-width: 42ch;
  margin: 0;
  color: var(--gri);
  font-size: 13px;
  line-height: 1.5;
}

/* ---------- İletişim ---------- */

.iletisim-bolum {
  padding: 36px 0 8px;
  border-bottom: 1px solid var(--cizgi);
}

.iletisim-bolum .kunye-izgara {
  margin-top: 18px;
  padding-top: 0;
  border-top: 0;
}

.kunye-kisa {
  margin: 10px 0 0;
  color: var(--gri);
  font-family: var(--ui);
  font-size: 11px;
  letter-spacing: 0.04em;
}

.kunye-kisa a {
  color: var(--kirmizi);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ---------- Künye ---------- */

.kunye {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 3px solid var(--murekkep);
}

.kunye-ust {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

.kunye-marka {
  margin: 0 0 4px;
  font-family: var(--display);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

.kunye-ust p:last-child {
  margin: 0;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 12px;
  letter-spacing: 0.03em;
}

.kunye-ust img {
  width: 56px;
  height: 56px;
  padding: 4px;
  object-fit: contain;
  border: 1px solid var(--cizgi-acik);
  background: #fff;
  filter: grayscale(1) contrast(1.1);
  mix-blend-mode: multiply;
  transform: rotate(2deg);
}

.kunye-izgara {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid var(--cizgi-acik);
}

.kunye-izgara h2 {
  margin: 0 0 6px;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kunye-izgara p {
  margin: 0 0 4px;
  color: #3b3447;
  font-size: 12.5px;
  line-height: 1.45;
}

.kunye-izgara a {
  color: var(--kirmizi);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.baglanti-pasif { color: var(--gri); }

.kunye-not {
  margin: 24px 0 0;
  padding-top: 10px;
  border-top: 1px solid var(--cizgi-acik);
  color: var(--gri);
  font-family: var(--mono);
  font-size: 10px;
  line-height: 1.55;
  letter-spacing: 0.02em;
}

/* ---------- DuyarlÄ± ---------- */

@media (max-width: 900px) {
  .ilk-sayi { grid-template-columns: 1fr; }
  .ilk-sayi-kunye {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    padding-top: 14px;
    padding-left: 0;
    border-top: 1px solid var(--cizgi-acik);
    border-left: 0;
  }
  .kunye-izgara { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
  .sayfa {
    width: calc(100% - 32px);
    padding-top: 16px;
  }

  .krop { display: none; }

  .masthead {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding-top: 18px;
  }

  .marka-yazi { font-size: clamp(3rem, 15vw, 4.6rem); }

  .marka-yazi.marka-tek { font-size: clamp(2.6rem, 13vw, 4rem); }

  .marka-tek .marka-etiket {
    font-size: max(11px, 0.27em);
    letter-spacing: 0.06em;
  }

  .ust-kompakt .marka-yazi.marka-tek { font-size: clamp(2.2rem, 11vw, 3.2rem); }

  .marka-yan {
    padding-bottom: 0;
    text-align: left;
  }

  .menu-ic {
    flex-wrap: wrap;
    gap: 0 12px;
    padding: 0;
  }

  .menu a {
    display: flex;
    align-items: center;
    min-height: 42px;
    padding: 0;
    font-size: 11px;
    white-space: nowrap;
  }

  .bolum-ust {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .ilk-sayi { padding: 18px; }

  .calameo-cerceve {
    aspect-ratio: auto;
    min-height: 220px;
    padding: 18px;
  }

  .duraklar {
    grid-template-columns: 1fr;
    border-top: 0;
    border-left: 2px solid var(--kirmizi);
    margin-left: 6px;
  }

  .duraklar article {
    padding: 18px 0 18px 20px;
    border-right: 0;
    border-top: 1px solid var(--cizgi-acik);
  }

  .duraklar article:first-child { border-top: 0; }

  .duraklar article + article { padding-left: 20px; }

  .duraklar article::before {
    top: 24px;
    left: -6px;
  }

  .duraklar article + article::before { left: -6px; }

  .hareket-kutu { padding: 18px; }

  .hareket-baslik { font-size: 1.7rem; }

  .kunye-ust { align-items: flex-start; }

  .kunye-izgara {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
}

@media print {
  body { background: #fff; }
  .sayfa { width: auto; padding: 0; }
  .krop, .menu, .atla { display: none !important; }
  a { text-decoration: none; }
}

/* ---------- Etkinlik takvimi ---------- */

.etkinlikler {
  padding: 38px 0 40px;
  border-bottom: 1px solid var(--cizgi);
}

.takvim-yerlesim {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 26px;
  align-items: start;
  padding-top: 22px;
  border-top: 2px solid var(--kirmizi);
}

.yan-baslik {
  margin: 0 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--cizgi);
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.yan-liste {
  display: grid;
  gap: 10px;
}

.yan-arsiv {
  margin: 14px 0 0;
  padding-top: 8px;
  border-top: 1px solid var(--cizgi-acik);
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.03em;
}

.yan-arsiv span { color: var(--murekkep); }

/* Takvim ızgarası */

.takvim {
  border: 1.5px solid var(--murekkep);
  background: var(--kagit-acik);
}

.takvim-ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 9px 11px;
  border-bottom: 2px solid var(--kirmizi);
}

.takvim-ay-grup {
  display: flex;
  align-items: center;
  gap: 7px;
}

.takvim-ay {
  min-width: 8.5ch;
  margin: 0;
  font-family: var(--display);
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.015em;
}

.takvim-ok {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid var(--cizgi-acik);
  background: transparent;
  color: var(--murekkep);
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.takvim-ok svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.takvim-ok:hover:not(:disabled) {
  border-color: var(--kirmizi);
  background: var(--kirmizi);
  color: var(--kagit-sicak);
}

.takvim-ok:disabled { opacity: 0.3; cursor: default; }

html:not(.js) .takvim-ok { display: none; }

.takvim-hafta {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border-bottom: 1px solid var(--cizgi-acik);
  background: var(--kagit-koyu);
}

.takvim-hafta span {
  padding: 6px 0;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-align: center;
  text-transform: uppercase;
}

.takvim-izgara {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.takvim-bos,
.takvim-gun {
  min-height: 58px;
  border-right: 1px solid var(--cizgi-acik);
  border-bottom: 1px solid var(--cizgi-acik);
}

.takvim-izgara > *:nth-child(7n) { border-right: 0; }

.takvim-bos { background: var(--kagit-koyu); }

.takvim-gun {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 6px 6px 7px;
  background: var(--kagit-acik);
}

.takvim-gun-no {
  color: var(--murekkep);
  font-family: var(--mono);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.takvim-haftasonu .takvim-gun-no { color: var(--gri); }
.takvim-gecmis .takvim-gun-no { color: var(--gri); }

.takvim-bugun {
  position: relative;
  background: var(--sari);
}

html.js .takvim-bugun { background: transparent; }

html.js .takvim-bugun::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: var(--sari);
  transform: scaleX(1);
  transform-origin: left center;
}

.takvim-bugun::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border: 1px solid var(--murekkep);
  pointer-events: none;
}

.takvim-bugun .takvim-gun-no,
.takvim-bugun .takvim-nokta,
.takvim-bugun .takvim-adet {
  position: relative;
  z-index: 1;
}

.takvim-bugun .takvim-baglanti { z-index: 3; }

.takvim-bugun .takvim-gun-no { color: var(--murekkep); font-weight: 700; }

.takvim-nokta {
  display: block;
  width: 100%;
  height: 5px;
  background: var(--kirmizi);
  transform-origin: left center;
}

.takvim-gecmis .takvim-nokta { background: var(--gri); }

.takvim-adet {
  position: absolute;
  right: 5px;
  bottom: 5px;
  transform-origin: right bottom;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
}

.takvim-baglanti {
  position: absolute;
  inset: 0;
  color: transparent;
  text-decoration: none;
}

.takvim-baglanti:hover { background: rgba(241, 214, 75, 0.35); }

.takvim-gun:hover .takvim-gun-no { color: var(--kirmizi); }

.takvim-baglanti:focus-visible {
  outline: 2px solid var(--kirmizi);
  outline-offset: -3px;
}

.takvim-kisa .takvim-gun { min-height: 48px; }

/* Ay değişiminde panel yönlü gelir; gün çubukları ayrıca basılır. */
html.js .takvim-pane:not([hidden]) {
  animation: takvim-gir 240ms var(--egri) both;
}

html.giris .takvim-pane:not([hidden]) { animation-delay: 560ms; }

.takvim-ay.takvim-ay-yeni { animation: etiket-kay 220ms var(--egri); }

@keyframes takvim-gir {
  from { opacity: 0; transform: translateX(calc(var(--takvim-yon, 1) * 12px)); }
  to { opacity: 1; transform: none; }
}

@keyframes etiket-kay {
  from { opacity: 0.2; transform: translateY(3px); }
  to { opacity: 1; transform: none; }
}

/* Etkinlik kartı */

.etkinlik-izgara {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding-top: 18px;
}

.etkinlik-kart {
  position: relative;
  display: grid;
  grid-template-columns: 144px minmax(0, 1fr);
  border: 1.5px solid var(--cizgi);
  background: var(--kagit-acik);
  scroll-margin-top: 90px;
  transition:
    border-color var(--gecis-hizli) ease,
    transform var(--gecis-orta) var(--egri);
}

.etkinlik-kart:hover,
.etkinlik-kart:focus-within {
  border-color: var(--kirmizi);
  transform: translateY(-2px);
}

.etkinlik-kart::after,
.yazi-kart::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 14px;
  height: 14px;
  border-top: 2px solid var(--kirmizi);
  border-right: 2px solid var(--kirmizi);
  opacity: 0;
  transform: translate(4px, -4px);
  transition:
    opacity var(--gecis-hizli) ease,
    transform var(--gecis-orta) var(--egri);
  pointer-events: none;
}

.etkinlik-kart:hover::after,
.etkinlik-kart:focus-within::after,
.yazi-kart:hover::after,
.yazi-kart:focus-visible::after {
  opacity: 1;
  transform: none;
}

.etkinlik-afis {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-right: 1px solid var(--cizgi);
  background: var(--kagit-koyu);
}

.etkinlik-afis img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.etkinlik-kart:hover .etkinlik-afis img { transform: scale(1.035); }

.etkinlik-afis-bos {
  display: flex;
  align-items: flex-end;
  min-height: 100%;
  padding: 10px;
  background: var(--mor);
  color: var(--kagit-sicak);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.afis-tarih {
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: baseline;
  gap: 4px;
  padding: 5px 8px 6px;
  background: var(--kirmizi);
  color: var(--kagit-sicak);
  font-family: var(--mono);
  line-height: 1;
  transition: transform var(--gecis-orta) var(--egri);
}

.etkinlik-kart:hover .afis-tarih { transform: translateY(-2px); }

.afis-gun {
  font-family: var(--display);
  font-size: 1.7rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
}

.afis-ay {
  font-size: 11px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.afis-yil { font-size: 10px; opacity: 0.8; }

.etkinlik-govde {
  min-width: 0;
  padding: 13px 15px 12px;
}

.etkinlik-ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 7px;
}

.etkinlik-tur {
  padding: 3px 6px;
  background: var(--murekkep);
  color: var(--kagit-sicak);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  transition: background-color var(--gecis-hizli) ease;
}

.etkinlik-kart:hover .etkinlik-tur,
.etkinlik-kart:focus-within .etkinlik-tur {
  background: var(--kirmizi);
}

.etkinlik-durum {
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
}

.etkinlik-durum-gecmis { color: var(--gri); font-weight: 400; }

.etkinlik-govde h3 {
  margin: 0 0 8px;
  font-family: var(--display);
  font-size: 1.22rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -0.01em;
}

.etkinlik-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 3px 9px;
  margin: 0 0 8px;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.02em;
}

.etkinlik-aciklama {
  margin: 0 0 9px;
  color: var(--ink-soft, #3b3447);
  font-size: 14px;
  line-height: 1.5;
}

.etkinlik-etiket {
  margin: 0;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.etkinlik-kart-alt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-top: 10px;
  padding-top: 9px;
  border-top: 1px solid var(--cizgi-acik);
}

/* Bölüm sonundaki "tüm takvim" bağlantısı */
.etkinlik-alt { margin: 18px 0 0; }

.etkinlik-duzenleyen {
  margin: 0;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.03em;
}

.etkinlik-eylem { display: flex; flex-wrap: wrap; gap: 6px; }

.kart-eylem {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--cizgi-acik);
  background: transparent;
  color: var(--murekkep);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.04em;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.kart-eylem svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.4; }

.kart-eylem:hover,
.kart-eylem:focus-visible {
  border-color: var(--kirmizi);
  color: var(--kirmizi);
}

.kart-eylem[data-durum="kopyalandi"] {
  border-color: var(--kirmizi);
  background: var(--kirmizi);
  color: var(--kagit-sicak);
}

.kart-eylem[data-durum="kopyalandi"] .dugme-yazi::after { content: " · tamam"; }

.etkinlik-kart-gecmis { border-color: var(--cizgi-acik); }

.etkinlik-kart-gecmis .etkinlik-afis img { opacity: 0.6; }
.etkinlik-kart-gecmis .etkinlik-afis-bos { background: var(--gri); }
.etkinlik-kart-gecmis .afis-tarih { background: var(--gri); }

/* Kompakt kart (ana sayfa) */

.etkinlik-kart-kisa {
  grid-template-columns: 92px minmax(0, 1fr);
}

.etkinlik-kart-kisa .etkinlik-govde { padding: 10px 12px 10px; }
.etkinlik-kart-kisa .etkinlik-govde h3 { font-size: 1.05rem; margin-bottom: 5px; }
.etkinlik-kart-kisa .etkinlik-meta { margin-bottom: 0; font-size: 11px; }
.etkinlik-kart-kisa .etkinlik-etiket { display: none; }
.etkinlik-kart-kisa .afis-gun { font-size: 1.35rem; }
.etkinlik-kart-kisa .afis-yil { display: none; }
.etkinlik-kart-kisa .etkinlik-ust { margin-bottom: 5px; }

/* Filtre çubuğu */

.etkinlik-arac {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  margin-top: 24px;
  padding: 12px 0;
  border-top: 2px solid var(--cizgi);
  border-bottom: 1px solid var(--cizgi-acik);
}

html:not(.js) .etkinlik-arac { display: none; }

.arac-grup { display: flex; flex-wrap: wrap; gap: 6px; }

.arac-dugme {
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid var(--cizgi);
  background: transparent;
  color: var(--murekkep);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.arac-dugme:hover { border-color: var(--kirmizi); color: var(--kirmizi); }

.arac-dugme[aria-pressed="true"] {
  border-color: var(--murekkep);
  background: var(--murekkep);
  color: var(--kagit-sicak);
}

.arac-dugme-ikincil[aria-pressed="true"] {
  border-color: var(--kirmizi);
  background: var(--kirmizi);
}

.arac-sayi { opacity: 0.7; font-variant-numeric: tabular-nums; }

.arac-sonuc {
  margin: 0 0 0 auto;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.03em;
}

.arac-secili {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 5px 8px;
  background: var(--sari);
  color: var(--murekkep);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.03em;
}

.arac-temizle {
  padding: 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

/* Liste ve gruplar */

.etkinlik-liste { margin-top: 26px; scroll-margin-top: 80px; }
.etkinlik-grup + .etkinlik-grup { margin-top: 36px; }

.grup-baslik {
  position: relative;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 9px;
}

.grup-baslik::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--cizgi);
  transform-origin: left center;
}

.grup-baslik h2 {
  margin: 0;
  font-family: var(--display);
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
}

.grup-baslik span {
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.etkinlik-bos {
  margin: 22px 0 0;
  padding: 20px 16px;
  border: 1px dashed var(--cizgi-acik);
  color: var(--gri);
  font-family: var(--mono);
  font-size: 12px;
  text-align: center;
}

.etkinlik-alt-sayfa { margin: 18px 0 0; }

/* ---------- Yazı okuma sayfası ---------- */

.yazi-sayfa,
.etkinlik-sayfa {
  padding: 38px 0 44px;
}

.yazi-yol {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 0 18px;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.yazi-yol a {
  border-bottom: 1px solid var(--cizgi-acik);
  text-decoration: none;
}

.yazi-yol a:hover,
.yazi-yol a:focus-visible {
  border-color: var(--kirmizi);
  color: var(--kirmizi);
}

.yazi-baslik-buyuk {
  max-width: 18ch;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(2.2rem, 4.6vw, 3.6rem);
  font-weight: 900;
  line-height: 0.94;
  letter-spacing: -0.045em;
}

.yazi-deck {
  max-width: 62ch;
  margin: 18px 0 0;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--gri);
}

.yazi-meta-satir {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin: 16px 0 0;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--cizgi);
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.yazi-meta-satir span + span::before {
  content: "·";
  margin-right: 16px;
  color: var(--cizgi-acik);
}

.yazi-govde {
  max-width: 68ch;
  margin: 26px 0 0;
  font-size: 16.5px;
  line-height: 1.65;
}

.yazi-govde > p,
.yazi-govde > ul,
.yazi-govde > ol,
.yazi-govde > blockquote {
  margin: 0 0 16px;
}

.yazi-govde h2,
.yazi-govde h3 {
  margin: 28px 0 10px;
  font-family: var(--display);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.02em;
}

.yazi-govde h2 { font-size: 1.8rem; }
.yazi-govde h3 { font-size: 1.35rem; }

.yazi-govde blockquote {
  padding: 12px 16px;
  border: 1px solid var(--cizgi-acik);
  border-top: 3px solid var(--kirmizi);
  background: var(--kagit-sicak);
  font-size: 0.98rem;
}

.yazi-govde blockquote p { margin: 0; }

.yazi-govde a {
  color: var(--kirmizi);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.yazi-govde ul,
.yazi-govde ol { padding-left: 22px; }

.yazi-govde li { margin: 4px 0; }

.yazi-govde code {
  padding: 1px 4px;
  background: var(--kagit-koyu);
  font-family: ui-monospace, Consolas, "Courier New", monospace;
  font-size: 0.92em;
}

.yazi-govde hr {
  margin: 24px 0;
  border: 0;
  border-top: 1px solid var(--cizgi-acik);
}

.yazi-alt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  margin-top: 30px;
  padding-top: 14px;
  border-top: 1px solid var(--cizgi);
}

.ornek-not {
  max-width: 68ch;
  margin: 22px 0 0;
  padding-top: 10px;
  border-top: 1px solid var(--cizgi-acik);
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.6;
  letter-spacing: 0.02em;
}

/* ---------- Etkinlik sayfası ---------- */

.etkinlik-sayfa-baslik {
  max-width: 18ch;
  margin: 0;
  font-family: var(--display);
  font-size: clamp(2.2rem, 4.6vw, 3.6rem);
  font-weight: 900;
  line-height: 0.94;
  letter-spacing: -0.045em;
}

.etkinlik-izgara-sayfa { margin-top: 24px; }

.aciklama-izgara { margin-top: 26px; }

.etkinlik-sayfa .bolum-giris { margin-top: 14px; }

/* ---------- Yeni bileşenlerin duyarlı hâlleri ---------- */

@media (max-width: 900px) {
  .etkinlik-izgara { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .etkinlik-kart {
    grid-template-columns: 104px minmax(0, 1fr);
  }

  .etkinlik-kart-kisa {
    grid-template-columns: 82px minmax(0, 1fr);
  }

  .etkinlik-govde { padding: 11px 12px; }

  .etkinlik-govde h3 { font-size: 1.08rem; }

  .afis-gun { font-size: 1.45rem; }

  .etkinlik-kart-alt {
    flex-direction: column;
    align-items: flex-start;
  }

  .etkinlik-eylem { width: 100%; }

  .kart-eylem {
    flex: 1 1 auto;
    justify-content: center;
  }

  .etkinlik-durum { font-size: 11px; }

  .yazi-baslik-buyuk { font-size: clamp(2rem, 9vw, 3rem); }

  .yazi-meta-satir { gap: 5px 10px; }

  .yazi-meta-satir span + span::before { margin-right: 10px; }

  .yazi-govde { margin-top: 22px; }

  .yazi-alt { align-items: flex-start; }

  .etkinlik-sayfa-baslik { font-size: clamp(2rem, 9vw, 3rem); }
}

/* ---------- Yazı kartı (kapak plakalı) ---------- */

.yazi-kart-izgara {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.yazi-kart {
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1.5px solid var(--cizgi);
  background: var(--kagit-acik);
  text-decoration: none;
  color: var(--murekkep);
  transition: border-color 0.18s ease, transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.yazi-kart:hover,
.yazi-kart:focus-visible {
  border-color: var(--kirmizi);
  transform: translateY(-2px);
}

.yazi-kart-gorsel {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-bottom: 1px solid var(--cizgi);
  background: var(--kagit-koyu);
  aspect-ratio: 16 / 9;
}

.yazi-kart-gorsel img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.yazi-kart:hover .yazi-kart-gorsel img { transform: scale(1.04); }

.yazi-kart-govde {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 12px 13px 11px;
}

.yazi-kart-ust {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  margin: 0 0 7px;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.yazi-kart-ust span:last-child { color: var(--gri); letter-spacing: 0.04em; }

.yazi-kart-baslik {
  margin: 0 0 6px;
  font-family: var(--display);
  font-size: 1.16rem;
  font-weight: 600;
  line-height: 1.16;
  letter-spacing: -0.015em;
}

.yazi-kart-ozet {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  color: var(--gri);
  font-size: 13.5px;
  line-height: 1.5;
}

.yazi-kart-alt {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  margin: auto 0 0;
  padding-top: 10px;
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.03em;
}

.yazi-kart-alt .ok { margin-left: auto; color: var(--murekkep); }

.yazi-kart:hover .yazi-kart-alt .ok { color: var(--kirmizi); }

.yazi-kart-genis .yazi-kart-baslik { font-size: 1.4rem; }

/* ---------- Yazı: kapak plakası ve TL;DR ---------- */

.yazi-kapak {
  margin: 22px 0 0;
  border: 1.5px solid var(--cizgi);
  background: var(--kagit-acik);
}

.yazi-kapak img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.yazi-kapak figcaption {
  padding: 7px 10px 8px;
  border-top: 1px solid var(--cizgi);
  color: var(--gri);
  font-family: var(--mono);
  font-size: 11px;
  line-height: 1.45;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.yazi-tldr {
  max-width: 68ch;
  margin: 24px 0 0;
  padding: 14px 16px 15px;
  border: 1.5px solid var(--cizgi);
  border-top: 6px solid var(--kirmizi);
  background: var(--kagit-sicak);
}

.tldr-baslik {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0 0 9px;
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tldr-baslik span:last-child { color: var(--gri); font-weight: 400; }

.tldr-liste {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: tldr;
}

.tldr-liste li {
  position: relative;
  margin: 0 0 7px;
  padding-left: 26px;
  font-size: 15px;
  line-height: 1.5;
}

.tldr-liste li:last-child { margin-bottom: 0; }

.tldr-liste li::before {
  counter-increment: tldr;
  content: counter(tldr, decimal-leading-zero);
  position: absolute;
  top: 3px;
  left: 0;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

/* ---------- Yazı: pull quote ---------- */

.yazi-pull {
  position: relative;
  max-width: 68ch;
  margin: 30px 0 0;
  padding: 22px 0 20px;
  border: 0;
}

.yazi-pull::before,
.yazi-pull::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--murekkep);
  transform-origin: left center;
}

.yazi-pull::before { top: 0; }
.yazi-pull::after { bottom: 0; }

.yazi-pull p {
  margin: 0;
  font-family: var(--display);
  font-size: clamp(1.35rem, 2.6vw, 1.85rem);
  font-weight: 600;
  line-height: 1.16;
  letter-spacing: -0.02em;
  text-wrap: balance;
}

.yazi-pull p::before { content: "“"; color: var(--kirmizi); }
.yazi-pull p::after { content: "”"; color: var(--kirmizi); }

/* ---------- Yazı: paylaşım ---------- */

.yazi-paylas {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 20px;
  max-width: 68ch;
  margin: 26px 0 0;
  padding: 14px 16px;
  border: 1px solid var(--cizgi-acik);
  background: var(--kagit-koyu);
}

.yazi-paylas-metin {
  margin: 0;
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.yazi-paylas-eylem { display: flex; flex-wrap: wrap; gap: 8px; }

.paylas-ikon {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
}

.dugme[data-durum="kopyalandi"] { background: var(--kirmizi); border-color: var(--kirmizi); color: var(--kagit-sicak); }
.dugme[data-durum="kopyalandi"]::after { content: " · tamam"; }

/* ---------- Yazı: önceki / sıradaki ---------- */

.yazi-gecis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 34px 0 0;
  padding-top: 18px;
  border-top: 2px solid var(--cizgi);
}

.yazi-gecis-kutu { min-width: 0; }

.yazi-gecis-etiket {
  margin: 0 0 8px;
  color: var(--kirmizi);
  font-family: var(--mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.yazi-gecis .yazi-kart { height: 100%; flex-direction: row; }

.yazi-gecis .yazi-kart-gorsel {
  flex: 0 0 190px;
  width: 190px;
  aspect-ratio: auto;
  border-right: 1px solid var(--cizgi);
  border-bottom: 0;
}

.yazi-gecis .yazi-kart-baslik { font-size: 1.05rem; }

@media (max-width: 640px) {
  .yazi-gecis .yazi-kart { flex-direction: column; }

  .yazi-gecis .yazi-kart-gorsel {
    flex: 0 0 auto;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-right: 0;
    border-bottom: 1px solid var(--cizgi);
  }
}

/* ---------- Etkinlik sayfası başlığı ---------- */

.etkinlik-baslik-blok { max-width: 70ch; }

.etkinlik-sayfa-deck {
  margin: 12px 0 0;
  max-width: 56ch;
  font-size: 1rem;
  line-height: 1.55;
  color: var(--gri);
}

.takvim-tam { margin-top: 22px; }

.takvim-tam .takvim-gun { min-height: 74px; }

/* ---------- Belirme (scroll reveal) ---------- */

html.js [data-belir]:not([data-belir-grup]) {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity var(--gecis-orta) ease,
    transform var(--gecis-uzun) var(--egri);
}

html.js [data-belir]:not([data-belir-grup]).belirdi {
  opacity: 1;
  transform: none;
}

/* Gruplarda blok değil, kart kart açılır. */
html.js [data-belir-grup]:not(.belirdi) > * {
  opacity: 0;
}

html.js [data-belir-grup].belirdi > * {
  opacity: 1;
  transform: none;
  animation: kart-gel 420ms var(--egri) backwards;
  animation-delay: calc(var(--sira, 0) * 45ms);
}

@keyframes kart-gel {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

/* Kart içindeki plaka, kartla birlikte basılır. */
html.js [data-belir-grup].belirdi .yazi-kart-gorsel img,
html.js [data-belir-grup].belirdi .etkinlik-afis img {
  animation: plaka-bas 560ms var(--egri) backwards;
  animation-delay: calc(var(--sira, 0) * 45ms);
}

html.js .yazi-kapak.belirdi img {
  animation: plaka-bas 620ms var(--egri) 80ms backwards;
}

/* Sayı künyesi damga gibi oturur. */
html.js .ilk-sayi.belirdi .ilk-sayi-kunye {
  animation: kunye-damga 420ms var(--egri) 220ms backwards;
}

html.giris .ilk-sayi.belirdi .ilk-sayi-kunye {
  animation-delay: 740ms;
}

@keyframes kunye-damga {
  from { opacity: 0; transform: scale(1.035) rotate(0.6deg); }
  to { opacity: 1; transform: none; }
}

html.giris [data-belir-grup].belirdi .yazi-kart-gorsel img,
html.giris [data-belir-grup].belirdi .etkinlik-afis img {
  animation-delay: calc(560ms + var(--sira, 0) * 40ms);
}

html.giris .yazi-kapak.belirdi img {
  animation-delay: 620ms;
}

@keyframes plaka-bas {
  from {
    opacity: 0.55;
    transform: scale(1.06);
    clip-path: inset(0 0 100% 0);
  }
  to {
    opacity: 1;
    transform: scale(1);
    clip-path: inset(0);
  }
}

/* ---------- Açılış sekansı ---------- */

html.giris body::before {
  animation: serit-ciz 420ms var(--egri) both;
}

html.giris .krop {
  animation: krop-gel 380ms var(--egri) both;
}

html.giris .krop-sol-ust { --kx: 5px; --ky: 5px; animation-delay: 60ms; }
html.giris .krop-sag-ust { --kx: -5px; --ky: 5px; animation-delay: 100ms; }
html.giris .krop-sol-alt { --kx: 5px; --ky: -5px; animation-delay: 140ms; }
html.giris .krop-sag-alt { --kx: -5px; --ky: -5px; animation-delay: 180ms; }

html.giris .satir-ic {
  animation: marka-yukari 560ms var(--egri) 60ms both;
}

html.giris .marka-tek .satir::after {
  animation: cizgi-yatay 340ms var(--egri) 300ms both;
}

html.giris .marka-etiket {
  animation: etiket-gel 260ms var(--egri) 380ms both;
}

html.giris .marka-yan {
  animation: soluk-gel 300ms ease 440ms both;
}

html.giris .menu-ic a {
  animation: sekme-gel 220ms var(--egri) both;
  animation-delay: calc(460ms + var(--sira, 0) * 30ms);
}

html.giris .menu-cizgi {
  animation: cizgi-soluk 220ms ease 640ms both;
}

/* Menü sarınca çubuk kapalı kalır; sekme kendi alt çizgisine döner. */
html.giris .menu[data-cizgi="yok"] .menu-cizgi {
  animation: none;
  opacity: 0;
}

/* Görünen bölümün içeriği masthead'den sonra gelir. */
html.giris main [data-belir]:not([data-belir-grup]) {
  transition-delay: 520ms;
}

html.giris main [data-belir-grup].belirdi > * {
  animation-delay: calc(560ms + var(--sira, 0) * 40ms);
}

html.giris main > section:not([hidden]) .bolum-ust::after {
  animation-delay: 480ms;
}

@keyframes serit-ciz {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes krop-gel {
  from { opacity: 0; transform: translate(var(--kx, 0px), var(--ky, 0px)); }
  to { opacity: 1; transform: translate(0, 0); }
}

@keyframes marka-yukari {
  from {
    opacity: 0;
    transform: translateY(0.38em);
    clip-path: inset(0 0 100% 0);
  }
  60% { opacity: 1; }
  to {
    opacity: 1;
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
  }
}

@keyframes etiket-gel {
  from { opacity: 0; transform: translate(-6px, -0.12em); }
  to { opacity: 1; transform: translate(0, -0.12em); }
}

@keyframes soluk-gel {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: none; }
}

@keyframes sekme-gel {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}

@keyframes cizgi-soluk {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ---------- Çizgi çizme ---------- */

html.js main > section:not([hidden]) .bolum-ust::after,
html.js .etkinlik-grup:not([hidden]) .grup-baslik::after {
  animation: cizgi-yatay 420ms var(--egri) both;
}

@keyframes cizgi-yatay {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

/* ---------- Takvim ---------- */

html.js [data-belir].belirdi .takvim-pane:not([hidden]) .takvim-dolu .takvim-nokta {
  animation: nokta-bas 320ms var(--egri) both;
  animation-delay: calc(var(--gun, 1) * 6ms);
}

html.js [data-belir].belirdi .takvim-pane:not([hidden]) .takvim-bugun::before {
  animation: bugun-boya 420ms var(--egri) both;
  animation-delay: 80ms;
}

html.js [data-belir].belirdi .takvim-pane:not([hidden]) .takvim-adet {
  animation: damga 260ms var(--egri) both;
  animation-delay: calc(180ms + var(--gun, 1) * 6ms);
}

html.giris [data-belir].belirdi .takvim-pane:not([hidden]) .takvim-dolu .takvim-nokta {
  animation-delay: calc(700ms + var(--gun, 1) * 6ms);
}

html.giris [data-belir].belirdi .takvim-pane:not([hidden]) .takvim-bugun::before {
  animation-delay: 700ms;
}

html.giris [data-belir].belirdi .takvim-pane:not([hidden]) .takvim-adet {
  animation-delay: calc(840ms + var(--gun, 1) * 6ms);
}

@keyframes nokta-bas {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes bugun-boya {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes damga {
  from { opacity: 0; transform: scale(1.45); }
  to { opacity: 1; transform: scale(1); }
}

/* ---------- Okuma sayfası ---------- */

html.js .yazi-tldr.belirdi .tldr-liste li {
  animation: madde-gel 360ms var(--egri) both;
  animation-delay: calc(var(--sira, 0) * 45ms);
}

html.giris .yazi-tldr.belirdi .tldr-liste li {
  animation-delay: calc(620ms + var(--sira, 0) * 45ms);
}

html.js .yazi-pull.belirdi::before,
html.js .yazi-pull.belirdi::after {
  animation: cizgi-yatay 420ms var(--egri) both;
}

html.js .yazi-pull.belirdi p::before,
html.js .yazi-pull.belirdi p::after {
  display: inline-block;
  animation: tirnak-gel 280ms var(--egri) both;
}

html.giris .yazi-pull.belirdi::before,
html.giris .yazi-pull.belirdi::after { animation-delay: 680ms; }

html.giris .yazi-pull.belirdi p::before,
html.giris .yazi-pull.belirdi p::after { animation-delay: 740ms; }

@keyframes madde-gel {
  from { opacity: 0; transform: translateX(-6px); }
  to { opacity: 1; transform: none; }
}

@keyframes tirnak-gel {
  from { opacity: 0; transform: scale(0.6) translateY(-2px); }
  to { opacity: 1; transform: none; }
}

/* ---------- Mikro etkileşimler ---------- */

.dugme-cizgi { position: relative; }

.dugme-cizgi::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: var(--kirmizi);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--gecis-orta) var(--egri);
}

.dugme-cizgi:hover::after,
.dugme-cizgi:focus-visible::after { transform: scaleX(1); }

.metin-link {
  position: relative;
}

.metin-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 3px;
  width: 100%;
  height: 1px;
  background: var(--murekkep);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform var(--gecis-orta) var(--egri);
}

.metin-link:hover::after,
.metin-link:focus-visible::after { transform: scaleX(1); }

.kunye-ust img {
  transition: transform var(--gecis-orta) var(--egri);
}

.kunye-ust img:hover { transform: rotate(-1deg) scale(1.03); }

.ilk-sayi-kunye img {
  transition: transform var(--gecis-orta) var(--egri);
}

.ilk-sayi-kunye img:hover { transform: rotate(0deg) scale(1.03); }

/* ---------- Sayfa geçişleri ---------- */

::view-transition-old(root) {
  animation: vt-cikis 160ms var(--egri-cikis) both;
}

::view-transition-new(root) {
  animation: vt-giris 260ms var(--egri) both;
}

@keyframes vt-cikis {
  to { opacity: 0.35; transform: translateY(-4px); }
}

@keyframes vt-giris {
  from { opacity: 0; transform: translateY(8px); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  html.js [data-belir],
  html.js [data-belir].belirdi,
  html.js [data-belir-grup] > *,
  html.js [data-belir-grup].belirdi > * {
    opacity: 1;
    transform: none;
    transition: none;
    animation: none;
  }

  ::view-transition-old(root),
  ::view-transition-new(root) { animation: none; }

  ::view-transition-group(*),
  ::view-transition-image-pair(*),
  ::view-transition-old(*),
  ::view-transition-new(*) { animation: none !important; }

  .etkinlik-afis img,
  .yazi-kart-gorsel img,
  .yazi-kart { transition: none; }
}

/* ---------- Duyarlı: yeni bileşenler ---------- */

@media (max-width: 1000px) {
  .yazi-kart-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .takvim-yerlesim { grid-template-columns: 1fr; gap: 22px; }
  .takvim-yerlesim-sira { padding-top: 4px; }
  .yazi-gecis { grid-template-columns: 1fr; }
  .takvim-tam .takvim-gun { min-height: 62px; }
}

@media (max-width: 640px) {
  .yazi-kart-izgara { grid-template-columns: 1fr; }
  .yazi-kart-baslik { font-size: 1.1rem; }

  .etkinlik-arac {
    align-items: stretch;
    gap: 8px;
  }

  .arac-grup { width: 100%; }
  .arac-dugme { flex: 1 1 auto; justify-content: center; }
  .arac-sonuc { width: 100%; margin: 0; text-align: left; }

  .takvim-ust { flex-wrap: wrap; gap: 6px; }
  .takvim-bos,
  .takvim-gun { min-height: 46px; }
  .takvim-tam .takvim-gun { min-height: 52px; }
  .takvim-gun { padding: 5px 4px 6px; }
  .takvim-gun-no { font-size: 11px; }
  .takvim-nokta { height: 4px; }
  .takvim-ay { font-size: 0.95rem; }
  .takvim-kisa .takvim-gun { min-height: 40px; }

  .yazi-tldr { padding: 12px 13px 13px; }
  .tldr-liste li { font-size: 14px; }

  .yazi-paylas { align-items: flex-start; flex-direction: column; }
  .yazi-paylas-eylem { width: 100%; }
  .yazi-paylas-eylem .dugme { flex: 1 1 auto; justify-content: center; }
}

@media print {
  .etkinlikler,
  .etkinlik-sayfa,
  .yazi-sayfa { break-inside: avoid; }

  .menu,
  .ilerleme,
  .yazi-paylas,
  .etkinlik-arac,
  .takvim-ok { display: none !important; }

  html.js [data-belir],
  html.js [data-belir-grup] > * {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}

/* Sekmeler panelde olduğu gibi gerekirse alt satıra sarar. */
@media (max-width: 340px) {
  .menu-ic {
    gap: 0 14px;
  }
}

