:root {
  --zemin: #f6f4ef;
  --kart: #ffffff;
  --yazi: #16181d;
  --soluk: #5d6370;
  --cizgi: #e3dfd6;
  --vurgu: #c8102e;
  --futbol: #c8102e;
  --eskisehir: #1f5f8b;
  --koyu: #111317;
  --govde-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --baslik-font: Georgia, "Times New Roman", serif;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --zemin: #121417;
    --kart: #1b1e23;
    --yazi: #ecebe7;
    --soluk: #a2a7b1;
    --cizgi: #2c3037;
    --vurgu: #ef4056;
    --futbol: #ef4056;
    --eskisehir: #5aa3d6;
    --koyu: #0a0b0d;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--zemin);
  color: var(--yazi);
  font: 16px/1.6 var(--govde-font);
}
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
.kap { max-width: 1120px; margin: 0 auto; padding: 0 16px; }

/* Üst kısım */
.ust { background: var(--koyu); color: #fff; border-bottom: 4px solid var(--vurgu); }
.ust-ic { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 18px; padding-bottom: 10px; }
.logo { font: 700 clamp(26px, 5vw, 38px)/1.1 var(--baslik-font); letter-spacing: -0.5px; }
.logo:hover { text-decoration: none; }
.bugun { color: #b9bdc6; font-size: 14px; white-space: nowrap; }
.menu { display: flex; gap: 4px; overflow-x: auto; padding-bottom: 0; }
.menu a { padding: 10px 14px; font-weight: 600; font-size: 15px; color: #d6d9df; border-bottom: 3px solid transparent; margin-bottom: -4px; }
.menu a:hover { color: #fff; text-decoration: none; }
.menu a[aria-current] { color: #fff; border-bottom-color: #fff; }

main { padding-top: 24px; padding-bottom: 48px; }
.bolum-baslik { font: 700 22px/1.2 var(--baslik-font); margin: 36px 0 16px; padding-bottom: 8px; border-bottom: 2px solid var(--yazi); }
h1.bolum-baslik { margin-top: 8px; font-size: 30px; }

/* Kartlar */
.izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 6px; overflow: hidden; display: flex; flex-direction: column; }
.kart-ic { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.kart h3 { font: 700 19px/1.3 var(--baslik-font); margin: 2px 0; }
.kart p { margin: 0; color: var(--soluk); font-size: 15px; }
.kart time { margin-top: auto; padding-top: 6px; font-size: 13px; color: var(--soluk); }
.manset { display: grid; grid-template-columns: 1.3fr 1fr; }
.manset .kart-ic { padding: 24px; justify-content: center; }
.manset h2 { font: 700 clamp(24px, 3.4vw, 34px)/1.2 var(--baslik-font); margin: 4px 0 6px; }
.manset p { font-size: 17px; }
@media (max-width: 760px) { .manset { grid-template-columns: 1fr; } .manset .kart-ic { padding: 16px; } }

/* Kapak görselleri: kaynak sitelerin fotoğrafları kullanılmaz */
.kapak { position: relative; aspect-ratio: 16 / 9; display: flex; align-items: flex-end; padding: 14px; color: #fff; overflow: hidden; }
.kapak span { position: relative; font: 700 13px/1 var(--govde-font); letter-spacing: 1.5px; text-transform: uppercase; background: rgba(0,0,0,.35); padding: 6px 9px; border-radius: 3px; }
.kapak-futbol {
  background:
    radial-gradient(circle at 50% 50%, transparent 17%, rgba(255,255,255,.22) 17.4%, rgba(255,255,255,.22) 18.2%, transparent 18.6%),
    linear-gradient(90deg, transparent 49.6%, rgba(255,255,255,.22) 49.6%, rgba(255,255,255,.22) 50.4%, transparent 50.4%),
    repeating-linear-gradient(90deg, #1d6b3a 0 10%, #1a6034 10% 20%);
}
.kapak-futbol::after { content: ""; position: absolute; inset: 0; background: linear-gradient(160deg, transparent 55%, rgba(200,16,46,.55)); }
.kapak-eskisehir {
  background:
    linear-gradient(0deg, rgba(0,0,0,.35), transparent 45%),
    repeating-linear-gradient(135deg, rgba(255,255,255,.06) 0 14px, transparent 14px 28px),
    linear-gradient(135deg, #1f5f8b, #3b8fb8 55%, #e3a84a);
}
.kapak-gundem {
  background:
    linear-gradient(0deg, rgba(0,0,0,.35), transparent 45%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.07) 0 2px, transparent 2px 22px),
    linear-gradient(135deg, #2b2f36, #4a505a 60%, #c8102e);
}
.kapak-ekonomi {
  background:
    linear-gradient(0deg, rgba(0,0,0,.3), transparent 45%),
    linear-gradient(transparent 96%, rgba(255,255,255,.12) 96%) 0 0 / 100% 25%,
    linear-gradient(90deg, transparent 96%, rgba(255,255,255,.12) 96%) 0 0 / 12.5% 100%,
    linear-gradient(135deg, #0f5132, #198754 60%, #c9a227);
}
.kapak-siyaset {
  background:
    linear-gradient(0deg, rgba(0,0,0,.35), transparent 45%),
    radial-gradient(circle at 80% 20%, rgba(255,255,255,.18), transparent 40%),
    linear-gradient(135deg, #3d2a5c, #6b4a8c 60%, #b0476a);
}
.kapak.buyuk { aspect-ratio: auto; min-height: 260px; }
.haber .kapak.buyuk { aspect-ratio: 21 / 8; min-height: 0; border-radius: 6px; margin: 18px 0 8px; }

.kapak.fotolu { background: #222; }
.kapak.fotolu img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kapak.fotolu::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.45), transparent 40%); }
.kapak.fotolu span { z-index: 1; }
.haber .kapak.fotolu.buyuk { aspect-ratio: 16 / 9; margin-bottom: 4px; }
.foto-alt { margin: 0 0 18px; font-size: 12.5px; color: var(--soluk); }
.foto-alt a { text-decoration: underline; text-underline-offset: 2px; }

/* Etiketler */
.ust-bilgi { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.kat { font-size: 12px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.kat-futbol { color: var(--futbol); }
.kat-eskisehir { color: var(--eskisehir); }
.kat-gundem { color: var(--yazi); }
.kat-ekonomi { color: #198754; }
.kat-siyaset { color: #7a4fa3; }
@media (prefers-color-scheme: dark) { .kat-ekonomi { color: #4cc38a; } .kat-siyaset { color: #b48ad8; } }
.etiket { font-size: 12px; color: var(--soluk); border: 1px solid var(--cizgi); border-radius: 99px; padding: 1px 8px; }
.rozet { font-size: 11px; font-weight: 700; color: #fff; background: #b26b00; border-radius: 3px; padding: 2px 6px; letter-spacing: .5px; }

/* Haber sayfası */
.haber { max-width: 720px; margin: 0 auto; }
.haber h1 { font: 700 clamp(28px, 5vw, 40px)/1.18 var(--baslik-font); margin: 10px 0 12px; letter-spacing: -0.3px; }
.haber .spot { font-size: 19px; line-height: 1.5; color: var(--soluk); margin: 0 0 10px; }
.haber > time { font-size: 14px; color: var(--soluk); }
.govde { font-size: 18px; line-height: 1.75; }
.govde p { margin: 0 0 1.1em; }
.govde h2 { font: 700 23px/1.3 var(--baslik-font); margin: 1.6em 0 .6em; }
.govde blockquote { margin: 1.2em 0; padding: 4px 0 4px 18px; border-left: 4px solid var(--vurgu); font-style: italic; color: var(--soluk); }
.govde ul { padding-left: 1.2em; }
.paylas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 24px; font-size: 14px; }
.paylas span { color: var(--soluk); font-weight: 600; }
.paylas a { padding: 7px 14px; border-radius: 99px; background: var(--kart); border: 1px solid var(--cizgi); font-weight: 600; }
.paylas a:hover { text-decoration: none; border-color: var(--yazi); }
.kaynaklar { margin-top: 28px; padding: 14px 18px; background: var(--kart); border: 1px solid var(--cizgi); border-radius: 6px; font-size: 14px; }
.kaynaklar h2 { font-size: 13px; text-transform: uppercase; letter-spacing: 1px; margin: 0 0 6px; color: var(--soluk); }
.kaynaklar ul { margin: 0; padding-left: 18px; }
.kaynaklar a { text-decoration: underline; text-underline-offset: 3px; }
.ilgili { max-width: 1120px; margin-top: 24px; }
.taslak-uyari { background: #fff3d6; color: #6b4300; border: 1px solid #f0c66b; padding: 10px 14px; border-radius: 6px; font-size: 15px; }
.duz h2 { font: 700 21px/1.3 var(--baslik-font); margin-top: 1.6em; }
.kunye { display: grid; grid-template-columns: max-content 1fr; gap: 8px 20px; }
.kunye dt { font-weight: 700; }
.kunye dd { margin: 0; }
.bos { padding: 40px 0; color: var(--soluk); text-align: center; }

/* Alt kısım */
.alt { background: var(--koyu); color: #b9bdc6; padding: 28px 0; font-size: 14px; }
.alt strong { color: #fff; }
.alt a { color: #fff; }
.alt .kucuk { font-size: 13px; color: #8a909b; }