/* Shared UI: site-wide brand fonts and the canonical primary-button style.
   Linked from every page in backend/public/ that declares its own
   --font-display / --font-body / .btn (see each page's own <style> block
   for page-specific colours and variants such as .btn-gold, .btn-ghost).

   FONTS
   Previously, Space Grotesk and Inter were only ever loaded by
   loadFunctionalServices() in index.html, and only after a visitor
   accepted "Functional" cookies - every other page silently fell back to
   system-ui. That is fixed here by loading both typefaces unconditionally
   (no consent gate) for every page that links this file.

   Inter is self-hosted from the real .woff2 files already checked into
   backend/public/fonts (the same files backend/services/propertyPagesService.js
   serves for the house-prices pages as "HP Inter") - reused here rather
   than re-downloaded. font-display:optional matches house-prices.css's
   choice: a slow font is simply skipped for that paint, so nothing
   reflows later (the documented reason nav-component.css keeps its own
   hardcoded system font stack for the header).

   No Space Grotesk .woff2 exists anywhere in this repo (only referenced,
   never added), and inventing/adding a new binary font file is out of
   scope for this change, so Space Grotesk is loaded unconditionally from
   Google Fonts instead, with display=swap (the standard behaviour for a
   normal static font link - still strictly better than the previous
   gated/JS-injected approach). If real Space Grotesk .woff2 files are
   ever added to backend/public/fonts, this @import can be replaced with
   self-hosted @font-face rules the same way Inter is done below. */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&display=swap');

@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: optional;
}
@font-face {
  font-family: 'Inter';
  src: url('/fonts/Inter-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: optional;
}

:root {
  --font-display: 'Space Grotesk', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;
}

/* BUTTONS
   The canonical primary-button metrics, matching the majority
   implementation (Group A in the investigation: app.html, blog.html and
   most other content pages). Not !important, so a more specific rule
   (nav-component.css's #navAuthArea .btn override, a page's own
   .btn-secondary/.btn-outline/.btn-lg variant, or workspace.html's
   .btn-primary once aliased to these same custom properties) still wins
   through normal CSS specificity. */
.btn {
  display: inline-block;
  border: none;
  border-radius: 99px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  font-family: var(--font-body);
}