/* Richway Blog Templates – shared styles */

/* Containers */
.kbs-archive .container,
.kbs-single .container,
.kbs-breadcrumbs-wrap .container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Breadcrumbs */
.kbs-breadcrumbs-wrap{ background:#F8F6F3; margin:0 !important; }
.kbs-breadcrumbs-wrap .container{
  padding:12px 20px;
  display:flex; flex-wrap:wrap; gap:4px;
  font-size:.9rem;
}
.kbs-breadcrumbs-wrap a{ color: var(--kbs-brand, #f97316); text-decoration:none; }

/* Hero */
.kbs-hero { position: relative; margin: 0; padding: 0 !important; }
.kbs-hero-inner { background: #E5E5E5 !important; text-align:center; padding-top:70px; padding-bottom:70px;}
.kbs-hero-title { font-size:2.4rem; font-weight:800; margin:0 0 14px; }
.kbs-hero-sub { max-width:680px; margin:0 auto; font-size:1.05rem; }

/* Grid */
.kbs-grid {
  margin-top: 32px;
  margin-bottom: 32px;
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 1024px){ .kbs-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 640px){ .kbs-grid{ grid-template-columns: 1fr; } }

/* Cards */
.kbs-card {
  background: #F8F6F3 !important;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  box-shadow: 0 6px 24px rgba(0,0,0,.06);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform .18s ease, box-shadow .18s ease;
  min-height: 280px;
}
.kbs-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
}
.kbs-card-thumb{
  display:block; position:relative; overflow:hidden;
  border-radius:14px 14px 0 0;
}
.kbs-card-thumb img{
  display:block; width:100%; height:auto;
  aspect-ratio: 16 / 9; object-fit: cover;
  transition: transform .35s ease;
}
.kbs-card:hover .kbs-card-thumb img{ transform: scale(1.03); }
.kbs-card-thumb--ph{
  width:100%; aspect-ratio:16/9; background:#e5e7eb;
  border-radius:14px 14px 0 0;
}

.kbs-card-body { padding: 16px 16px 20px; }

/* Multi category badges */
.kbs-badges{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.kbs-badge {
  display:inline-block; padding: 0.4rem 1rem;
  border-radius: 999px;
  font-size: 0.85rem; font-weight: 500;
  background: #fff; border: 1px solid #e0e0e0;
}

/* Title & excerpt */
.kbs-card-title {
  font-size: clamp(1.2rem, 2.2vw, 1.35rem);
  font-weight: 700;
  line-height: 1.35;
  margin: 4px 0 8px;
}
.kbs-card-title a { text-decoration:none; color: inherit; }
.kbs-card-excerpt {
  color: #374151;
  line-height: 1.65;
  font-size: 1rem;
  margin-bottom: 24px;
  padding-right: 4px;
}

/* CTA */
.kbs-card-more {
  align-self: flex-start;
  margin-top: auto;
  padding: 0 !important;
  font-weight: 600 !important;
  border: none !important;
  background: none !important;
  color: var(--kbs-brand, #f97316) !important;
  text-decoration: underline !important;
  border-radius: 0 !important;
  font-size: 1rem;
}

/* Pagination */
.kbs-pagination{
  display:flex; gap:8px; flex-wrap:wrap; align-items:center; justify-content:center;
  padding: 8px 0 64px;
}
.kbs-pagination a, .kbs-pagination span{
  padding:8px 12px; border:1px solid #e5e7eb; border-radius:10px; text-decoration:none;
}
.kbs-pagination .current{ background:#fff4eb; border-color:var(--kbs-brand, #f97316); font-weight:600; }

/* Filter bar */
.kbs-archive-filters-wrap{
  background:#F8F6F3;
  padding:16px 0;
  margin-top:-1px;
  overflow-x:auto;
}
.kbs-archive-search{
  display:flex; gap:12px; flex-wrap:nowrap; padding:0 20px; align-items:center;
}
.kbs-archive-search strong{ flex-shrink:0; font-weight:500; }
.kbs-archive .kbs-badge{ padding:.65rem 1.2rem; border-radius:999px; background: transparent; white-space:nowrap; transition:.2s ease; border:1px solid #ddd; font-weight:500; text-decoration:none; display:inline-block; }
.kbs-badge--active{ background: var(--kbs-brand, #f97316); color:#fff; border-color: var(--kbs-brand, #f97316); }

/* Single: layout */
.kbs-article-grid { display:grid; grid-template-columns: minmax(0,1fr) 320px; gap:32px; padding-bottom:100px; }
@media (max-width: 1024px){
  .kbs-article-grid{ grid-template-columns: 1fr !important; }
  .kbs-toc{ order: 2 !important; margin-top: 40px !important; }
}
.kbs-article-title{ font-size:2rem; font-weight:800; margin-bottom:10px; }
.kbs-back{ display:inline-block; margin:32px 0 0; padding:8px 12px; font-weight:500; background:#fff; border:1px solid #ddd; border-radius:999px; text-decoration:none; box-shadow:0 4px 20px rgba(0,0,0,.06); }
.kbs-article-content p{ line-height:1.7; margin-bottom:1.2em; }

/* TOC */
.kbs-toc-inner {
  background: #F8F6F3;
  border-radius: 14px;
  padding: 20px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, .06);
  border: 1px solid rgba(0, 0, 0, .06);
  position: sticky;
  top: 100px;
  max-height: 70vh;
  overflow-y: auto;
  scrollbar-width: thin;
}
.kbs-toc-inner::-webkit-scrollbar { width: 6px; }
.kbs-toc-inner::-webkit-scrollbar-thumb { background: rgba(0,0,0,.15); border-radius:8px; }
.kbs-toc-title { font-weight:700; font-size:1.05rem; margin-bottom:10px; }
.kbs-toc-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:4px; font-size:.94rem; }
.kbs-toc-list a{ text-decoration:none; border-left:2px solid transparent; padding:4px 6px 4px 10px; display:block; transition:all .2s ease; }
.kbs-toc-list a.is-active{ border-left-color: var(--kbs-brand, #f97316); background:#fff4eb; border-radius:8px; }
.kbs-toc-list .toc-h3 a{ padding-left:20px; font-size:.9rem; opacity:.9; }