/*
 * zemla-tokens.css — Unified Design-Token Layer (stage-a v1.8.0)
 * bodyterapie.com — mirrors zemla v1.8.0 + mim2000 v1.17.0 pattern.
 *
 * TWO-LAYER ARCHITECTURE:
 *   Layer 1  :root               — Global semantic tokens shared across all 3 sites.
 *   Layer 2  .theme-bodyterapie  — Per-site brand overrides applied via body class.
 *   (Layer 3  .locale-ja         — OMITTED: bodyterapie 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 ...)
 *   per 3FP-STAGE-A-TOKENS-BRIEF-v0.1.md §2.1. Both sets coexist in stage (a);
 *   stage (c) migrates remaining consumers to canonical names.
 *
 * LOAD ORDER:
 *   bodyterapie-tokens (this file) is enqueued BEFORE bodyterapie-style (style.css)
 *   so that custom properties declared here are available when style.css is parsed.
 *
 * BRAND COLOUR NOTES (bodyterapie):
 *   Values extracted from ACTUAL computed styles (audit 2026-05-15):
 *     bodyterapie-wholeness.json:
 *       h1 color          = rgb(176,90,24)   = #b05a18  (amber-terracotta)
 *       nav logo color    = rgb(227,131,34)  = #e38322  (warm orange)
 *       body text color   = rgb(31,14,0)     = #1f0e00  (near-black brown)
 *       p color           = rgb(138,96,64)   = #8a6040  (mid-brown)
 *       --c-bg            = #fef7ec          (warm cream)
 *       --c-accent        = #e38322          (warm orange)
 *       --c-border        = #e8cfb0          (warm sand)
 *   Brief placeholder #7c5c2c / #a55c7c intentionally NOT used.
 *   Stage (c) may revise brand colours.
 *
 * R-AUDIT-005 NOTE:
 *   bodyterapie v1.7.1 already moved body font to var(--f-body) token;
 *   the dead-Georgia + p-Inter contradiction from the audit (v1.3.0) is resolved.
 *   Stage (a) adds p { font-family: var(--font-body) } for canonical token adoption
 *   and document Option A (16px body, readability improvement).
 *
 * BODYTERAPIE DELTAS FROM ZEMLA/MIM2000:
 *   - .theme-bodyterapie instead of .theme-zemla / .theme-mim2000
 *   - NO .locale-ja block (bodyterapie is CS+EN only)
 *   - NO Noto Serif JP / Noto Sans JP (no JA subsets)
 *   - Somatic / contemplative site — warm amber-terracotta brand palette
 *   - Noto Serif for body (warm, humanist); Noto Sans for headings/UI
 *
 * @package     bodyterapie
 * @since       1.8.0
 * @see         inc/zemla-config.php (PHP constants mirror these values)
 * @see         3FP-STAGE-A-BODYTERAPIE-BRIEF-v0.1.md §1, §2, §3
 */

/* ═══════════════════════════════════════════════════════════════════
   LAYER 1 — GLOBAL :root TOKENS
   Semantic base layer; brand-neutral where possible.
   Per-site brand colours live in .theme-* blocks below.
   Mirrors 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);
  --c-link-hover:    var(--c-accent);
  --c-error:         #c62828;
  --c-warning:       #f57c00;
  --c-success:       #2e7d32;
  /* --c-brand and --c-accent are 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.7;
  --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:  680px;    /* bodyterapie: narrower content column (contemplative) */
  --container-max:  1100px;

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

  /* ── Gallery (no gallery on bodyterapie; defined per brief §4.3) */
  --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: 8px;   /* bodyterapie: rounded buttons (somatic brand) */
  --border-radius-card:   16px;  /* bodyterapie: large card radius */
  --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 ──────────────────────────────────────── */
  --font-size-body:    16px;    /* Option A: readability improvement (was 14px) */
  --radius-image:      8px;     /* bodyterapie: rounded images */
  --radius-card:       16px;

}

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


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

/*
 * bodyterapie — somatic psychology / contemplative / body-mind integration
 * Warm amber-terracotta palette.
 * Actual computed values from audit/computed-styles/bodyterapie-wholeness.json
 * (captured 2026-05-15):
 *   h1 color         = rgb(176,90,24)  = #b05a18  (amber-terracotta)
 *   nav logo color   = rgb(227,131,34) = #e38322  (warm orange)
 *   body text color  = rgb(31,14,0)    = #1f0e00  (near-black brown)
 *   p color          = rgb(138,96,64)  = #8a6040  (mid-brown)
 *   --c-bg           = #fef7ec         (warm cream background)
 *   --c-accent       = #e38322         (warm orange)
 *   --c-border       = #e8cfb0         (warm sand border)
 *
 * Brief §1 placeholder #7c5c2c / #a55c7c intentionally NOT used.
 */
.theme-bodyterapie {
  /* Brand colours — actual live palette */
  --c-brand:  #b05a18;   /* amber-terracotta (= primary heading / --c-primary) */
  --c-accent: #e38322;   /* warm orange (= existing --c-accent, nav logo color) */
  --c-bg:     #fef7ec;   /* warm cream page background */
  --c-border: #e8cfb0;   /* warm sand border */

  /* Text colours */
  --c-text:  #1f0e00;    /* near-black brown (overrides :root #1a1a1a) */
  --c-muted: #8a6040;    /* mid-brown paragraphs (= --c-ink-3 from style.css) */

  /* Links — bodyterapie uses --c-accent for links */
  --c-link:       #e38322;   /* = --c-accent */
  --c-link-hover: #b05a18;   /* = --c-brand on hover */

  /* Card background */
  --c-bg-card: #fffbf4;   /* off-white (= --c-surface from style.css) */

  /* R-AUDIT-005 Option A: body font at 16px (readability improvement) */
  --fs-body: 16px;
  --lh-body: 1.7;

  /* Typography: Noto Serif for body (warm, humanist); Noto Sans for headings */
  --font-body:    "Noto Serif", Georgia, serif;
  --font-heading: "Noto Sans", Inter, "Segoe UI", system-ui, sans-serif;

  /* No negative heading tracking (clean on warm background) */
  --font-tracking-h1: 0;
}

/* ── NO .locale-ja block ───────────────────────────────────────── */
/* bodyterapie is CS+EN only. Per brief §0: "SKIP JA blocks."       */
/* Per 3FP-STAGE-A-BODYTERAPIE-BRIEF-v0.1.md §3 Stage B note.      */


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

   NOTE: NO Noto Serif JP / Noto Sans JP — bodyterapie is CS+EN only.
   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/bodyterapie/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/bodyterapie/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/bodyterapie/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/bodyterapie/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/bodyterapie/assets/fonts/NotoSans-Bold.woff2")
       format("woff2");
  font-weight: 700;
  font-style:  normal;
  font-display: swap;
}

/* ── NO Noto Serif JP / Noto Sans JP ──────────────────────────── */
/* bodyterapie is CS+EN only. JA font subsets intentionally omitted.  */
/* Per 3FP-STAGE-A-BODYTERAPIE-BRIEF-v0.1.md §0 and §3 Stage C note. */
