/*
 * zemla-tokens.css — Unified Design-Token Layer (stage-a v1.17.0)
 * mim2000.cz theme — mirrors zemla v1.8.0 pattern with mim2000-specific deltas.
 *
 * TWO-LAYER ARCHITECTURE (OQ-AUDIT-05 resolution):
 *   Layer 1  :root              — Global semantic tokens shared across all 3 sites.
 *   Layer 2  .theme-mim2000     — Per-site brand overrides applied via body class.
 *   (Layer 3  .locale-ja        — OMITTED: mim2000 is CS+EN only; no JA content.)
 *
 * RELATIONSHIP TO style.css:
 *   style.css defines the legacy short-name tokens (--f-body, --sp-4, --r-md ...).
 *   This file introduces the canonical long-name tokens (--font-body, --space-md ...)
 *   specified in 3FP-STAGE-A-TOKENS-BRIEF-v0.1.md §2.1. Both sets coexist;
 *   stage (c) will migrate remaining consumers to canonical names.
 *
 * LOAD ORDER:
 *   zemla-tokens.css is enqueued BEFORE mim2000-style (style.css) so that
 *   custom properties declared here are available when style.css is parsed.
 *
 * BRAND COLOUR NOTES (mim2000):
 *   Values extracted from ACTUAL computed styles (audit 2026-05-15):
 *     mim2000-home.json:    --c-accent #1da1c8, --c-bg #eef6fa
 *     mim2000-vision.json:  h1/h2 color rgb(11,92,120) = #0b5c78
 *     body text = rgb(12,37,53) = #0c2535
 *   These are the LIVE values. Brief §2.2 proposed #2c5f7c / #7c5c2c —
 *   those are abstract proposals; this file uses the actual computed palette.
 *   Stage (c) redesign may revise brand colours.
 *
 * MIM2000 DELTAS FROM ZEMLA:
 *   - .theme-mim2000 instead of .theme-zemla
 *   - NO .locale-ja block (no JA content on mim2000)
 *   - NO Noto Serif JP / Noto Sans JP @font-face (no JA subsets)
 *   - --font-body uses Noto Serif (same as zemla) + Georgia as fallback
 *   - --font-heading uses Noto Sans + Inter as fallback (mim2000 uses Inter)
 *
 * @package     MIM2000
 * @since       1.17.0
 * @see         inc/zemla-config.php (PHP constants mirror these values)
 * @see         3FP-STAGE-A-TOKENS-BRIEF-v0.1.md §2.1, §2.2
 * @see         3FP-STAGE-A-MIM2000-BRIEF-v0.1.md §1 (mim2000-specific deltas)
 */

/* ═══════════════════════════════════════════════════════════════════
   LAYER 1 — GLOBAL :root TOKENS
   Semantic base layer; brand-neutral where possible.
   Per-site brand colours live in .theme-* blocks below.
   IDENTICAL to zemla v1.8.0 :root block (shared global layer).
   ═══════════════════════════════════════════════════════════════════ */
