index-main/assets/css/partials/_page-header.scss

main .page__header {
    margin-top: calc(var(--spacing) * 3);
    margin-bottom: calc(var(--spacing) * 2);
  
 
    @media #{$small} {
      margin-top: calc(var(--spacing) * 1);

    }

    .page__type{
margin-bottom: calc(var(--spacing) * 1);
    } 

    .page__title {
      max-width: var(--max-w-content);
      text-transform: uppercase;
      font-weight: normal;
      font-size: var(--fs-medium);
      font-weight: 500;
      line-height: var(--leading-title);
      margin-bottom: calc(var(--spacing) * 2);

       @media #{$small-up} {
      text-wrap: balance;
         }
      
       @media #{$small} {
        margin-bottom: calc(var(--spacing) * 1);
         }
      
    }

    .page__cover{
       margin-top: calc(var(--spacing) * 2);
    }

    .date{
      display: block;
       margin-top: calc(var(--spacing) * -1.5);
      margin-bottom: calc(var(--spacing) * 2);
      color: var(--color-txt-light);
        @media #{$small} {
                margin-bottom: calc(var(--spacing) * 1);
             margin-top: calc(var(--spacing) * -0.75);
         }
    }

    .page__description {
      font-size: var(--fs-text);
      margin-bottom: calc(var(--spacing) * 3);
        @media #{$small} {
           margin-bottom: calc(var(--spacing) * 1.5);
         }
      max-width: var(--max-w-content);
    }

    ul.list-nav{
      display: flex;
      // justify-content: space-between;
      flex-wrap: wrap;
      // gap: 3ch;
      list-style: none;
      margin-top: calc(var(--spacing) * -1.5);
      @media #{$small} {
             margin-top: calc(var(--spacing) * -0.5);
         }
      color: var(--color-txt-light);

      li{
       white-space: nowrap;
       margin-right: 2ch;
       &:last-of-type{
        margin-right: 0;
       }
         @media #{$small} {
       width: 12ch;
        }
       margin-bottom: calc(var(--spacing) * 0.25);
      }

      a{
        text-decoration: none;
        text-transform: lowercase;
        &::after{
          content: " ↓";
        }
      }
      li:hover{
        color: var(--color-txt)
      }

    }


   
}