/* Original Vitalo7 wordmark construction from the live site's main.css.
   Preserve Jost weight, tracking, apex A and deep-mint 7 as one identity.
   This is deliberately independent of the campaign typography. */
@font-face {
  font-family: Jost;
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('assets/fonts/jost-300.ttf') format('truetype');
}
@font-face {
  font-family: Jost;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/jost-400.ttf') format('truetype');
}
.wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
  font-family: Jost, sans-serif;
  font-weight: 300;
  font-size: 1.35rem;
  letter-spacing: .24em;
  color: var(--page-fg);
  text-decoration: none;
  white-space: nowrap;
}
.wordmark:hover { text-decoration: none; }
.wordmark .wm-a {
  width: .62em;
  height: .66em;
  overflow: visible;
  margin: 0 .055em 0 .02em;
  transform: translateX(-.09em);
}
.wordmark .wm-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.wordmark .wm-7 {
  color: var(--mint-deep);
  font-weight: 400;
  letter-spacing: 0;
  margin-left: .04em;
}

/* The wordmark sits on the page background, so it follows the theme. The deep
   mint of the 7 is tuned for a light surface and goes almost black on a dark one. */
:root[data-theme="dark"] .wordmark .wm-7 { color: var(--mint); }
