/* Tribünho, genel site stili. Renkler ve ölçüler tasarım taslağından gelir. */

@font-face { font-family:'Barlow Condensed'; font-weight:500; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/barlow-condensed-500-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD; }
@font-face { font-family:'Barlow Condensed'; font-weight:500; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/barlow-condensed-500-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF; }
@font-face { font-family:'Barlow Condensed'; font-weight:600; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/barlow-condensed-600-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD; }
@font-face { font-family:'Barlow Condensed'; font-weight:600; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/barlow-condensed-600-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF; }
@font-face { font-family:'Barlow Condensed'; font-weight:700; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/barlow-condensed-700-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD; }
@font-face { font-family:'Barlow Condensed'; font-weight:700; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/barlow-condensed-700-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF; }
@font-face { font-family:'Source Sans 3'; font-weight:300 700; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/source-sans-3-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2212,U+FEFF,U+FFFD; }
@font-face { font-family:'Source Sans 3'; font-weight:300 700; font-style:normal; font-display:swap;
  src:url('/genel/yazitipi/source-sans-3-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF; }

:root {
  --lacivert:#0a2949;
  --lacivert-koyu:#071b31;
  --altin:#c99a46;
  --kirmizi:#a5121f;
  --krem:#f6f4ef;
  --kagit:#fff;
  --metin:#1c2732;
  --soluk:#68717b;
  --cizgi:#e6e0d3;
  --cizgi-ince:#eee3c8;
  --yesil:#3ddc84;
  --baslik-yazi:'Barlow Condensed', ui-sans-serif, system-ui, sans-serif;
  --govde-yazi:'Source Sans 3', ui-sans-serif, system-ui, sans-serif;
}

* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
  margin:0; background:var(--krem); color:var(--metin);
  font-family:var(--govde-yazi); font-size:16px; line-height:1.5;
}
img { max-width:100%; }
a { color:inherit; text-decoration:none; }
a:hover { color:var(--altin); }
:focus-visible { outline:3px solid var(--altin); outline-offset:2px; }

.kap { width:min(1240px, calc(100% - 64px)); margin-inline:auto; }

@keyframes akis { to { transform:translateX(-50%); } }
@keyframes vurus { 50% { opacity:.4; transform:scale(.7); } }
@media (prefers-reduced-motion: reduce) {
  .sondakika-akis span { animation:none; }
  .nokta { animation:none; }
}

/* ---------- üst bant ---------- */
.ustbant { background:linear-gradient(135deg,#071b31,#0a2949 60%,#0d2f52); color:#fff; }
.ustbant-ic {
  min-height:84px; display:flex; align-items:center; justify-content:space-between;
  gap:24px; flex-wrap:wrap; padding:14px 0;
}
.marka img { display:block; height:44px; width:auto; }

.skorlar {
  display:flex; overflow-x:auto; max-width:100%;
  border:1px solid rgba(255,255,255,.16); border-radius:8px;
}
.skorlar-etiket {
  display:flex; align-items:center; gap:6px; padding:10px 14px; flex-shrink:0;
  color:var(--yesil); background:rgba(6,60,42,.5);
  font-weight:700; font-size:12px; white-space:nowrap;
}
.nokta { width:7px; height:7px; border-radius:50%; background:var(--yesil);
  display:inline-block; animation:vurus 1.6s infinite; }
.skor { padding:9px 14px; text-align:center; flex-shrink:0; min-width:92px;
  border-left:1px solid rgba(255,255,255,.12); }
.skor-lig { font-size:9px; letter-spacing:.06em; color:#c7d0d9; margin-bottom:4px; }
.skor-sayi { font:700 20px/1 var(--baslik-yazi); font-variant-numeric:tabular-nums; }
.skor-takim { display:flex; justify-content:space-between; gap:8px; margin-top:5px;
  font-size:10px; font-weight:700; }
.skor-dakika { color:var(--yesil); }

.sosyal { display:flex; gap:10px; }
.sosyal a { width:34px; height:34px; display:grid; place-items:center; border-radius:50%;
  border:1px solid rgba(255,255,255,.25); color:#fff; }
.sosyal a:hover { border-color:var(--altin); color:var(--altin); }

/* ---------- menü ---------- */
.menubant {
  position:sticky; top:0; z-index:20;
  background:rgba(246,244,239,.95); border-bottom:1px solid var(--cizgi);
  backdrop-filter:blur(10px);
}
.menubant-ic { min-height:54px; display:flex; align-items:center; position:relative; }
.menu { display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:6px; list-style:none; margin:0; padding:0; width:100%; }
.menu a { display:inline-block; padding:16px 12px; color:var(--lacivert);
  font-family:var(--baslik-yazi); font-weight:600; font-size:16px; letter-spacing:.03em; }
.menu a.etkin { color:var(--altin); }
.menu-dugme { display:none; margin-left:auto; padding:9px 12px; border:0; border-radius:7px;
  background:var(--lacivert); color:#fff; font-weight:700; font-size:14px; cursor:pointer;
  font-family:var(--baslik-yazi); letter-spacing:.04em; }

/* ---------- son dakika ---------- */
.sondakika { background:var(--kirmizi); color:#fff; }
.sondakika-ic { min-height:42px; display:flex; align-items:center; gap:16px; overflow:hidden; }
.sondakika-etiket { font-family:var(--baslik-yazi); font-weight:700; font-size:16px;
  letter-spacing:.04em; white-space:nowrap; flex-shrink:0; }
.sondakika-cizgi { width:1px; height:20px; background:rgba(255,255,255,.5); flex-shrink:0; }
.sondakika-akis { overflow:hidden; flex:1; min-width:0; }
.sondakika-akis span { display:inline-block; white-space:nowrap; font-weight:600; font-size:14px;
  animation:akis 40s linear infinite; }

/* ---------- reklam ---------- */
.reklam-etiket { font-size:10px; letter-spacing:.08em; color:#9aa3ac; text-align:center;
  margin-bottom:6px; }
.reklam-kutu { display:grid; place-items:center; padding:10px; text-align:center;
  border:1px dashed #cdbf9f; border-radius:6px; background:#fbfaf6;
  color:#9aa3ac; font-size:12px; }
.reklam { margin:26px 0; }
.reklam-genis .reklam-kutu { width:100%; max-width:728px; height:90px; margin-inline:auto; }
.reklam-kart { margin:0; display:flex; flex-direction:column; justify-content:center;
  padding:16px; background:var(--kagit); border:1px dashed #cdbf9f; border-radius:10px;
  min-height:280px; }
.reklam-kart .reklam-kutu { border:0; height:200px; }

.ray { position:fixed; top:150px; width:160px; z-index:5; display:none; }
.ray-sol { left:20px; } .ray-sag { right:20px; }
.ray-kutu { width:160px; height:600px; }
@media (min-width:1640px) { .ray { display:block; } }

/* ---------- görseller ---------- */
.gorsel { display:block; width:100%; height:100%; object-fit:cover; }
.gorsel-yok {
  display:grid; place-items:center; min-height:110px;
  background:linear-gradient(135deg,#12335a,#0a2949);
  color:rgba(255,255,255,.55); font-family:var(--baslik-yazi); font-size:15px;
  letter-spacing:.08em; text-transform:uppercase;
}

.etiket { display:inline-block; padding:5px 10px; border-radius:3px;
  background:var(--kirmizi); color:#fff; font-size:11px; font-weight:700; letter-spacing:.05em; }

/* ---------- ana sayfa ---------- */
.anasayfa { padding:28px 0 56px; }
.ust-blok { display:grid; grid-template-columns:repeat(auto-fit,minmax(420px,1fr)); gap:14px; }

.manset { position:relative; min-height:420px; border-radius:10px; overflow:hidden;
  box-shadow:0 10px 30px rgba(10,41,73,.1); }
.manset-kat { position:absolute; inset:0; display:none; color:#fff; }
.manset-kat.etkin { display:block; }
.manset-gorsel { position:absolute; inset:0; }
.manset-perde { position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg,rgba(4,15,28,.88),rgba(4,15,28,.05) 65%); }
.manset-yazi { position:absolute; left:24px; right:24px; bottom:44px; }
.manset-yazi h1 { margin:10px 0 0; font-family:var(--baslik-yazi); font-weight:700;
  font-size:clamp(28px,3.2vw,46px); line-height:1.02; text-wrap:balance;
  text-shadow:0 2px 10px rgba(0,0,0,.4); }
.manset-yazi p { margin:10px 0 0; max-width:640px; color:#e7ecf1; font-size:15px; text-wrap:pretty; }
.manset-noktalar { position:absolute; left:24px; bottom:16px; display:flex; gap:6px; z-index:2; }
.manset-noktalar button { width:9px; height:9px; padding:0; border:0; border-radius:50%;
  background:rgba(255,255,255,.45); cursor:pointer; }
.manset-noktalar button.etkin { background:var(--altin); }

.yan-haberler { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  grid-auto-rows:1fr; gap:10px; }
.yan-haber { position:relative; min-height:200px; border-radius:10px; overflow:hidden; }
.yan-haber a { position:absolute; inset:0; color:#fff; }
.yan-perde { position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg,rgba(4,15,28,.85),transparent 60%); }
.yan-yazi { position:absolute; left:16px; right:16px; bottom:14px; }
.yan-yazi .etiket { margin-bottom:6px; font-size:10px; padding:4px 8px;
  background:rgba(165,18,31,.9); }
.yan-yazi h2 { margin:0; font-family:var(--baslik-yazi); font-weight:600; font-size:17px;
  line-height:1.15; text-wrap:balance; }

.bolum-basligi { display:flex; align-items:center; gap:16px; margin:44px 0 18px; }
.bolum-basligi h2 { margin:0; font-family:var(--baslik-yazi); font-weight:700; font-size:28px;
  letter-spacing:.02em; color:var(--lacivert); }
.bolum-basligi span { flex:1; height:1px; background:linear-gradient(90deg,#d9c48f,transparent); }

.kategori-izgara { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.kategori-kart { background:var(--kagit); border:1px solid var(--cizgi); border-radius:10px;
  overflow:hidden; display:flex; flex-direction:column; }
.kategori-kart h3 { min-height:50px; margin:0; display:flex; align-items:center;
  font-family:var(--baslik-yazi); font-weight:700; font-size:18px; letter-spacing:.02em;
  color:var(--lacivert); }
.kategori-kart h3 a { display:flex; align-items:center; gap:8px; padding:0 14px; width:100%; }
.kategori-kart .simge { font-size:20px; }
.kategori-kart-gorsel { display:block; height:110px; }
.kategori-kart ul { list-style:none; margin:0; padding:4px 14px 6px; }
.kategori-kart li { border-bottom:1px solid var(--cizgi-ince); }
.kategori-kart li:last-child { border-bottom:0; }
.kategori-kart li a { display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding:10px 1px; min-height:44px; font-size:13px; font-weight:600; line-height:1.3; }
.kategori-kart .ok { font-size:18px; color:var(--altin); flex-shrink:0; }

/* ---------- kategori sayfası ---------- */
.kategori-sayfa { padding:28px 0 56px; }
.kategori-baslik { display:flex; align-items:center; gap:12px; margin-bottom:22px; }
.kategori-baslik h1 { margin:0; font-family:var(--baslik-yazi); font-weight:700;
  font-size:clamp(26px,3vw,36px); color:var(--lacivert); letter-spacing:.02em; }
.kategori-baslik .simge { font-size:26px; }
.kategori-baslik .cizgi { flex:1; height:1px; background:linear-gradient(90deg,#d9c48f,transparent); }

.kategori-ust { margin-bottom:22px; border-radius:10px; overflow:hidden;
  background:var(--kagit); border:1px solid var(--cizgi); }
.kategori-ust a { display:grid; grid-template-columns:minmax(280px,1.4fr) 1fr; }
.kategori-ust-gorsel { min-height:280px; }
.kategori-ust-yazi { padding:26px; align-self:center; }
.kategori-ust-yazi h2 { margin:12px 0 8px; font-family:var(--baslik-yazi); font-weight:700;
  font-size:clamp(22px,2.4vw,30px); line-height:1.1; color:var(--lacivert); text-wrap:balance; }
.kategori-ust-yazi p { margin:0 0 10px; color:var(--soluk); }

.liste { display:grid; gap:14px; }
.liste-haber { background:var(--kagit); border:1px solid var(--cizgi); border-radius:10px;
  overflow:hidden; }
.liste-haber a { display:grid; grid-template-columns:220px 1fr; }
.liste-gorsel { min-height:150px; }
.liste-yazi { padding:16px 18px; align-self:center; }
.liste-yazi h3 { margin:0 0 6px; font-family:var(--baslik-yazi); font-weight:600; font-size:21px;
  line-height:1.15; color:var(--lacivert); text-wrap:balance; }
.liste-yazi p { margin:0 0 8px; color:var(--soluk); font-size:14px; }
.tarih { font-size:12px; color:var(--soluk); }

.sayfalama { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; margin-top:28px; }
.sayfalama a, .sayfalama span { display:grid; place-items:center; min-width:40px; min-height:40px;
  padding:0 12px; border:1px solid var(--cizgi); border-radius:8px; background:var(--kagit);
  font-weight:600; font-size:14px; }
.sayfalama .etkin { background:var(--lacivert); color:#fff; border-color:var(--lacivert); }

/* ---------- haber sayfası ---------- */
.haber-sayfa { width:min(860px, calc(100% - 64px)); padding:32px 0 64px; }
.geri { display:inline-flex; align-items:center; gap:6px; margin-bottom:20px;
  color:var(--lacivert); font-weight:700; font-size:14px; }
.haber-sayfa h1 { margin:12px 0 14px; font-family:var(--baslik-yazi); font-weight:700;
  font-size:clamp(28px,4vw,42px); line-height:1.05; color:var(--lacivert); text-wrap:balance; }
.haber-sayfa .ozet { margin:0 0 18px; font-size:18px; color:var(--soluk); text-wrap:pretty; }
.kunye { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
  gap:14px; padding-bottom:16px; margin-bottom:20px; border-bottom:1px solid var(--cizgi); }
.yazar { display:flex; align-items:center; gap:10px; }
.yazar-simge { width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
  background:var(--lacivert); color:#fff; font-family:var(--baslik-yazi); font-weight:700;
  font-size:18px; }
.yazar-ad { font-size:13px; font-weight:700; }
.yazar time { font-size:12px; color:var(--soluk); }
.paylas { display:flex; gap:8px; }
.paylas a, .paylas button { width:32px; height:32px; display:grid; place-items:center;
  border-radius:50%; border:1px solid #dcd3bd; background:transparent; color:var(--lacivert);
  cursor:pointer; }
.paylas a:hover, .paylas button:hover { border-color:var(--altin); color:var(--altin); }

.haber-gorsel { height:380px; border-radius:10px; overflow:hidden; }
.metin { font-size:17px; line-height:1.75; color:#232e39; }
.metin p { margin:0 0 18px; }

.galeri { margin:28px 0; }
.galeri h3, .ilgili h3 { margin:0 0 12px; font-family:var(--baslik-yazi); font-weight:700;
  font-size:20px; color:var(--lacivert); letter-spacing:.02em; }
.galeri-izgara { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; }
.galeri-izgara img { height:130px; width:100%; object-fit:cover; border-radius:8px; }

.ilgili { margin-top:44px; padding-top:24px; border-top:1px solid var(--cizgi); }
.ilgili-izgara { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.ilgili-kart { display:flex; flex-direction:column; gap:8px; font-size:14px; font-weight:700;
  line-height:1.3; }
.ilgili-gorsel { height:120px; border-radius:8px; overflow:hidden; }

/* ---------- düz sayfalar ---------- */
.duz-sayfa { width:min(760px, calc(100% - 64px)); padding:40px 0 64px; }
.duz-sayfa h1 { font-family:var(--baslik-yazi); font-weight:700; font-size:clamp(26px,3vw,38px);
  color:var(--lacivert); margin:0 0 16px; }
.bos { color:var(--soluk); font-size:14px; padding:8px 0; }
.dugme { display:inline-block; padding:12px 20px; border-radius:8px; background:var(--lacivert);
  color:#fff; font-weight:700; }
.dugme:hover { background:var(--lacivert-koyu); color:#fff; }

/* ---------- kartlar (ortak) ---------- */
.kart { background:var(--kagit); border:1px solid var(--cizgi); border-radius:10px; overflow:hidden; }
.kart-gorsel { height:160px; }
.kart-govde { padding:14px 16px; }
.kart-govde h3 { margin:8px 0 4px; font-family:var(--baslik-yazi); font-weight:600; font-size:19px;
  line-height:1.15; color:var(--lacivert); }
.kart-govde p { margin:0; font-size:14px; color:var(--soluk); }

/* ---------- alt bilgi ---------- */
footer { background:var(--lacivert); color:#dce4ec; }
.altbilgi-ic { min-height:100px; display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:20px; padding:24px 0; }
.altbilgi-ic img { display:block; height:38px; width:auto; }
.altbilgi-ic p { margin:6px 0 0; color:#aebbc7; font-size:13px; }
.altbilgi-menu { display:flex; flex-wrap:wrap; gap:18px; font-size:13px; font-weight:700; }

/* ---------- dar ekran ---------- */
@media (max-width:900px) {
  .kategori-ust a { grid-template-columns:1fr; }
  .kategori-ust-gorsel { min-height:200px; }
  .liste-haber a { grid-template-columns:130px 1fr; }
  .liste-gorsel { min-height:110px; }
  .liste-yazi { padding:12px 14px; }
  .liste-yazi h3 { font-size:17px; }
  .liste-yazi p { display:none; }
}

@media (max-width:780px) {
  .kap { width:calc(100% - 32px); }
  .haber-sayfa, .duz-sayfa { width:calc(100% - 32px); }
  .ustbant-ic { min-height:0; gap:14px; }
  .marka { order:1; }
  .sosyal { order:2; margin-left:auto; }
  .skorlar { order:3; width:100%; }
  .menu-dugme { display:block; }
  .menu { display:none; position:absolute; top:52px; left:0; right:0; z-index:30;
    flex-direction:column; align-items:stretch; gap:0; padding:8px;
    background:var(--lacivert); border-radius:0 0 8px 8px;
    box-shadow:0 12px 30px rgba(10,41,73,.25); }
  .menu.acik { display:flex; }
  .menu a { padding:13px 12px; color:#fff; font-size:17px; }
  .ust-blok { grid-template-columns:1fr; }
  .manset { min-height:320px; }
  .manset-yazi { left:16px; right:16px; bottom:40px; }
  .haber-gorsel { height:220px; }
}
