/* Navigation */
.masthead .navigation a[aria-current] {
  background-color: var(--color-hover);
  color: var(--color-dark-type);
}
.masthead .navigation a:focus-visible {
  background-color: #1010b7;
}

@media (hover: hover) {
  .masthead .navigation a:hover {
    background-color: #1010b7;
  }
    .masthead .navigation a[aria-current]:hover {
      background-color: #1010b7;
    }
}

@view-transition {
  navigation: auto;
}

/* home */
@media (hover: hover) {
  .home figure figcaption a:hover,
  .home__currently a:hover,
  .project__link:hover,
  .home figure figcaption a:focus-visible {
    text-decoration: underline;
  }
  .home__currently a:focus-visible {
    background-color: var(--color-hover);
    color: var(--color-dark-type);
  }
}

/* Project */
.project__link:focus-visible,
.project__info a:focus-visible {
  background-color: var(--color-hover);
  color: var(--color-dark-type);
}
.project__nav .work__list a[aria-current="true"]:focus-visible {
  background-color: var(--color-hover);
}
.project__nav .work__list a[aria-current="true"]:focus-visible::after {
  border: 2px solid var(--color-hover);
  background-color: transparent;
}

/* Footer */
.siteFooter__top {
  align-self: center;
  grid-column: 2 / 4;
  grid-row: 5;
  font-size: 1.4rem;
  font-weight: 700;
  text-decoration: underline;
}
.siteFooter__top:focus-visible {
  background-color: var(--color-hover);
  color: var(--color-dark-type);
}
.siteFooter__navigation {
  background-color: var(--color-dark);
  color: var(--color-dark-type);
  grid-column: 10 / 14;
  grid-row: 5;
  padding: 1rem;
  text-align: end;
}
.siteFooter .navigation ul, .siteFooter__tertiary ul {
  display: flex;
  gap: .8rem;
  font-size: 1.4rem;
  justify-content: end;
  font-weight: 300;
  margin-bottom: .7rem;
}
.siteFooter .navigation ul a[aria-current="true"] {
  font-weight: 700;
}
.siteFooter__tertiary ul {
  font-size: 1.2rem;
}
.siteFooter__update {
  font-size: 1.2rem;
}
.siteFooter ul a:focus-visible {
  border-bottom: thin solid var(--color-hover);
}

@media (hover: hover) {
  .siteFooter ul a:hover {
    border-bottom: thin solid var(--color-hover);
  }
}

@media screen and (max-width: 960px) {
  .siteFooter__navigation {
    background-color: transparent;
    color: var(--color-type);
    grid-column: 8 / 14;
    text-align: end;
    padding: 1rem 0;
  }
  .siteFooter__secondary ul, .siteFooter__tertiary ul {
    justify-content: flex-end;
  }
}

@media screen and (max-width: 730px) {
  .siteFooter {
    padding: 3.6rem 0;
  }
  .siteFooter__top {
    grid-column: content;
    grid-row: 1;
    text-align: end;
    padding: 1rem 0;
  }
  .siteFooter__navigation {
    grid-column: content;
    grid-row: 2;
    padding: 0;
  }
  .siteFooter .navigation ul { margin: 0; }
  .siteFooter .navigation a, .siteFooter nav a {
    border-bottom: thin solid transparent;
    display: block;
    padding: 1.25rem 0;
  }
}
