/* Haberler – yazarlar başlığı/arama ile uyumlu */
:root{ --tabbar-h:92px; }

.page-title { display:flex; align-items:center; gap:.5rem; margin-bottom:6px; }
.page-title-icon { width:32px; height:32px; border-radius:999px; background:#ecfdf5; display:flex; align-items:center; justify-content:center; color:#047857; }
.page-lead { color:#6b7280; font-size:.92rem; }

/* Arama kartı – yazarlar ile uyumlu (yumuşak köşe) */
.search-card { border-radius: var(--radius); box-shadow: 0 6px 18px rgba(0,0,0,.05); border: 0; }
.search-card.kb-search-card--compact .card-body{ padding: 10px 12px; }
.search-card .form-label { font-size: .95rem; font-weight: 700; color: #38bdf8; letter-spacing: .01em; }
.search-card .form-control::placeholder { color: #374151; opacity: 1; }
.search-card .input-group-text { background: #ecfdf5; color: var(--kb-primary); border-color: #d1fae5; transition: all .15s ease; border-radius:.5rem 0 0 .5rem; }
.search-card .input-group-text .bi-search { font-size: 1.1rem; }
.search-card .form-control { transition: border-color .15s ease, box-shadow .15s ease; border-radius:0 .5rem .5rem 0; }
.search-card .input-group:focus-within .input-group-text { background: #d1fae5; color: #0f766e; border-color: #a7f3d0; }
.search-card .input-group:focus-within .form-control { border-color: var(--kb-primary); box-shadow: 0 0 0 .2rem rgba(22,160,133,.15); }
.search-sticky { position: sticky; top: var(--kb-header-h, 56px); z-index: 1010; }

/* Grid */
.news-grid{ margin-top:14px; display:grid; grid-template-columns:repeat(auto-fill, minmax(310px, 1fr)); gap:18px; justify-content:center; }
@media (max-width:767.98px){ .news-grid{ grid-template-columns:repeat(1, minmax(0,1fr)); } }

/* Card */
.news-card{ background:#ffffff; border-radius:18px; border:1px solid #e5e7eb; box-shadow:0 4px 14px rgba(15,23,42,.04); display:flex; flex-direction:column; overflow:hidden; transition:transform .12s ease, box-shadow .12s ease; }
.news-card:hover{ transform:translateY(-2px); box-shadow:0 8px 26px rgba(15,23,42,.06); }
.news-cover-wrap{ position:relative; background:#e5e7eb; }
.news-cover{ width:100%; aspect-ratio:720/376; object-fit:cover; display:block; }
.news-chip{ position:absolute; left:12px; top:12px; background:rgba(15,23,42,.8); color:#f9fafb; padding:4px 10px; border-radius:999px; font-size:.78rem; display:inline-flex; align-items:center; gap:6px; }
.news-body{ padding:14px 16px 10px; text-align:center; }
.news-title{ font-size:1.2rem; font-weight:700; margin-bottom:8px; line-height:1.3; }
.news-meta{ font-size:.92rem; color:#6b7280; display:flex; justify-content:center; gap:14px; margin-bottom:8px; }
.news-meta i{ font-size:1rem; }
.news-excerpt{
  font-size:1rem;
  color:#4b5563;
  line-height:1.55;
  margin: 0; /* varsayılan <p> alt boşluğunu kaldır (CTA üstündeki gereksiz boşluk) */
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  word-break:break-word;
  overflow-wrap:anywhere;
}
.news-footer{ padding:10px 16px 14px; border-top:1px solid #e5e7eb; display:flex; justify-content:center; align-items:center; }
.news-footer .btn{ display:inline-flex; align-items:center; gap:6px; white-space:nowrap; border-radius:999px; background:var(--kb-primary); border:1px solid var(--kb-primary); color:#ffffff; font-weight:700; font-size:.95rem; box-shadow:0 3px 10px rgba(22,160,133,.22); }
.news-footer .btn:hover{ background:#13856f; border-color:#13856f; color:#ffffff; box-shadow:0 5px 16px rgba(19,133,111,.28); }

/* İş ilanları – sol kapak alanında kullanılan hero kart sarma bloğu */
.kb-job-hero-wrap{
  background:transparent;
  padding:0;
}
.kb-job-hero-wrap .kb-feature-card{
  border-radius:18px; /* news-card ile aynı */
}

/* İş ilanları – chip'ler kartın altına yapışmasın (sadece iş ilanı grid'i) */
.kb-job-grid .kb-job-hero-wrap .kb-feature-card{
  /* Asıl boşluk sebebi: kartın sabit yüksekliği (aspect-ratio). İş ilanlarında kartı biraz kısalt. */
  aspect-ratio: 16 / 6;
  padding-bottom: 16px;
}

/* İş ilanları – kart içindeki chip satırı absolute olduğu için,
   metin/chip büyüyünce içerikle çakışmasın diye altta güvenli alan ayır */
.kb-job-grid .kb-feature-main{
  min-width:0;
  /* Chip satırı bazı ortamlarda hâlâ absolute davranabildiği için (cache/override),
     alt tarafta güvenli alan bırak: yazılar chip'lerin altına girmesin */
  padding-bottom: 0;
}

/* İş ilanları – chip satırını akış içine al (en stabil: üst üste binme/çizgi üstüne binme biter) */
.kb-job-grid .kb-job-hero-wrap .kb-feature-meta{
  position:static !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin-top:12px !important; /* renkli çizgiden net ayrışsın */
  margin-bottom:0 !important;
  justify-content:flex-start;
}

/* İş ilanları – chip metinleri:
   Masaüstünde yan yana dursun; sığmazsa chip'lerden biri alt satıra kaysın ama metin KESİLMESİN. */
.kb-job-grid .kb-feature-meta .kb-pill.muted{
  flex:0 0 auto;
  max-width:100%;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
}

/* İş ilanları – Çalışma Türü + Deneyim chip'lerini tek satırda tut ve biraz küçült */
.kb-job-grid .kb-job-hero-wrap .kb-feature-meta{
  flex-wrap:wrap !important;
  gap:6px;
  align-items:flex-start;
}
.kb-job-grid .kb-job-hero-wrap .kb-feature-meta .kb-pill.muted{
  font-size:.70rem;
  padding:3px 8px;
  letter-spacing:0;
  text-transform:none;
  line-height:1.15;
}
.kb-job-grid .kb-job-hero-wrap .kb-feature-meta .kb-pill.muted i{
  font-size:1rem;
  margin-right:4px;
}

/* İş ilanları sayfası – boşluksuz çok uzun başlıkların kart dışına taşmaması için */
.kb-job-grid .news-title{
  word-break:break-word;
  overflow-wrap:anywhere;
}

/* İş ilanları sayfası – mobilde özel hizalamalar (haber sayfalarını etkilemez) */
@media (max-width: 767.98px){
  /* Sadece iş ilanları grid'i */
  .kb-job-grid .kb-job-hero-wrap .kb-feature-title{
    margin-top:26px;
  }
  /* Sadece iş ilanları grid'indeki kart yüksekliği */
  .kb-job-grid .news-cover{
    /* Çok kısa oran uzun başlık/firma/chip birleşince üst üste binebiliyor */
    aspect-ratio:16/7;
  }

  /* Uzun metinlerde (firma adı / başlık / deneyim seviyesi) üst üste binmeyi engelle */
  .kb-job-grid .kb-feature-main{ min-width:0; padding-bottom:0; }
  /* Kart yüksekliğini mobilde esnet: sabit aspect-ratio + overflow yüzünden chip'ler kesiliyordu */
  .kb-job-grid .kb-feature-card{
    aspect-ratio:auto;
    min-height: 220px;
    padding-bottom: 16px; /* chip satırı kartın altına yapışmasın */
  }
  .kb-job-grid .kb-feature-title{
    white-space:normal;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  .kb-job-grid .kb-feature-subtitle{
    max-width:100%;
    white-space:normal;
    display:-webkit-box;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }
  /* Chip satırını absolute yerine akışa al: kısa kapakta çakışmayı bitirir */
  .kb-job-grid .kb-job-hero-wrap .kb-feature-meta{
    position:static !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    margin-top:8px;
    justify-content:flex-start;
  }

  /* Mobilde chip'ler alt alta: metin kesilmesin, karta nizami otursun */
  .kb-job-grid .kb-job-hero-wrap .kb-feature-meta{
    flex-wrap:wrap !important;
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
  .kb-job-grid .kb-feature-meta .kb-pill.muted{
    flex:0 0 auto;
    max-width:100%;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }
}

/* ==== Özelleştirilebilir bilgi kartı (iş ilanları, kampanyalar vb.) ==== */
.kb-feature-card{
  position: relative;
  border-radius: 22px;
  border: 0;
  padding: 16px 18px 14px;
  background: var(--kb-feature-bg, radial-gradient(circle at 0% 0%, #0f766e 0%, #064e3b 45%, #020617 100%));
  color: #ecfeff;
  box-shadow: 0 22px 60px rgba(15,23,42,.55);
  overflow: hidden;
  width: 100%;
  aspect-ratio: 720/376;
  display:flex;
  flex-direction:column;
}

.kb-feature-card::before{
  content:'';
  position:absolute;
  inset:-30%;
  background: radial-gradient(circle at 0% 0%, rgba(255,255,255,.2) 0, transparent 55%),
              radial-gradient(circle at 110% 10%, rgba(56,189,248,.22) 0, transparent 55%);
  opacity:.55;
  mix-blend-mode: screen;
  pointer-events:none;
}

.kb-feature-card > *{
  position: relative;
  z-index: 1;
}
.kb-feature-card .kb-feature-icon-badge{
  position:absolute;
  top:10px;
  right:12px;
  width:32px;
  height:32px;
  border-radius:999px;
  border:1px solid rgba(248,250,252,.4);
  background:rgba(15,23,42,.78);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#f9fafb;
  box-shadow:0 10px 26px rgba(15,23,42,.55);
  pointer-events:none;
}
.kb-feature-card .kb-feature-icon-badge i{
  font-size:1.3rem;
  line-height:1;
}

.kb-feature-card-link{
  display:flex;
  flex-direction:column;
  gap:10px;
  height:100%;
  color:inherit;
  text-decoration:none;
}

.kb-feature-main{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
}

.kb-feature-kicker{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:18px;
}

.kb-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:999px;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.12em;
  text-transform:uppercase;
  background:rgba(15,23,42,.64);
  color:#e5f6ff;
}
.kb-pill i{
  font-size:.9rem;
  color:#a5f3fc; /* ikonlara hafif turkuaz vurgusu */
}
.kb-pill .dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#22c55e;
  box-shadow:0 0 0 2px rgba(34,197,94,.45);
}
.kb-pill.muted{
  background:rgba(15,23,42,.45);
  color:#e5e7eb;
}
.kb-pill.muted i{
  color:#22c55e; /* çalışma türü / deneyim chip'lerinde ikonlar yeşil */
}

/* İş ilanları – masaüstü görünümünde çalışma türü / deneyim chip'lerini biraz küçült */
@media (min-width: 768px){
  .kb-job-grid .kb-feature-meta .kb-pill.muted{
    font-size:.72rem;
    padding:3px 8px;
  }
  /* Masaüstünde firma adı tek satırda kalsın, taşarsa '...' ile kesilsin */
  .kb-job-grid .kb-feature-subtitle{
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

.kb-feature-title{
  font-size:1.18rem;
  font-weight:500;
  letter-spacing:-0.01em;
  line-height:1.3;
  margin-bottom:4px;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.kb-feature-subtitle{
  font-size:.9rem;
  font-weight:500;
  opacity:.9;
}
.kb-feature-firm-hero{
  position:relative;
  padding-bottom:.5rem;
}
.kb-feature-firm-hero::after{
  content:'';
  position:absolute;
  left:0;
  bottom:0;
  width:72px;
  height:3px;
  border-radius:999px;
  background:linear-gradient(90deg,#3b82f6,#a855f7,#f97316);
}
.kb-feature-excerpt{
  font-size:.98rem;
  line-height:1.6;
  color:rgba(249,250,251,.92);
  margin:4px 0 8px;
}

.kb-feature-meta{
  position:absolute;
  right:18px;
  bottom:12px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  font-size:.82rem;
  color:rgba(226,232,240,.9);
  align-items:center;
}
.kb-feature-meta i{
  margin-right:4px;
}

.kb-feature-footer{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.kb-feature-cta{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(15,23,42,.16);
  border:1px solid rgba(226,232,240,.4);
  font-size:.85rem;
  font-weight:700;
  color:#f9fafb;
}
.kb-feature-cta i{
  font-size:1.2rem;
}
.kb-feature-cta:hover{
  background:rgba(15,23,42,.26);
}

/* Renk temaları – iş ilanları için daha açık tonlar */
.kb-feature-card--teal{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #22c55e 0%, #16a085 38%, #064e3b 100%);
}
.kb-feature-card--emerald{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #4ade80 0%, #22c55e 40%, #065f46 100%);
}
.kb-feature-card--cyan{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #67e8f9 0%, #22c5e5 38%, #0369a1 100%);
}
.kb-feature-card--indigo{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #a5b4fc 0%, #6366f1 40%, #1e293b 100%);
}
.kb-feature-card--amber{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #fed7aa 0%, #f97316 40%, #7c2d12 100%);
}
.kb-feature-card--rose{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #fecdd3 0%, #fb7185 40%, #9f1239 100%);
}
.kb-feature-card--sky{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #e0f2fe 0%, #38bdf8 42%, #075985 100%);
}
.kb-feature-card--lime{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #ecfccb 0%, #a3e635 42%, #4d7c0f 100%);
}
.kb-feature-card--violet{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #ede9fe 0%, #a855f7 40%, #5b21b6 100%);
}
.kb-feature-card--slate{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #f3f4f6 0%, #9ca3af 40%, #1f2937 100%);
  /* Gri varyantta gölgeyi biraz yumuşat */
  box-shadow: 0 16px 40px rgba(15,23,42,.28);
}
.kb-feature-card--pink{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #fce7f3 0%, #f472b6 40%, #9d174d 100%);
}
.kb-feature-card--orange-soft{
  --kb-feature-bg: radial-gradient(circle at 0% 0%, #ffedd5 0%, #fb923c 40%, #7c2d12 100%);
}

.kb-feature-card.is-expired{
  --kb-feature-bg: linear-gradient(135deg, #111827 0%, #020617 100%);
  opacity:.96;
}
.kb-feature-card.is-expired .kb-pill.muted{
  background:rgba(15,23,42,.7);
}

/* Liste görünümünde kart varyantı */
#newsGrid[data-mode="list"] .kb-feature-card{
  padding:14px 18px;
}
#newsGrid[data-mode="list"] .kb-feature-card .kb-feature-card-link{
  flex-direction:row;
  align-items:flex-start;
  gap:14px;
}
#newsGrid[data-mode="list"] .kb-feature-card .kb-feature-main{
  flex:1 1 auto;
  min-width:0;
}
#newsGrid[data-mode="list"] .kb-feature-card .kb-feature-footer{
  margin-left:auto;
  margin-top:0;
}

@media (max-width: 767.98px){
  .news-grid .kb-feature-card{
    padding:14px 14px 12px;
    border-radius:20px;
  }
  .news-grid .kb-feature-card .kb-feature-title{
    font-size:1.12rem;
  }
  #newsGrid[data-mode="list"] .kb-feature-card .kb-feature-card-link{
    flex-direction:column;
    align-items:stretch;
  }
  #newsGrid[data-mode="list"] .kb-feature-card .kb-feature-footer{
    justify-content:flex-start;
    margin-top:6px;
  }
}

/* List Mode */
#newsGrid[data-mode="list"]{ grid-template-columns: 1fr; gap:14px; }
#newsGrid[data-mode="list"] .news-card{ flex-direction: row; align-items: stretch; }
#newsGrid[data-mode="list"] .news-cover{ width: 340px; height: 190px; aspect-ratio: auto; }
#newsGrid[data-mode="list"] .news-body{ text-align: left; padding: 14px 18px 8px; flex:1 1 auto; }
#newsGrid[data-mode="list"] .news-title{ font-size:1.25rem; }
#newsGrid[data-mode="list"] .news-meta{ justify-content: flex-start; }
#newsGrid[data-mode="list"] .news-meta i{ font-size:1.05rem; }
#newsGrid[data-mode="list"] .news-excerpt{ -webkit-line-clamp:2; min-height: unset; }
#newsGrid[data-mode="list"] .news-footer{ justify-content:flex-start; border-top:none; padding: 0 18px 14px; }

/* İş ilanları – list mode'da sol kartın yüksekliği sabitlenmesin (boş alan oluşmasın) */
#newsGrid.kb-job-grid[data-mode="list"] .news-cover.kb-feature-card{
  height:auto;
  min-height: 165px; /* ikon/başlık/chip için güvenli alt sınır */
}

/* Mobile ergonomi */
@media (max-width: 767.98px){
  /* Mobilde, son içerikten sonra alt menü barına kadar rahat kaydırma alanı bırakılır. */
  main { padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); }
  .mobile-bottom-spacer { height: 72px; }
  #newsGrid[data-mode="list"] .news-card{ flex-direction: column; }
  #newsGrid[data-mode="list"] .news-cover{ width:100%; height:auto; aspect-ratio:720/376; }
  #newsGrid[data-mode="list"] .news-body{ padding:12px 12px 8px; }
  #newsGrid[data-mode="list"] .news-title{ font-size:1.22rem; }
  #newsGrid[data-mode="list"] .news-meta{ font-size:.95rem; }
  #newsGrid[data-mode="list"] .news-excerpt{ font-size:1rem; }
  .news-footer{ padding:0 12px 12px; }
  .news-footer .btn{ width:100%; padding:.8rem 1rem; font-size:1.05rem; border-radius:14px; justify-content:center; }

  /* İş ilanları (liste) – mobilde chip'ler yan yana olsun, kart boyu kısalsın */
  #newsGrid.kb-job-grid[data-mode="list"] .news-cover.kb-feature-card .kb-feature-meta{
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    gap:8px;
    align-items:center;
    justify-content:flex-start;
  }
  #newsGrid.kb-job-grid[data-mode="list"] .news-cover.kb-feature-card .kb-feature-meta .kb-pill.muted{
    flex:0 1 auto;
    max-width: calc(50% - 6px);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
}

/* İş ilanları – mobilde kart yüksekliğini gerçekten kısalt (sadece kb-job-grid için) */
@media (max-width: 767.98px){
  /* Mobil listede iş ilanı yeşil kartı: sabit aspect-ratio yüzünden boşluk/kırpılma oluyor.
     Sadece iş ilanlarında, sadece list mode'da içeriğe göre otomatik yükseklik. */
  #newsGrid.kb-job-grid[data-mode="list"] .news-cover.kb-feature-card{
    aspect-ratio:auto !important;
    height:auto !important;
    min-height: 180px;
  }

  /* Mobilde rozet ile başlık arasında gereksiz boşluğu azalt (sadece iş ilanı kartı) */
  #newsGrid.kb-job-grid[data-mode="list"] .news-cover.kb-feature-card .kb-feature-kicker{
    margin-bottom:10px;
  }
  #newsGrid.kb-job-grid[data-mode="list"] .news-cover.kb-feature-card .kb-feature-title{
    margin-top:8px;
  }
}