/* ==========================================================================
   Wordmark — "Nikolaos Roufas", set in Cormorant Garamond.
   Shared by the homepage (.topnav) and the blog (.site-nav) so the mark is
   identical everywhere. Colours come from each page's own theme variables
   (--text, --accent), so light and dark mode follow automatically.
   The first name is set in the regular weight, the family name in semibold:
   a quiet contrast that keeps the name readable as one unit.
   Selectors are scoped to both navs so generic link styles (e.g. `.blog a`)
   cannot recolour or underline the mark.
   ========================================================================== */

:is(.topnav, .site-nav) .wordmark {
  display: inline-flex;
  align-items: baseline;
  gap: 0.28em;
  font-family: "Cormorant Garamond", "Cormorant", Garamond, "EB Garamond", "Iowan Old Style", Georgia, serif;
  font-size: 23px;
  line-height: 1;
  letter-spacing: 0.012em;
  color: var(--text);
  text-decoration: none;
  white-space: nowrap;
  font-kerning: normal;
  font-feature-settings: "kern" 1, "liga" 1, "onum" 1;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:is(.topnav, .site-nav) .wordmark .wm-first {
  font-weight: 400;
  letter-spacing: 0.02em;
}

:is(.topnav, .site-nav) .wordmark .wm-last {
  font-weight: 600;
  letter-spacing: 0.006em;
}

:is(.topnav, .site-nav) .wordmark:hover,
:is(.topnav, .site-nav) .wordmark:hover .wm-first,
:is(.topnav, .site-nav) .wordmark:hover .wm-last {
  color: var(--accent);
  text-decoration: none;
}

@media (prefers-reduced-motion: no-preference) {
  :is(.topnav, .site-nav) .wordmark { transition: color 0.15s ease; }
}

@media (max-width: 640px) {
  :is(.topnav, .site-nav) .wordmark { font-size: 21px; }
}