Making gap between links smaller?

How to make the gap between these links smaller? I've tried adjusting in several ways but can't seem to get the gap smaller than it is currently. For reference my site URL is: http://choypingclarkeng.com/

Thanks!

This is what my custom CSS looks like:

.portfolio-hover-items {
    padding-top: 130px !important; /* Set the padding-top to 130px */
}

body {
    font-family: 'Noto Sans SC', 'Microsoft YaHei', sans-serif
}

@font-face {
font-family: 'PEARL';
src: url('https://static1.squarespace.com/static/6058a6f3664b9e2e27456e5c/t/6579c8844285d33df676dfe1/1702480005051/TAN-PEARL.ttf');
 } 

h1, h2 {
  font-family: 'PEARL';
}

span.portfolio-hover-item-content {
  font-size: 45px;
  font-family: 'PEARL'
}

//DESKTOP//
@media only screen and (min-width: 768px) {
    .portfolio-hover[data-horizontal-align="center"][data-mode="hover-cover"] .portfolio-hover-item-title {
        padding: 0.01em; /* Apply the padding adjustment */
    }
}

//MOBILE//
.header-menu-nav-item a {
  font-size: 30px;
  margin: 4rem 0;
  font-family: 'PEARL'
}

.header-layout-nav-right .header-nav {
text-align: center;
}

span.portfolio-hover-item-content {
  font-size: 40px;
  line-height: 1px;
}