.pager { margin: 24px 0; overflow-x: auto; text-align: center; }
.pager .pagination,
.pager > ul {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0;
    padding: 0;
    vertical-align: top;
}
.pager .pagination li,
.pager > ul > li { display: block; margin: 0; list-style: none; }
.pager .pagination li a,
.pager .pagination li span,
.pager > ul > li > a,
.pager > ul > li > span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: #fff;
    color: #4b3a22;
    line-height: 1;
}
.pager .pagination li a:hover,
.pager > ul > li > a:hover {
    border-color: var(--primary);
    background: var(--primary-soft);
    color: var(--primary-dark);
    text-decoration: none;
}
.pager .pagination .active span,
.pager > ul > .active > span {
    border-color: var(--primary);
    background: linear-gradient(135deg, var(--primary), #b9791d);
    color: #fff;
}
.pager .pagination .disabled span,
.pager > ul > .disabled > span { background: #f7f5f1; color: #aaa; cursor: not-allowed; }