/* Mega Category List (MCL) v1.3 */
:root{ --mcl-font: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
       --mcl-title-fs: 22px; --mcl-excerpt-fs: 15px; --mcl-thumb-w: 360px; --mcl-thumb-h: 200px; }
.mcl-list{ display:grid; gap:16px; font-family: var(--mcl-font); }
.mcl-item{ display:flex; gap:16px; border-bottom:1px solid rgba(0,0,0,.08); padding-bottom:16px; }
.mcl-thumb-link{ display:inline-block; line-height:0; }
.mcl-thumb{ position:relative; display:block; border-radius:12px; overflow:hidden; background:#f1f3f5; box-shadow: 0 1px 2px rgba(0,0,0,.06); width:var(--mcl-thumb-w); height:var(--mcl-thumb-h); }
.mcl-thumb-img{ width:100%; height:100%; object-fit:cover; display:block; background:#e9ecef; }
.mcl-badge-views{ position:absolute; left:8px; top:8px; font-size:.75rem; line-height:1; padding:6px 8px; background:rgba(0,0,0,.7); color:#fff; border-radius:999px; display:flex; align-items:center; gap:6px; }
.mcl-eye{ display:inline-block; transform: translateY(-1px); }
.mcl-meta{ flex:1 1 auto; }
.mcl-cat-label{ font-size:.75rem; font-weight:700; letter-spacing:.04em; color:#6c757d; margin:0 0 4px 0; }
.mcl-h3{ margin:0 0 6px 0; font-size:var(--mcl-title-fs); line-height:1.25; color: var(--mcl-title-color, #0d6efd); font-weight:700; }
.mcl-title{ color: inherit; }
.mcl-excerpt{ color:#444; margin-bottom:8px; font-size:var(--mcl-excerpt-fs); }
.mcl-footer{ font-size:.875rem; color:#666; display:flex; gap:12px; align-items:center; }
.mcl-pagination ul{ list-style:none; display:flex; gap:8px; padding:0; margin:8px 0 0 0; }
.mcl-pagination a, .mcl-pagination span{ padding:6px 10px; border:1px solid #ddd; border-radius:8px; text-decoration:none; }
.mcl-pagination .current{ background:#0d6efd; border-color:#0d6efd; color:#fff; }

@media (max-width: 680px){
  .mcl-item{ flex-direction:column; }
  .mcl-thumb{ width:100%!important; height:180px!important; }
}
