.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 32px 0 16px;
}

.pagination a,
.pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  font-size: 0.875rem;
  color: #444;
  background: #fff;
  transition: background 0.12s, border-color 0.12s;
}

.pagination a {
    margin: 0 4px;
    text-decoration: none;
}

.pagination strong {
    margin: 0 4px;
    font-weight: bold;
}
.pagination a:hover { background: #f0f4fa; border-color: #b8cce8; color: #0f6fd1; text-decoration: none; }
.pagination span.current { background: #0f6fd1; border-color: #0f6fd1; color: #fff; font-weight: 600; }
.pagination span.dots { border: none; background: none; color: #aaa; }
.pagination a.prev, .pagination a.next { font-size: 0.8rem; padding: 0 12px; }

@media (max-width: 480px) {
  .pagination a, .pagination span { min-width: 32px; height: 32px; font-size: 0.8rem; }
}