/* Dynamic logo — auto-loaded for the logo snippet (site/snippets/layout/logo.php) */

.logo {
  display: inline-flex;
  align-items: baseline;
  font-family: var(--font-display);
  font-size: var(--fs-wordmark);
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.logo:hover { text-decoration: none; }

.logo__letter {
  display: inline-block;
  /* Resting values shown before JS runs / when reduced-motion is preferred. */
  font-variation-settings: "wght" 20, "srff" 100, "ital" 0, "nvgn" 0;
}
.logo__letter--gap { margin-right: 0.35em; }  /* word break: DESIGN | STUDIES */

/* Optical centring in the head bar (below 60rem): the letters move down by
   the whole --optical-shift, without moving anything else. */
@media (max-width: 60rem) {
  .logo { translate: 0 var(--optical-shift); }
}

@media (max-width: 48rem) {
  .logo { font-size: 1.375rem; }
}