/*************************
 # COMPONENT: SITE HEADER
 *************************/

.site-header {
  font-size: var(--text-xxl);
  margin-block-start: var(--space-xl);
  padding-block-end: var(--space-xl);
}

.site-header__content {
  gap: var(--space-l);

  .site-header__title {
    font-family: var(--font-family-heading);
    font-size: var(--text-xxl);
    font-weight: 600;
    letter-spacing: 0.05em;

    a:hover {
      text-decoration: none;
    }
  }

  .site-header__nav {
    font-size: var(--text-s);
    font-weight: normal;

    ul {
      display: flex;
      gap: var(--space-xs);
      list-style: none;
      margin: 0;
      padding: 0;

      li {
        margin: 0;
        padding: 0;
      }

      li:not(:first-child)::before {
        content: "•";
      }
    }
  }
}