/* === สไตล์การ์ดกริด (ออโต้) สำหรับสวรรค์789 === */
:root{
  --sawan-primary: #4e54c8;   /* fallback */
  --sawan-accent:  #ffb347;   /* fallback */
  --card-radius:   16px;      /* fallback */
  --card-shadow:   0 4px 16px rgba(0,0,0,.08);
  --card-shadow-h: 0 12px 28px rgba(0,0,0,.12);
  --card-bg:       #ffffff;
  --card-text:     #111;
  --muted-text:    #555;
  --muted-2:       #777;
}

.container, main.container{ max-width: 1100px; margin: 0 auto; padding: 24px 16px; }
.section-title{ text-align:center; font-weight:700; margin: 8px 0 4px; color:var(--card-text); }

.main-sections{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  justify-content:center;
  margin: 1.25rem auto 1.75rem;
  max-width: 1200px;
  padding: 0 1rem;
}
.section-card{
  background: var(--card-bg);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
  padding:1rem 1.1rem 1.25rem;
  text-align:center;
  transition: transform .2s, box-shadow .2s;
  display:flex;
  flex-direction:column;
  align-items:center;
  min-height: 320px;
}
.section-card:hover{ transform: translateY(-6px); box-shadow: var(--card-shadow-h); }
.section-card .thumb{
  width: 100%; height: 180px; border-radius: calc(var(--card-radius) - 4px);
  object-fit:cover; margin-bottom:.75rem; background:#f5f5f5;
}
.section-card h2{ font-size:1.15rem; margin:.4rem 0 .25rem; }
.section-card h2 a{ color:var(--card-text); text-decoration:none; }
.section-card h2 a:hover{ color: var(--sawan-accent); }
.section-card p{ color:var(--muted-text); font-size:.95rem; margin:0; }
.grid-meta{ margin-top:.75rem; font-size:.85rem; color:var(--muted-2); }

.pagination{ margin: 2rem 0; display:flex; justify-content:center; }
.pagination .page-numbers{
  display:inline-block; padding:.5rem .75rem; margin:.2rem; border-radius:8px;
  text-decoration:none; background:#f5f5f5; color:#333;
}
.pagination .current{ background: var(--sawan-primary); color:#fff; }