/* ============================================================
   SAYFA GİRİŞ ANİMASYONLARI
   ============================================================ */
@keyframes grow-in {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}

.giris-sol  { animation: grow-in 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; animation-delay: 0.2s; }
.giris-orta { animation: grow-in 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; animation-delay: 0.35s; }
.giris-sag  { animation: grow-in 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; animation-delay: 0.5s; }
.duyuru-ic  { animation: grow-in 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) both; animation-delay: 0.6s; }

/* ============================================================
   GİRİŞ + DUYURU ARKA PLAN (tol-capraz.webp)
   ============================================================ */

/* Wrapper: border (z:2) üstünde, tagline (z:979) ve header (z:980) altında */
.hero-bg-wrap {
  position: relative;
  isolation: isolate;
  z-index: 3;
}

@keyframes hero-grow-in {
  from { transform: translateX(-50%) scale(0.88); opacity: 0; }
  to   { transform: translateX(-50%) scale(1);    opacity: 1; }
}

@keyframes hero-sway {
  0%   { transform: translateX(-50%); }
  50%  { transform: translateX(calc(-50% + 40px)); }
  100% { transform: translateX(-50%); }
}

/* Resim: body'e göre top:0 — sayfanın en üstünden başlar,
   tüm ekranlarda negatif top sorunu olmaz */
.hero-bg-img {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  display: block;
  pointer-events: none;
  user-select: none;
  z-index: 3;
  animation: hero-grow-in 1.2s ease both, hero-sway 8s ease-in-out 1.2s infinite;
}

/* Bölümler resmin önünde, şeffaf arka plan */
.hero-bg-wrap .giris-section,
.hero-bg-wrap > section {
  position: relative;
  z-index: 1;
  background: transparent;
}

/* ============================================================
   GİRİŞ BÖLÜMÜ
   ============================================================ */
.giris-section {
  background: #fff;
  padding: 90px 0;
}

/* UIKit grid stretch — kolonlar eşit yükseklikte, hizalama CSS ile */
.giris-grid > [class*="uk-width"] { display: flex; flex-direction: column; }

/* ── Sol: üstte hizalı ──────────────────────────────────── */
.giris-sol {
  align-self: flex-start;
  justify-content: flex-start;
}

.giris-sayi-badge {
  background: #ffed00;
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 40px;
  font-weight: 900;
  text-transform: uppercase;
  line-height: 1;
  display: inline-block;
  padding: 50px 10px 6px;
  margin: 50px 0px 12px 0px;
}

.giris-festival-adi {
  font-size: 24px;
  font-weight: 900;
  color: #000;
  text-transform: uppercase;
  margin: 0 0 4px;
  line-height: 1.3;
}

.giris-ozel-sayi {
  font-family: 'Barlow', sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  margin: 0;
  line-height: 1.3;
}

/* ── Orta: ortalı ───────────────────────────────────────── */
.giris-orta {
  align-self: center;
  align-items: center;
}

.giris-kapak-wrap {
  position: relative;
  aspect-ratio: 631 / 618;
  overflow: hidden;
  max-height: calc(100vh - 360px);
  width: auto;
  max-width: 100%;
}

.giris-kapak-wrap img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.giris-kapak-butonlar {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}

.giris-kapak-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  padding: 10px 100px;
  line-height: 1;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

.giris-kapak-btn:hover { transform: translateY(-4px); opacity: 0.75; text-decoration: none; }

.giris-kapak-btn--oku {
  background: transparent;
  color: #000;
}

