/* =========================================================
   DWK Extra1 – 2 sütun (sol liste + sağ banner)
   Masaüstünde: 2fr / 1fr
   Mobilde: tek sütun, banner üstte
   ========================================================= */

.dwk-extra1, .dwk-extra1 * { box-sizing: border-box; }

/* === Ana ızgara (masaüstü) === */
.dwk-extra1 {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 30px;
  margin: 40px auto;
  max-width: 1200px;
  align-items: start;
}

/* === Sol sütun: liste çerçevesi === */
.dwk-extra1-content {
  display: flex;
  flex-direction: column;
  height: 660px;                 /* 3 kart için sabit kolon yüksekliği */
  gap: 12px;
  background: #fff;
  border: 1px solid #e9e9ee;
  border-radius: 12px;
  padding: 14px;
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}

/* === Kart === */
.dwk-extra1-item {
  flex: 1;                       /* 3 kartın boyu eşit */
  min-height: 200px;             /* alt limit */
  display: flex;
  gap: 16px;
  background: #fff;
  border: 1px solid #eef0f4;
  border-radius: 10px;
  overflow: hidden;
}

/* === Sol görsel alanı (sabit genişlik) === */
.dwk-extra1-thumb {
  flex: 0 0 260px;               /* sabit 260px */
  height: 100%;                  /* kartın yüksekliği kadar */
}
.dwk-extra1-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;             /* tüm görseller eşit yükseklik */
  display: block;
}

/* === İçerik === */
.dwk-extra1-content-inner {
  flex: 1;
  padding: 12px 10px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.dwk-extra1-content-inner .meta-category {
  font-size: 12px;
  text-transform: uppercase;
  color: #777;
  margin-bottom: 4px;
}
.dwk-extra1-content-inner .entry-title {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 4px;
  line-height: 1.35;
}
.dwk-extra1-content-inner .entry-title a {
  color: inherit;
  text-decoration: none;
}
.dwk-extra1-content-inner .post-meta {
  font-size: 12px;
  color: #999;
}

/* === Sağ banner === */
.dwk-extra1-sidebar {
  align-self: start;             /* grid içinde en üste hizala */
  margin-top: -8px;              /* hafif yukarı al */
}
.dwk-extra1-sidebar img {
  width: 300px;
  height: 600px;
  object-fit: cover;
  display: block;
  border-radius: 10px;
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
}

/* =======================
   RESPONSIVE
   ======================= */

/* Tablet: biraz kıs */
@media (max-width: 1024px) {
  .dwk-extra1 { gap: 20px; }
  .dwk-extra1-thumb { flex-basis: 220px; }
  .dwk-extra1-content { height: 620px; }
  .dwk-extra1-sidebar img { width: 260px; height: 520px; }
}

/* Mobil: tek sütun, banner üstte, sabit yükseklikler kaldırılır */
@media (max-width: 768px) {
  .dwk-extra1 {
    grid-template-columns: 1fr;  /* tek sütun */
    gap: 14px;
  }

  /* Sıralama: banner üstte olsun */
  .dwk-extra1-sidebar { 
    order: 1;
    margin: 0;                   /* eksi marginleri kaldır */
    align-self: stretch;         /* tam genişlik */
  }
  .dwk-extra1-content { 
    order: 2;
    height: auto;                /* sabit yüksekliği kaldır */
    padding: 10px;
    box-shadow: none;            /* istersen gölgeyi hafiflet */
  }

  .dwk-extra1-item {
    flex-direction: column;
    flex: initial;
    min-height: unset;
    gap: 10px;
    border-radius: 10px;
  }

  .dwk-extra1-thumb {
    flex: initial; 
    width: 100%;
    height: auto;
  }
  .dwk-extra1-thumb img {
    width: 100%;
    height: 160px;               /* mobil görsel yüksekliği */
    object-fit: cover;
    display: block;
    max-width: 100%;
  }

  .dwk-extra1-sidebar img {
    width: 100%;
    height: auto;                /* 300x600 zorlamasını kaldır */
    max-width: 100%;
    border-radius: 10px;
    box-shadow: 0 6px 14px rgba(0,0,0,.08);
  }
}

/* Çok küçük ekranlar */
@media (max-width: 540px) {
  .dwk-extra1-thumb img { height: 150px; }
}
/* Mobilde reklamı gizle */
@media (max-width: 768px){
  .dwk-extra1 { grid-template-columns: 1fr; }
  .dwk-extra1-sidebar { display: none; }
  .dwk-extra1-content { order: 1; height: auto; padding: 10px; box-shadow: none; }
}
