/**
 * assets/css/fonts.css
 *
 * Self-hosted webfonts + base typography.
 * Class C §2/§3: fonts are bundled locally — no external font CDN request,
 * no data leaves the visitor's browser to a third party on page load.
 *
 * FONT STACK
 * ----------
 * Primary: Google Sans Flex — two variable-font subsets (65 KB + 29 KB):
 *   google-sans-flex-body.woff2    — wdth=100, wght 300-700 variable, latin+latin-ext
 *   google-sans-flex-heading.woff2 — wdth=120, wght=700 static,       latin+latin-ext
 * Both generated via fontTools.varLib.instancer from the full variable TTF source.
 * No unicode-range splitting needed — each file covers all required codepoints.
 * Fallback: Inter (loads if Google Sans Flex fails; visually near-identical).
 * System fallback: standard sans stack (instant render before fonts load).
 *
 * WIDTH AXIS NOTE
 * --------------
 * The Figma headings use wdth=120 (expanded). The heading file is pinned there
 * and registered as 'Google Sans Flex Expanded', routed via --font-sans-expanded.
 * Body text uses the body file (wdth=100) via --font-sans; CSS font-weight values
 * 300/400/600/700 are interpolated from the wght axis at runtime — no separate
 * file per weight required.
 *
 * font-display: swap — text shows immediately in the fallback font, then swaps
 * to Google Sans Flex when it loads. No invisible-text flash (FOIT).
 *
 * @package AICenterwp
 * @since   1.0.2
 */

/* ==========================================================================
   @FONT-FACE — Google Sans Flex (primary)
   ========================================================================== */

/* Body — variable weight (wdth=100, wght 300-700), full latin+latin-ext, 65 KB */
@font-face {
    font-family: 'Google Sans Flex';
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url('../fonts/google-sans-flex-body.woff2') format('woff2');
}

/* Heading — static (wdth=120 expanded, wght=700), full latin+latin-ext, 29 KB */
@font-face {
    font-family: 'Google Sans Flex Expanded';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/google-sans-flex-heading.woff2') format('woff2');
}

/* ==========================================================================
   @FONT-FACE — Inter (fallback)
   ========================================================================== */

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

/* ==========================================================================
   FONT TOKENS + BASE TYPOGRAPHY
   ========================================================================== */

:root {
    --font-sans: 'Google Sans Flex', 'Inter', -apple-system, BlinkMacSystemFont,
                 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    /* Expanded (wdth 120) stack for headings — falls back to the normal-width
       face, then Inter, if the expanded woff2 fails to load. */
    --font-sans-expanded: 'Google Sans Flex Expanded', 'Google Sans Flex',
                 'Inter', -apple-system, BlinkMacSystemFont,
                 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    /* Design tokens — read from Figma file MIC 2, frame "visas ziņas" (113:44)
       and component "Menu LAT blue" (108:85). These are the AUTHORITATIVE
       values; keep theme.json in sync with them. */
    --color--base-foreground:        #01162a; /* dark navy — footer bg */
    --color--base-foreground-2:      #000000; /* card excerpt body text (Figma 113:99) */
    --color--base-foreground-3:      #8a94a6; /* hints / captions */
    --color--base-background:        #c6c8d4; /* PAGE BACKGROUND — lavender-grey (NOT white) */
    --color--base-surface:           #c6c8d4; /* same lavender-grey section bg */
    --color--base-surface-2:         #aeb4c1; /* card image placeholder grey (Figma 113:97) */
    --color--base-border:            #7189bd; /* card rule / dividers read as periwinkle on lavender */
    --color--accent-primary:         #7189bd; /* links, "Lasīt vairāk", menu items — periwinkle */
    --color--accent-primary-strong:  #185fa5; /* darker blue, "Atpakaļ" + pagination numbers */
    --color--accent-coral:           #fcab89; /* active menu item + active language */
    --color--card-title:             #ffffff; /* card headline is WHITE on the lavender bg (Figma 113:96) */
}

/* Apply the sans stack site-wide.
   This is the rule that fixes the serif-fallback (Times) problem —
   without a defined font-family, browsers default to their serif. */
body {
    font-family: var(--font-sans);
    font-weight: 400;
    line-height: 1.6;
    color: var(--color--base-foreground);
    background-color: var(--color--base-background); /* lavender-grey page bg (Figma) */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-sans-expanded);   /* wdth 120 expanded — all headings */
    font-weight: 700;
    line-height: 1.2;
}