.giris-kapak-btn--oku:hover { color: #000; }

.giris-kapak-btn--indir {
  background: transparent;
  color: #000;
}

.giris-kapak-btn--indir:hover { color: #000; }

.giris-kapak-bilgi {
  text-align: center;
  margin-top: -40px;
}

.giris-kapak-bilgi p {
  font-size: 18px;
  font-weight: 400;
  margin: 0 0 2px;
  line-height: 1.5;
}

.giris-kapak-bilgi p strong {
  font-weight: 700;
  color: #000;
  font-size: 18px;
}

.giris-kapak-issn,
.giris-kapak-issn strong {
  font-size: 16px !important;
  font-weight: 700;
}

/* ── Sağ: altta hizalı ──────────────────────────────────── */
.giris-sag {
  align-self: flex-end;
  justify-content: flex-end;
  align-items: flex-start;
}

.giris-makale-badge {
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 30px;
  font-weight: 900;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.1;
  display: inline-block;
  padding: 18px 20px 3px;
  margin-bottom: 10px;
  background-image: linear-gradient(to top, #000 50%, #ffed00 50%);
  background-size: 100% 200%;
  background-position: top;
  transition: background-position 0.3s ease, color 0.3s ease;
}

.giris-makale-badge:hover {
  background-position: bottom;
  color: #fff;
  text-decoration: none;
}

.giris-makale-text {
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #000;
  line-height: 1.45;
  margin: 0;
}

/* ── Responsive: 2000px altı (≤1999px) ──────────────────── */
@media (max-width: 1999px) {
  .giris-section         { padding: 64px 0; }
}

/* ── Responsive: Geniş ekran (≤1680px) ──────────────────── */
@media (max-width: 1680px) {
  .giris-section         { padding: 60px 0; }
  .giris-sayi-badge      { font-size: 36px; padding: 40px 10px 5px; margin: 48px 0 11px 0; }
  .giris-festival-adi    { font-size: 22px; }

  .giris-kapak-btn       { padding: 10px 90px; }
  .giris-kapak-bilgi     { margin-top: -39px; }
  .giris-kapak-bilgi p   { font-size: 17px; }
  .giris-makale-badge    { font-size: 28px; padding: 18px 19px 3px; }
  .giris-makale-text     { font-size: 16px; }
}

/* ── Responsive: Büyük ekran (≤1599px) ──────────────────── */
@media (max-width: 1599px) {
  .giris-section         { padding: 56px 0; }
  .giris-sayi-badge      { font-size: 34px; padding: 40px 10px 5px; margin: 44px 0 10px 0; }
  .giris-festival-adi    { font-size: 20px; }

  .giris-kapak-btn       { padding: 10px 50px; }
  .giris-kapak-bilgi     { margin-top: -38px; }
  .giris-kapak-bilgi p   { font-size: 16px; }
  .giris-makale-badge    { font-size: 27px; padding: 17px 18px 3px; }
  .giris-makale-text     { font-size: 15px; }
}

/* ── Responsive: Küçük ekran (≤1399px) ──────────────────── */
@media (max-width: 1399px) {
  .giris-section         { padding: 52px 0; }
  .giris-sayi-badge      { font-size: 30px; padding: 38px 10px 5px; margin: 38px 0 10px 0; }
  .giris-festival-adi    { font-size: 19px; }

  .giris-kapak-btn       { padding: 10px 50px; }
  .giris-kapak-bilgi     { margin-top: -34px; }
  .giris-kapak-bilgi p   { font-size: 16px; }
  .giris-makale-badge    { font-size: 24px; padding: 16px 17px 3px; }
  .giris-makale-text     { font-size: 15px; }
}

/* ── Responsive: Laptop (≤1199px) ──────────────────────── */
@media (max-width: 1199px) {
  .giris-section         { padding: 48px 0; }
  .giris-sayi-badge      { font-size: 28px; padding: 30px 10px 5px; margin: 30px 0 10px 0; }
  .giris-festival-adi    { font-size: 16px; }
  .giris-kapak-btn       { padding: 10px 42px; font-size: 14px; }
  .giris-kapak-bilgi     { margin-top: -28px; }
  .giris-kapak-bilgi p   { font-size: 14px; }
  .giris-makale-badge    { font-size: 20px; padding: 14px 16px 3px; }
  .giris-makale-text     { font-size: 14px; }
}

/* ── Responsive: Tablet (≤959px) — 3 kolon dar ─────────── */
@media (max-width: 959px) {
  .giris-section         { padding: 40px 0; }
  .giris-sol,
  .giris-sag             { align-self: auto; }
  .giris-sayi-badge      { font-size: 22px; padding: 22px 8px 4px; margin: 20px 0 8px 0; }
  .giris-festival-adi    { font-size: 14px; }

  .giris-kapak-btn       { padding: 8px 28px; font-size: 13px; gap: 6px; }
  .giris-kapak-bilgi     { margin-top: -22px; }
  .giris-kapak-bilgi p   { font-size: 13px; }
  .giris-makale-badge    { font-size: 16px; padding: 12px 14px 3px; }
  .giris-makale-text     { font-size: 13px; }
}

/* ── Responsive: Küçük tablet (≤767px) ─────────────────── */
@media (max-width: 767px) {

  .hero-bg-img {
    width: 100%;
    height: 50vh;
    object-fit: cover;
    object-position: center top;
    animation: hero-grow-in 1.2s ease both;
  }

  .giris-kapak-btn       { padding: 8px 22px; font-size: 12px; }
  .giris-kapak-bilgi     { margin-top: -18px; }
  .giris-kapak-bilgi p   { font-size: 12px; }
}

/* ── Responsive: Mobil (≤639px) — tek kolon ────────────── */
@media (max-width: 639px) {
  .giris-section         { padding: 25px 0; }
  .giris-sol,
  .giris-orta            { align-self: auto; align-items: center; }
  .giris-sag             { align-self: auto; align-items: center; text-align: center; }
  .giris-sayi-badge      { font-size: 24px; padding: 10px 14px 3px; margin: 5px 0 10px 0; }
  .giris-festival-adi    { font-size: 18px; }
  .giris-kapak-butonlar  { gap: 8px; }
  .giris-kapak-btn       { justify-content: center; padding: 10px 14px; font-size: 15px; }
  .giris-kapak-wrap      { max-height: calc(100vh - 220px); }
  .giris-kapak-bilgi     { margin-top: -14px; }
  .giris-kapak-bilgi p   { font-size: 15px; }
  .giris-makale-badge    { font-size: 20px; padding: 14px 20px 3px; margin-top: 24px; }
  .giris-makale-text     { font-size: 15px; }
}

/* ── Responsive: Çok küçük mobil (≤479px) ───────────────── */
@media (max-width: 479px) {
  .giris-section         { padding: 20px 0; }
  .giris-sayi-badge      { font-size: 20px; }
  .giris-festival-adi    { font-size: 15px; }
  .giris-kapak-btn       { font-size: 14px; padding: 10px 10px; }
  .giris-kapak-wrap      { max-height: calc(100vh - 180px); }
  .giris-kapak-bilgi p   { font-size: 13px; }
  .giris-makale-badge    { font-size: 18px; }
  .giris-makale-text     { font-size: 14px; }
}

/* ============================================================
   DUYURU BÖLÜMÜ
   ============================================================ */
.duyuru-section {
  background: #fff;
  padding: 40px 0;
}

/* Sol boş sütun: ok ikonu sağa yaslanmış */
.duyuru-sol {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.duyuru-sol-ikon {
  color: #000;
}

/* DUYURU sarı badge — giris-makale-badge ile aynı oran ve efekt */
.duyuru-badge {
  display: inline-block;
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 30px;
  font-weight: 900;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.1;
  padding: 18px 20px 3px;
  white-space: nowrap;
  background-image: linear-gradient(to top, #000 50%, #ffed00 50%);
  background-size: 100% 200%;
  background-position: top;
  transition: background-position 0.3s ease, color 0.3s ease;
}

.duyuru-badge:hover {
  background-position: bottom;
  color: #fff;
  text-decoration: none;
}

/* İç grid hizalaması */
.duyuru-ic > [class*="uk-width"] {
  display: flex;
  align-items: center;
}

/* Her slayt: başlık + açıklama, tamamı tıklanabilir link */
.duyuru-item {
  display: block;
  text-decoration: none;
  color: inherit;
}

.duyuru-item:hover { text-decoration: none; }

.duyuru-item-baslik {
  font-family: 'Barlow', sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  color: #000;
  margin: 0 0 6px;
  line-height: 1.2;
}

.duyuru-item-aciklama {
  font-size: 16px;
  color: #000;
  margin: 0;
  line-height: 1.55,;
  transition: color 0.2s;
}

.duyuru-item:hover .duyuru-item-aciklama { color: #000; }

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 1399px) {
  .duyuru-badge { font-size: 26px; padding: 16px 17px 3px; }
}

@media (max-width: 1199px) {
  .duyuru-badge { font-size: 22px; padding: 14px 15px 3px; }
}

@media (max-width: 959px) {
  .duyuru-badge { font-size: 20px; padding: 12px 14px 3px; }
  .duyuru-item-baslik { font-size: 16px; }
  .duyuru-item-aciklama { font-size: 16px; }
}

@media (max-width: 639px) {
  .duyuru-section { padding: 28px 0; }
  .duyuru-badge   { font-size: 20px; padding: 12px 14px 3px; }
}

@media (max-width: 479px) {
  .duyuru-section        { padding: 20px 0; }
  .duyuru-badge          { font-size: 18px; padding: 10px 12px 3px; }
  .duyuru-item-baslik    { font-size: 15px; }
  .duyuru-item-aciklama  { font-size: 14px; }
}

/* ============================================================
   INDEX SAYFASI — MAKALELER BÖLÜMÜ
   ============================================================ */

.makaleler-section {
  position: relative;
  z-index: 4;
  padding: var(--section-padding, 100px) 0;
}

/* ── Başlık + çizgi ─────────────────────────────────────── */
.makaleler-ust {
  display: flex;
  align-items: center;
  gap: 24px;
}

.makaleler-baslik-badge {
  background: #ffed00;
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 30px;
  font-weight: 900;
  text-transform: uppercase;
  padding: 25px 18px 5px;
  flex-shrink: 0;
  line-height: 1;
  display: inline-block;
}

.makaleler-ust-cizgi {
  flex: 1;
  border: none;
  border-top: 2px solid #000;
  margin: 0;
}

/* ── İçerik: sidebar + liste ────────────────────────────── */
.makaleler-icerik {
  display: grid;
  grid-template-columns: 190px 1fr;
  gap: 70px;
  align-items: start;
}

/* ── Sidebar ────────────────────────────────────────────── */
.makaleler-sidebar {}

.makaleler-kategori ul {
  list-style: none;
  padding: 0;
  margin: 0 0 48px;
  border: none !important;
}

.makaleler-kategori li {
  margin-bottom: 0;
  border: none !important;
}

/* UIkit accordion override — ok işareti ve varsayılan stiller kaldırıldı */
.makaleler-kategori .uk-accordion-title {
  font-family: 'Barlow', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #000 !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
  padding: 4px 0 4px 10px !important;
  border-left: 3px solid transparent;
  display: block;
  transition: color 0.2s, border-color 0.2s;
}

.makaleler-kategori .uk-accordion-title::before {
  display: none !important;
}

.makaleler-kategori li.uk-open > .uk-accordion-title {
  font-weight: 700 !important;
  color: #000 !important;
  border-left-color: #ffed00 !important;
}

.makaleler-kategori .uk-accordion-title:hover {
  color: #888 !important;
}

/* İçerik alanı sıfır yükseklikte — sadece navigasyon için kullanılıyor */
.makaleler-kategori .uk-accordion-content {
  margin: 0 !important;
  padding: 0 !important;
}

.makale-gonder-badge {
  display: inline-block;
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  font-weight: 900;
  text-transform: uppercase;
  padding: 10px 10px 1px;
  margin-bottom: 15px;
  text-decoration: none;
  background-image: linear-gradient(to top, #000 50%, #ffed00 50%);
  background-size: 100% 200%;
  background-position: top;
  transition: background-position 0.3s ease, color 0.3s ease;
}

.makale-gonder-badge:hover {
  background-position: bottom;
  color: #fff;
  text-decoration: none;
}

.makale-gonder-text {
  display: block;
  font-size: 16px;
  color: #000;
  text-decoration: none;
}

.makale-gonder-text:hover {
  color: #555;
  text-decoration: none;
}

/* ── Makale listesi ─────────────────────────────────────── */
.makaleler-liste {
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: opacity 0.25s ease;
}

/* ── Makale kartı ───────────────────────────────────────── */
.makale-kart {
  background: #fff;
  border: none;
  border-bottom: 1px solid #e0e0e0;
  padding: 30px 20px;
}

.makale-kart:first-child {
  padding-top: 0;
}

.makale-kart:last-child {
  border-bottom: none;
}

.makale-kart-ic {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

/* Fotoğraf */
.makale-foto-wrap {
  flex-shrink: 0;
  width: 84px;
  height: 106px;
  overflow: hidden;
  background: #ccc;
}

.makale-foto-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}

/* Kişi bilgisi */
.makale-kisi {
  flex-shrink: 0;
  width: 182px;
}

.makale-kisi-isim {
  font-family: 'Barlow', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #000;
  margin: 0 0 5px;
  line-height: 1.2;
}

.makale-kisi-unvan,
.makale-kisi-email {
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #000;
  margin: 0;
}

/* Makale içerik sağ taraf */
.makale-sag {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 100px;
}

.makale-kart-baslik {
  font-family: 'Barlow', sans-serif !important;
  font-size: 18px;
  font-weight: 700;
  color: #000;
  line-height: 1.35;
  margin: 0 0 24px;
}

/* Alt: butonlar + sayfa numarası */
.makale-alt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.makale-butonlar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.makale-btn {
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #000;
  border: none;
  padding: 10px 40px;
  text-decoration: none;
  white-space: nowrap;
  display: inline-block;
  background-image: linear-gradient(to top, #ffed00 50%, #fff 50%);
  background-size: 100% 200%;
  background-position: top;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.10);
  transition: background-position 0.3s ease, box-shadow 0.3s ease;
}

.makale-btn:hover {
  background-position: bottom;
  color: #000;
  box-shadow: none;
  text-decoration: none;
}

.makale-btn--pdf {
  background-image: linear-gradient(to top, #ffed00 50%, #e8e8e8 50%);
  background-position: top;
  box-shadow: none;
}

.makale-btn--pdf:hover {
  background-position: bottom;
  color: #000;
}

.makale-sayfalar {
  font-family: 'Barlow', sans-serif;
  font-size: 15px;
  font-weight: 300;
  color: #888;
  white-space: nowrap;
  margin-left: auto;
}

/* ── Responsive: Desktop (1200–1599px) ──────────────────── */
@media (max-width: 1599px) {
  .makaleler-baslik-badge   { font-size: 27px; }
  .makaleler-icerik         { grid-template-columns: 170px 1fr; gap: 32px; }
  .makale-kart-baslik       { font-size: 17px; }
  .makale-kisi-isim         { font-size: 17px; }
}

/* ── Responsive: Laptop (960–1199px) ────────────────────── */
@media (max-width: 1199px) {
  .makaleler-baslik-badge   { font-size: 24px; }
  .makaleler-icerik         { grid-template-columns: 150px 1fr; gap: 24px; }
  .makale-kisi              { width: 152px; }
  .makale-kart-baslik       { font-size: 16px; }
  .makale-kisi-isim         { font-size: 16px; }
  .makale-foto-wrap         { width: 76px; height: 96px; }
}

/* ── Responsive: Tablet + Mobil — kategori kaydırma ────────
   (≤959px) grid tek kolon, kategoriler yatay kaydırmalı şerit */
@media (max-width: 959px) {
  .makaleler-baslik-badge  { font-size: 22px; }
  .makaleler-ust           { margin-bottom: 24px; }
  .makale-kart:first-child { padding-top: 30px; }
  .makale-kart             { padding-left: 0; padding-right: 0; }
  .makale-btn              { padding-left: 20px; padding-right: 20px; }
  .makaleler-icerik       { grid-template-columns: 1fr; gap: 20px; }
  .makaleler-sidebar      { min-width: 0; }
  .makaleler-kategori     { max-width: 100%; overflow: hidden; }

  /* Scroll sadece bu wrapper içinde kalır */
  .makaleler-kategori-kaydirici {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    white-space: nowrap;
    display: block;
    margin-bottom: 18px;
    padding: 2px 2px 8px;
    mask-image: linear-gradient(to right, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%);
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 12px, #000 calc(100% - 12px), transparent 100%);
  }
  .makaleler-kategori-kaydirici::-webkit-scrollbar { display: none; }

  /* inline-flex: ul içerik kadar genişler ama inline kaldığı için
     wrapper dışına taşmaz — page-wide scroll olmaz              */
  .makaleler-kategori ul {
    display: inline-flex !important;
    width: max-content;
    flex-wrap: nowrap !important;
    vertical-align: top;
    margin-bottom: 0;
    padding-bottom: 2px;
    gap: 8px;
  }
  .makaleler-kategori li { flex-shrink: 0; margin: 0 !important; }

  /* Her kategori modern pill görünümü */
  .makaleler-kategori .uk-accordion-title {
    white-space: nowrap;
    padding: 10px 15px !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 0px;
    background: #fff;
    color: #424242 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
    margin-bottom: 0 !important;
    display: inline-block !important;
    transition: all 0.2s ease;
  }
  .makaleler-kategori .uk-accordion-title:hover {
    background: #f8f8f8;
    border-color: #d9d9d9 !important;
    color: #111 !important;
  }
  .makaleler-kategori li.uk-open > .uk-accordion-title {
    background: linear-gradient(135deg, #111 0%, #2b2b2b 100%) !important;
    border-color: #111 !important;
    color: #fff !important;
    font-weight: 700 !important;
    box-shadow: none;
    transform: translateY(-1px);
  }

  /* Kart boyutları */
  .makale-kart-baslik { font-size: 16px; }
  .makale-kisi-isim   { font-size: 16px; }
  .makale-kisi        { width: 148px; }
  .makale-foto-wrap   { width: 72px; height: 91px; }
}

/* ── Responsive: Mobil (< 640px) ───────────────────────── */
@media (max-width: 639px) {
  .makaleler-baslik-badge { font-size: 20px; }
  .makaleler-ust          { gap: 14px; margin-bottom: 18px; }
  .makaleler-icerik       { gap: 14px; }

  /* Kart — foto+kişi üst satır, başlık+buton alt satır */
  .makale-kart    { padding: 30px 0; }
  .makale-kart-ic { flex-wrap: wrap; gap: 12px; }
  .makale-foto-wrap { width: 64px; height: 81px; flex-shrink: 0; }
  .makale-kisi    { flex: 1; min-width: 0; width: auto; }
  .makale-sag     { flex: 0 0 100%; min-height: auto; margin-top: 16px; }
  .makale-kart-baslik { font-size: 15px; margin-bottom: 10px; }
  .makale-kisi-isim   { font-size: 15px; }
  .makale-alt      { flex-direction: column; align-items: flex-start; gap: 25px; }
  .makale-sayfalar { margin-left: 0; }
  .makale-gonder-wrap { margin-top: 8px; }

  .makaleler-kategori-kaydirici {
    margin-left: -6px;
    margin-right: -6px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .makaleler-kategori .uk-accordion-title {
    padding: 10px 15px !important;
    font-size: 14px !important;
  }
}

@media (max-width: 479px) {
  .makaleler-baslik-badge { font-size: 24px; padding: 18px 14px 4px; }
  .makale-btn             { padding: 10px 16px; font-size: 14px; }
  .makale-foto-wrap       { width: 56px; height: 71px; }
  .makale-kisi-isim       { font-size: 14px; }
  .makale-kisi-unvan,
  .makale-kisi-email      { font-size: 13px; }
  .makale-kart-baslik     { font-size: 14px; }
}

/* ============================================================
   TOL'DAN BÖLÜMÜ
   ============================================================ */
.toldan-section {
  position: relative;
  z-index: 4;
  padding: var(--section-padding, 100px) 0 0;
}

.toldan-kutu {
  background: #fff;
  box-shadow: 0 4px 32px rgba(0, 0, 0, 0.10);
  padding: 100px 56px 50px;
  position: relative;
}

/* TOL'DAN satırı: uk-grid + uk-width (index.php); slider taşmasın */
.toldan-sag {
  min-width: 0;
}

/* ── Sol: Yayın içeriği ─────────────────────────────────── */
.toldan-badge {
  position: absolute;
  top: -40px;
  left: 56px;
  background: #ffed00;
  color: #000;
  font-family: 'Barlow', sans-serif;
  font-size: 55px;
  font-style: italic;
  font-weight: 900;
  text-transform: uppercase;
  padding: 30px 60px 3px;
  line-height: 1;
  display: inline-block;
}

.toldan-icerik-baslik {
  font-family: 'Barlow', sans-serif !important;
  font-size: 18px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  margin: 0 0 18px;
}

.toldan-metin p {
  font-size: 18px;
  font-weight: 300;
  color: #000;
  line-height: 1.7;
  margin: 0 0 18px;
}

.toldan-metin p:last-child {
  margin-bottom: 0;
}

/* ── Sağ: Tüm sayılar ───────────────────────────────────── */
.toldan-sayilar-wrap {
  overflow: hidden;
}

.toldan-sayilar-baslik {
  font-family: 'Barlow', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #000;
  text-transform: uppercase;
  margin: 0 0 20px;
  text-align: left;
  text-decoration: none;
  display: block;
}

.toldan-sayilar-baslik:hover {
  color: #555;
  text-decoration: none;
}

/* ── Sayı kartı ─────────────────────────────────────────── */
.toldan-sayi-kart {
  display: flex;
  flex-direction: column;
}

.toldan-sayi-resim {
  display: block;
  aspect-ratio: 288 / 407;
  overflow: hidden;
  background: #d8d8d8;
  text-decoration: none;
}

.toldan-sayi-resim img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.toldan-sayi-resim:hover img {
  transform: scale(1.04);
}

.toldan-sayi-alt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0 0;
  gap: 8px;
}

.toldan-sayi-label {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 8px;
}

.toldan-sayi-tol {
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  font-weight: 800;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  line-height: 1;
  flex-shrink: 0;
}

.toldan-sayi-isim {
  font-family: 'Barlow', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #000;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1;
}

.toldan-sayi-ok {
  color: #000;
  display: flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
  transition: color 0.2s;
}

.toldan-sayi-ok:hover {
  color: #555;
}

/* ── Slider nav ─────────────────────────────────────────── */
.toldan-slider-nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 4px;
  margin-top: 16px;
}

.toldan-nav-btn {
  color: #000 !important;
  background: none;
  border: none;
  padding: 6px;
  display: flex;
  align-items: center;
  transition: opacity 0.2s;
}

.toldan-nav-btn:hover {
  opacity: 0.5;
}

/* ── Responsive: Büyük laptop (≤1599px) ─────────────────── */
@media (max-width: 1599px) {
  .toldan-kutu           { padding: 85px 48px 44px; }
  .toldan-badge          { font-size: 54px; padding: 24px 18px 6px; left: 48px; }
}

/* ── Responsive: Laptop (≤1199px) ──────────────────────── */
@media (max-width: 1199px) {
  .toldan-kutu           { padding: 76px 40px 36px; }
  .toldan-badge          { font-size: 46px; left: 40px; }
  .toldan-icerik-baslik  { font-size: 17px; }
  .toldan-sayilar-baslik { font-size: 17px; }
  .toldan-metin p        { font-size: 15px; }
}

/* ── Responsive: Tablet (≤959px) ───────────────────────── */
@media (max-width: 959px) {
  .toldan-section        { padding-top: 60px; }
  .toldan-kutu           { padding: 70px 32px 32px; }
  .toldan-badge          { font-size: 40px; left: 32px; }
}

/* ── Responsive: Mobil (≤639px) ────────────────────────── */
@media (max-width: 639px) {
  .toldan-section        { padding-top: 40px; }
  .toldan-kutu           { padding: 56px 20px 24px; }
  .toldan-badge          { font-size: 34px; padding: 18px 14px 5px; left: 20px; }
  .toldan-metin p        { font-size: 15px; }
  .toldan-sayi-label     { font-size: 13px; }
}

@media (max-width: 479px) {
  .toldan-kutu           { padding: 48px 16px 20px; }
  .toldan-badge          { font-size: 28px; padding: 14px 12px 4px; left: 16px; top: -32px; }
  .toldan-icerik-baslik  { font-size: 15px; }
  .toldan-metin p        { font-size: 14px; line-height: 1.6; }
  .toldan-sayilar-baslik { font-size: 15px; }
  .toldan-sayi-tol,
  .toldan-sayi-isim      { font-size: 13px; }
}