.brand-lockup {
  max-width: 520px;
}

.wordmark {
  color: #c9a873;
  text-transform: uppercase;
  line-height: 0.92;
}

.wordmark span {
  display: block;
  font: 400 clamp(28px, 3vw, 45px)/0.95 "Libre Caslon Display", serif;
  letter-spacing: 0.025em;
}

.wordmark strong {
  display: block;
  margin-top: 8px;
  font: 400 clamp(18px, 1.8vw, 27px)/1 "Libre Caslon Display", serif;
  letter-spacing: 0.22em;
}

.top-tagline {
  margin: 17px 0 0;
  padding-top: 13px;
  border-top: 1px solid rgba(201, 168, 115, 0.52);
  color: rgba(255, 255, 255, 0.78);
  font-size: 11px;
  line-height: 1.45;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

@media (max-width: 720px) {
  header {
    align-items: flex-start;
    gap: 24px;
  }

  .brand-lockup {
    max-width: 230px;
  }

  .wordmark span {
    font-size: 26px;
  }

  .wordmark strong {
    font-size: 17px;
    letter-spacing: 0.18em;
  }

  .top-tagline {
    font-size: 8px;
    letter-spacing: 0.1em;
  }
}