:root {

  /* ── Color (semantic) ───────────────────────────────────────── */
  --c-text:          #1a1a1a;
  --c-muted:         #6a6a6a;
  --c-bg:            #fafafa;       /* overridden per-site in .theme-* */
  --c-bg-card:       #ffffff;
  --c-border:        #e0e0e0;       /* overridden per-site in .theme-* */
  --c-border-strong: #c0c0c0;
  --c-link:          var(--c-brand);       /* resolves via per-site .theme-* */
  --c-link-hover:    var(--c-accent);
  --c-error:         #c62828;
  --c-warning:       #f57c00;
  --c-success:       #2e7d32;
  /* --c-brand and --c-accent are intentionally NOT set at :root —
     they are brand tokens and must come from .theme-* override blocks. */

  /* ── Typography ─────────────────────────────────────────────── */
  --font-body:    "Noto Serif", Georgia, serif;
  --font-heading: "Noto Sans", Inter, "Segoe UI", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", Menlo, Consolas, monospace;

  /* ── Type scale (mobile-first; desktop overrides in @media below) */
  --fs-body:    16px;
  --fs-h1:      2.5rem;
  --fs-h2:      1.875rem;
  --fs-h3:      1.5rem;
  --fs-h4:      1.25rem;
  --fs-small:   0.875rem;
  --lh-body:    1.6;
  --lh-heading: 1.25;

  /* ── Spacing scale ──────────────────────────────────────────── */
  --space-xs:  0.25rem;   /*  4px */
  --space-sm:  0.5rem;    /*  8px */
  --space-md:  1rem;      /* 16px */
  --space-lg:  2rem;      /* 32px */
  --space-xl:  4rem;      /* 64px */
  --space-2xl: 6rem;      /* 96px */

  /* ── Layout ─────────────────────────────────────────────────── */
  --content-width:  720px;
  --container-max:  1200px;

  /* ── Breakpoints (reference values — use in JS; CSS uses @media) */
  --bp-mobile:  640px;
  --bp-tablet:  768px;
  --bp-desktop: 1024px;
  --bp-wide:    1280px;

  /* ── Gallery (defined for future use — mim2000 has no gallery yet;
     per 3FP-STAGE-A-TOKENS-BRIEF §4.3: define even if unused) ─── */
  --gallery-cols-mobile:    1;
  --gallery-cols-tablet:    2;
  --gallery-cols-desktop:   3;
  --gallery-gap:            var(--space-md);
  --gallery-sidebar-width:  220px;

  /* ── Photo treatment (per ADR-03 album-card pattern) ───────── */
  --img-radius-sm:   4px;
  --img-radius-md:   8px;
  --img-radius-lg:   12px;
  --img-aspect-card: 3 / 2;

  /* ── Forms + components ─────────────────────────────────────── */
  --border-radius-button: 4px;
  --border-radius-card:   8px;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md: 0 2px 6px rgba(0,0,0,0.08);
  --transition-fast: 150ms ease-out;
  --transition-base: 250ms ease-out;

  /* ── Typography extras (R-AUDIT-018, R-AUDIT-019, R-AUDIT-020) */
  --font-tracking-h1:  0;            /* mim2000: no negative tracking (vs zemla -0.36px) */
  --nav-logo-weight:   700;          /* mim2000: bold logo weight (brand — R-AUDIT-009) */
  --font-size-body:    16px;
  --radius-image:      0px;          /* mim2000: flat images (consistent with audit) */
  --radius-card:       0px;
  --c-card-bg:         #ffffff;

  /* ── mim2000 h2 border-bottom treatment (R-AUDIT-020 brand token) */
  --h2-border-bottom-style: 1px solid var(--c-border);  /* mim2000-specific */
  --h2-padding-bottom:      0.5rem;

}

/* ── Desktop type-scale overrides ──────────────────────────────── */
@media (min-width: 768px) {
  :root {
    --fs-body: 18px;
    --fs-h1:   3rem;
  }
}


/* ═══════════════════════════════════════════════════════════════════
   LAYER 2 — PER-SITE BRAND OVERRIDES (.theme-mim2000)
   Applied via body class: <body class="theme-mim2000 locale-cs">
   See header.php Stage D for the body_class() call.
   ═══════════════════════════════════════════════════════════════════ */

/*
 * mim2000 — professional / engineering / consulting palette
 * Actual computed values from audit/computed-styles/ (2026-05-15):
 *   h1/h2 color   = rgb(11,92,120)  = #0b5c78  (deep blue)
 *   nav item color = rgb(30,66,88)  = #1e4258  (dark mid-blue)
 *   body text      = rgb(12,37,53)  = #0c2535  (near-black navy)
 *   --c-accent     = #1da1c8        (bright cyan-blue)
 *   --c-bg         = #eef6fa        (light blue-white)
 *   --c-border     = #b0d4e4        (light blue border)
 *
 * Brief §2.2 proposed #2c5f7c / #7c5c2c as mim2000 brand — those are
 * abstract inference proposals. Stage (a) preserves the actual live palette.
 * Stage (c) redesign may revise brand colours.
 */
