/* ============================================================
   Zip Blitz — brand wordmark
   ============================================================

   Single source of truth for the "Zip Blitz" logotype treatment.
   The brand wordmark is Fraunces 600, all-caps with tracking.

   Usage:
     - Wrap the brand name in <span class="wordmark">Zip Blitz</span>
       OR add `wordmark` to a standalone heading/logo element.
     - DOM content stays "Zip Blitz" (sentence case) so screen readers
       and copy-paste behaviour preserve the canonical capitalisation.
     - CSS applies text-transform: uppercase visually.

   Where NOT to apply:
     - Body sentences ("Back to Zip Blitz", "Sign in to Zip Blitz")
     - <title>, meta og:title, meta description
     - Site manifest / Capacitor appName (OS-level display name)
     - Share-text strings sent via navigator.share / clipboard

   Font-size 0.87em compensates for the fact that uppercase reads
   ~15% larger than title-case at the same px height — so visually
   the wordmark sits at roughly the same weight as the title-case
   it replaces. When applied to a span inside larger text the same
   ratio holds, so the brand mark stays visually proportioned. */

.wordmark {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.065em;
  /* NOTE: font-size deliberately not set here. Caps render ~15%
     visually larger than title case at the same px height, so each
     host context should drop its own font-size by ~15% when adding
     the wordmark class. For inline spans wrapped inside body text,
     add `font-size: 0.87em` on the span directly (or use the
     `wordmark--inline` modifier below). */
}

/* Inline variant — for the brand name embedded inside larger
   sentences/headings (e.g. "Share Zip Blitz" button, "Back to Zip
   Blitz" link). Drops to 87% of parent so the caps don't read
   heavier than the surrounding title-case text. */
.wordmark--inline {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.065em;
  font-size: 0.87em;
}