.skirt-wrapper {
  width: 100%;
  background-color: var(--grey-mystic); /* Background sits here now, stretching edge-to-edge */
}

.skirt {
  column-width: 150px;        /* Ideal minimum width for each column lane */
  column-count: 5;            /* HARD LIMIT: Never allow more than 5 columns */
  
  /* 2. SPACING: Clean horizontal gap between your columns */
  column-gap: 4rem;
 /* display: grid;
  gap: 0.2rem 4rem; 
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));*/
  max-width: calc((150px * 5) + (4rem * 4) + 2rem); /* Hard ceiling of 5 columns */
  margin: 0 auto;        
  padding: 1.0rem 1.0rem;     
  box-sizing: border-box;  
  list-style: none;
  align-items: center;
}

.skirt a {
  display: block;     /* Acts as a solid block container */
  text-decoration: none;
  width: 100%;               /* Fills its column lane */
  break-inside: avoid;       /* Direct instruction: never break a link block in half */
  margin-bottom: 0.2rem;       /* This controls your vertical spacing cleanly! */
  color: var(--text-color);
    white-space: nowrap;       
    overflow: hidden;
    text-overflow: ellipsis;
}
