/* Pages of the news and project lists (2026-10-26, system/library/pagination_news.php): 1 2 ... 4 5 6 ... 10 11, no arrows;
   the page you are on in the site's muted white with a pencil line under it; tap targets 44px high. */
.new-pagination .pag-list{align-items:center;gap:0 2px}
.new-pagination .pag-list li,.new-pagination .pag-list li:not(:last-of-type){margin:0;color:#939393}
.new-pagination .pag-list li>a,.new-pagination .pag-list li>span{position:relative;display:flex;align-items:center;justify-content:center;min-width:34px;height:44px;padding:0 4px;color:inherit;font-variant-numeric:tabular-nums}
.new-pagination .pag-list li.active,.new-pagination .pag-list li:hover{color:rgba(255,255,255,.8)}
.new-pagination .pag-list li.active>span:after{content:"";position:absolute;left:50%;bottom:9px;width:14px;margin-left:-7px;border-top:1px solid currentColor}
.new-pagination .pag-list .pag-gap{letter-spacing:.1em}
.light .new-pagination .pag-list li,.light .new-pagination .pag-list li:not(:last-of-type){color:#646464}
.light .new-pagination .pag-list li.active,.light .new-pagination .pag-list li:hover{color:#151515}
/* phones: the whole row (up to eleven places) fits the narrowest column */
@media screen and (max-width:767px){
  .new-pagination .pag-list{gap:0}
  .new-pagination .pag-list li>a,.new-pagination .pag-list li>span{min-width:28px;padding:0 2px}
}
@media screen and (min-width:768px){
  .new-pagination .pag-list{gap:0 20px}
}

/* Portfolio sections on phones (2026-10-26, Commercial added as the fourth): the tabs wrap onto a second line instead of a
   sideways strip, so every section and the one you are in stay in view. The news sections keep their strip. */
@media screen and (max-width:767px){
  .new-project-page .filter-holder.scroll-text{overflow:visible}
  .new-project-page .filter-holder .filter-list{flex-wrap:wrap;gap:12px 14px}
  .new-project-page .filter-holder .filter-list li{margin-right:0}
}