/* Frontend styles with per-section columns */
.woghb-hero .woghb-card { display:block; }
.woghb-card { display:block; }
.woghb-card__thumb { display:block; aspect-ratio: 16 / 9; overflow:hidden; border-radius:14px; }
.woghb-card__thumb img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; }
.woghb-card__thumb:hover img { transform:scale(1.03); }
.woghb-card__meta { margin-top:.6rem; }
.woghb-card__cat { font-size:.78rem; text-transform:uppercase; opacity:.7; }
.woghb-card__title { font-size:1.1rem; line-height:1.25; margin:.2rem 0 0; }

.woghb-section { margin: 2.2rem 0; }
.woghb-section__header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.woghb-section__header h2 { margin:0; font-size:1.4rem; }

/* grid base, columns controlled via modifiers */
.woghb-grid { display:grid; gap:18px; grid-template-columns: repeat(3, 1fr); }
.woghb-cols-2 { grid-template-columns: repeat(2, 1fr); }
.woghb-cols-3 { grid-template-columns: repeat(3, 1fr); }
.woghb-cols-4 { grid-template-columns: repeat(4, 1fr); }

/* HERO larger */
.woghb-hero .woghb-card__title { font-size:1.6rem; }
.woghb-hero { margin-bottom:2rem; }
.woghb-hero .woghb-card__thumb { aspect-ratio: 21 / 9; }

/* responsive */
@media (max-width: 1024px) {
  .woghb-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .woghb-hero .woghb-card__thumb { aspect-ratio: 16 / 9; }
}
@media (max-width: 640px) {
  .woghb-grid { grid-template-columns: 1fr !important; }
  .woghb-hero .woghb-card__title { font-size:1.3rem; }
}
.woghb-card__placeholder { width:100%; height:100%; background:#f2f2f2; }