.header {
  display: grid;
  gap: var(--Spacing-x1);
  grid-template-columns: 1fr;
  align-items: baseline;
}

.title,
.subtitle {
  grid-column: 1 / -1;
}

.linkWrapper {
  display: flex;
  align-items: baseline;
  gap: var(--Spacing-x-half);
  grid-column: 1 / -1;
  justify-self: start;
}

.link {
  display: flex;
  align-items: center;
}

.icon {
  align-self: center;
}

@media screen and (min-width: 768px) {
  .header {
    grid-template-columns: 1fr auto;
  }

  .title {
    grid-column: 1 / 2;
  }

  .subtitle {
    grid-column: 1 / 2;
  }

  .linkWrapper {
    grid-column: 2 / 3;
    justify-self: end;
  }

  .link {
    align-items: baseline;
  }
}