/* ===== SJS Blog / Archive (sjs-blog) — Indigo + Amber · matches sjs-theme ===== */
.sjs-archive{
  --ink:#0F1530;--muted:#5A6478;--indigo:#1E2A78;--blue:#3B4FC4;--deep:#131B4D;
  --amber:#F59E0B;--amber-soft:#FBBF24;--line:#E4E7F1;--bg:#F7F8FC;--surface:#fff;
  --serif:'Noto Serif Thai',serif;--sans:'IBM Plex Sans Thai',sans-serif;
  font-family:var(--sans);color:var(--ink);line-height:1.75;
}
.sjs-archive *{box-sizing:border-box}
.sjs-archive a{text-decoration:none;color:inherit}

/* ---- page title ---- */
.sjs-archive-title{
  font-family:var(--serif);font-weight:600;font-size:clamp(28px,3.4vw,40px);
  color:var(--ink);text-align:center;margin:8px auto 36px;line-height:1.2;
  position:relative;padding-bottom:18px;
}
.sjs-archive-title::after{
  content:'';position:absolute;left:50%;bottom:0;transform:translateX(-50%);
  width:64px;height:3px;border-radius:3px;
  background:linear-gradient(90deg,var(--indigo),var(--amber));
}

/* ---- grid ---- */
.sjs-post-grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:26px;
}
@media(max-width:980px){.sjs-post-grid{grid-template-columns:repeat(2,1fr);gap:22px}}
@media(max-width:600px){.sjs-post-grid{grid-template-columns:1fr;gap:20px}}

/* ---- card ---- */
.wp-block-post{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:18px;
  overflow:hidden;
  display:flex;flex-direction:column;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.wp-block-post:hover{
  transform:translateY(-6px);
  box-shadow:0 18px 40px rgba(15,21,48,.12);
  border-color:rgba(59,79,196,.35);
}

/* ---- thumbnail ---- */
.sjs-post-thumb{
  margin:0;
  aspect-ratio:16/10;
  overflow:hidden;
  border-bottom:1px solid var(--line);
  background:#eef1fb;
}
.sjs-post-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .3s ease;
}
.wp-block-post:hover .sjs-post-thumb img{transform:scale(1.05)}

/* ---- body wrapper ---- */
.wp-block-post-title,
.wp-block-post-excerpt,
.wp-block-post-date{
  padding-left:20px;padding-right:20px;
}
.wp-block-post-title{
  margin:18px 0 0;
  font-family:var(--serif);
  font-weight:600;
  font-size:19px;
  line-height:1.4;
  color:var(--ink);
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  transition:color .2s ease;
}
.wp-block-post:hover .wp-block-post-title{color:var(--indigo)}
.wp-block-post-title a{color:inherit}

.wp-block-post-excerpt{
  margin:10px 0 0;
  font-size:14px;
  line-height:1.7;
  color:var(--muted);
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  flex-grow:1;
}
.wp-block-post-excerpt__excerpt{margin:0}

.wp-block-post-date{
  margin:16px 0 20px;
  font-size:12.5px;
  font-weight:500;
  color:var(--indigo);
  letter-spacing:.02em;
}
.wp-block-post-date time{display:inline-flex;align-items:center;gap:6px}
.wp-block-post-date time::before{
  content:'';width:14px;height:14px;border-radius:50%;
  background:linear-gradient(135deg,var(--indigo),var(--blue));
  flex-shrink:0;
}

/* ---- pagination ---- */
.wp-block-query-pagination{
  margin-top:40px;gap:8px;
}
.wp-block-query-pagination-numbers .page-numbers,
.wp-block-query-pagination-next{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 12px;
  border-radius:10px;border:1px solid var(--line);
  background:var(--surface);color:var(--ink);font-weight:600;font-size:14px;
  transition:background .18s,color .18s,border-color .18s;
}
.wp-block-query-pagination-numbers .page-numbers:hover,
.wp-block-query-pagination-next:hover{
  border-color:var(--indigo);color:var(--indigo);
}
.wp-block-query-pagination-numbers .page-numbers.current{
  background:linear-gradient(135deg,var(--indigo),var(--blue));
  color:#fff;border-color:transparent;
}
.wp-block-query-pagination-numbers .page-numbers.dots{
  border:none;background:none;min-width:auto;
}