.theme-mim2000 {
  /* Brand colours — actual live palette from computed-styles audit */
  --c-brand:  #0b5c78;   /* deep blue (= primary heading / nav-logo color) */
  --c-accent: #1da1c8;   /* bright cyan-blue (= existing --c-accent) */
  --c-bg:     #eef6fa;   /* light blue-white (= existing --c-bg) */
  --c-border: #b0d4e4;   /* light blue border (= existing --c-border) */

  /* Text colours (actual computed body color = #0c2535) */
  --c-text:  #0c2535;    /* near-black navy (overrides :root #1a1a1a) */
  --c-muted: #4a7a95;    /* mid-blue muted (= --c-ink-3 from style.css) */

  /* Links — mim2000 uses --c-accent for links (R-AUDIT-004) */
  --c-link:       #1da1c8;   /* = --c-accent (bright cyan-blue) */
  --c-link-hover: #0b5c78;   /* = --c-brand (deep blue on hover) */

  /* Card background */
  --c-card-bg: #f8fcfe;   /* = --c-surface from style.css */

  /* Heading tracking: no negative tracking on mim2000 */
  --font-tracking-h1: 0;

  /* Logo weight: bold/professional (R-AUDIT-009 brand difference) */
  --nav-logo-weight: 700;
}


/* ═══════════════════════════════════════════════════════════════════
   LAYER 2b — SELF-HOSTED @font-face DECLARATIONS (stage-a)
   Source files: assets/fonts/Noto*.woff2
   Downloaded via: assets/fetch-fonts.sh  (user runs this once)
   Licence: SIL Open Font Licence (OFL) 1.1 — redistribution permitted.
   font-display: swap — text visible immediately in system fallback font
   while Noto loads. Prevents layout shift on slow connections.

   NOTE: NO Noto Serif JP / Noto Sans JP — mim2000 has no JA content.
   Only Noto Serif (body) + Noto Sans (headings/UI) are included.
   ═══════════════════════════════════════════════════════════════════ */

/* ── Noto Serif (body copy, longform reading) ──────────────────── */
@font-face {
  font-family: "Noto Serif";
  src: url("/wp-content/themes/mim2000/assets/fonts/NotoSerif-Regular.woff2")
       format("woff2");
  font-weight: 400;
  font-style:  normal;
  font-display: swap;
}

@font-face {
  font-family: "Noto Serif";
  src: url("/wp-content/themes/mim2000/assets/fonts/NotoSerif-Italic.woff2")
       format("woff2");
  font-weight: 400;
  font-style:  italic;
  font-display: swap;
}

@font-face {
  font-family: "Noto Serif";
  src: url("/wp-content/themes/mim2000/assets/fonts/NotoSerif-Bold.woff2")
       format("woff2");
  font-weight: 700;
  font-style:  normal;
  font-display: swap;
}

/* ── Noto Sans (headings, UI chrome) ──────────────────────────── */
@font-face {
  font-family: "Noto Sans";
  src: url("/wp-content/themes/mim2000/assets/fonts/NotoSans-Regular.woff2")
       format("woff2");
  font-weight: 400;
  font-style:  normal;
  font-display: swap;
}

@font-face {
  font-family: "Noto Sans";
  src: url("/wp-content/themes/mim2000/assets/fonts/NotoSans-Bold.woff2")
       format("woff2");
  font-weight: 700;
  font-style:  normal;
  font-display: swap;
}

/* ── NO Noto Serif JP / Noto Sans JP ──────────────────────────── */
/* mim2000 is CS+EN only. Japanese font subsets intentionally omitted. */
/* Per 3FP-STAGE-A-MIM2000-BRIEF-v0.1.md §0 and §2 (Stage C note).   */