/* Visual thesis: the original character and letterforms act as quiet signatures
   within a dark editorial frame, leaving the garments and photography to lead.
   Content: persistent identity / existing navigation / original-mark signoff.
   Interaction: preserve the existing menu, focus states and page motion. */
.original-wordmark { display: block; flex: none; width: 100%; height: auto; overflow: hidden; }
.header .brand { gap: 11px; flex: none; min-height: 44px; }
.header .brand .brand-astronaut { width: 29px; height: 36px; }
.header .brand .original-wordmark { width: 153px; height: auto; }

.nocturne-footer { padding-bottom: 0; }
.nocturne-footer .image-credit { margin-top: 26px; margin-bottom: 0; }
.footer-brand-signoff {
  margin: 36px 0 0;
  padding: 32px 0 38px;
  border-top: 1px solid #ffffff24;
  color: var(--paper);
}
.footer-brand-signoff > a {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 290px;
  max-width: 100%;
  min-height: 44px;
  color: inherit;
}
.nocturne-footer .footer-brand-signoff > a:hover { color: #f8f6f0; }
.footer-brand-signoff .astronaut-mark { flex: none; width: 36px; height: auto; aspect-ratio: 680 / 830; }
.footer-brand-signoff .original-wordmark { flex: 1; width: 0; min-width: 0; }
.header .brand:focus-visible,
.footer-brand-signoff > a:focus-visible { outline: 2px solid var(--orange); outline-offset: 6px; }

@media (max-width: 1100px) and (min-width: 801px) {
  .header .brand { gap: 10px; }
  .header .brand .brand-astronaut { width: 27px; height: 34px; }
  .header .brand .original-wordmark { width: 143px; }
}

@media (max-width: 800px) {
  .header .brand { gap: 8px; }
  .header .brand .brand-astronaut { width: 23px; height: 30px; }
  .header .brand .original-wordmark { width: 126px; }
  .footer-brand-signoff { margin-top: 30px; padding-block: 25px 30px; }
  .footer-brand-signoff > a { width: 230px; gap: 14px; }
  .footer-brand-signoff .astronaut-mark { width: 30px; }
}

@media (max-width: 370px) {
  .header .brand { gap: 7px; }
  .header .brand .original-wordmark { width: 120px; }
}
