/* ==========================================================================
   CROSSMAP REVIEWS — GLOBAL FONT SYSTEM
   Version: 1.0
   --------------------------------------------------------------------------
   Font Pair: Saira (Display) + Barlow (Body/UI)

   ROLE MAP:
   --cm-font-display    → Saira SemiBold/Bold/ExtraBold
                          Movie titles, H1, H2, section headers, card titles

   --cm-font-condensed  → Saira Condensed
                          Metadata badges, rating pills, labels, cert badges,
                          compact data rows

   --cm-font-body       → Barlow Regular / Italic
                          Synopses, review prose, comments, descriptions,
                          all paragraph-length reading

   --cm-font-ui         → Barlow Medium / SemiBold
                          Buttons, nav items, form labels, TOC links,
                          interactive element text

   WEIGHT GUIDE:
   Saira          400 = Regular  |  500 = Medium  |  600 = SemiBold
                  700 = Bold     |  800 = ExtraBold
   Saira Cond.   400 = Regular  |  500 = Medium   |  600 = SemiBold
                  700 = Bold
   Barlow         300 = Light    |  400 = Regular  |  500 = Medium
                  600 = SemiBold |  700 = Bold
                  400i = Italic (for quote/emphasis)

   RULES:
   ✓ This is the ONLY file permitted to @import from Google Fonts.
   ✓ Always use the CSS variables below — never hardcode a font-family.
   ✓ This file is enqueued globally before all other stylesheets.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Saira:wght@400;500;600;700;800&family=Saira+Condensed:wght@400;500;600;700&family=Barlow:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

/* --------------------------------------------------------------------------
   Font Custom Properties
   -------------------------------------------------------------------------- */
:root {
    --cm-font-display:   'Saira', sans-serif;
    --cm-font-condensed: 'Saira Condensed', sans-serif;
    --cm-font-body:      'Barlow', sans-serif;
    --cm-font-ui:        'Barlow', sans-serif;
}

/* --------------------------------------------------------------------------
   Global Baseline
   Sets Barlow as the inherited default for all elements.
   Specific components override via the variables above.
   -------------------------------------------------------------------------- */
body {
    font-family: var(--cm-font-body);
}