/* Maison Mekong design tokens.
   Lifted verbatim from the Claude Design bundle:
   project/_ds/maison-m-kong-design-system-b8eae23b.../tokens/
   Do not hand-edit values here - change them in the design system and re-copy. */

/* ---------- fonts ---------- */
/* Brand book specifies Tuna (display serif) + Brother 1816 (sans); both are licensed
   retail faces with no binaries supplied. Newsreader / Hanken Grotesk are the design
   system's sanctioned substitutes. Noto Serif Khmer is added here for the KH locale. */
/* Faces are self-hosted; see styles/fonts.css. */

/* ---------- colors ---------- */
:root{
/* --- Brand palette, sampled from MMEKONG-BRANDING.pdf p.11 "COLORS" --- */
--mm-forest:#1A291E;        /* Vert - deep forest green, primary brand ground */
--mm-forest-logo:#14291C;   /* Vert - logo ink (marginally deeper than --mm-forest) */
--mm-green:#456E4F;         /* Vert - mid leaf green */
--mm-green-deep:#4E664B;    /* Vert - muted leaf green used behind type (p.13) */
--mm-olive:#798A3C;         /* Vert - olive, the "leaves" duotone highlight */
--mm-lime:#DDD010;          /* Yellow - acid lime-yellow, the "smog" duotone */
--mm-lime-soft:#F6D74B;     /* Yellow - softer yellow used on story cards */
--mm-olive-ink:#454803;     /* dark olive ink used on lime grounds */
--mm-blue:#284A57;          /* Blue - river/water duotone */
--mm-terracotta:#A13B21;    /* Terracota - laterite earth / water duotone */
--mm-white:#FFFFFF;
--mm-paper:#F4F3EE;         /* uncoated paper white of the stationery */
--mm-ink:#10110B;           /* near-black wordmark ink */

/* --- Neutrals, derived from the ink + paper --- */
--mm-neutral-100:#F4F3EE;
--mm-neutral-200:#E6E5DD;
--mm-neutral-300:#CFCEC4;
--mm-neutral-400:#A6A79B;
--mm-neutral-500:#74766A;
--mm-neutral-600:#4A4C42;
--mm-neutral-700:#2B2D25;
--mm-neutral-900:#10110B;

/* --- Semantic aliases --- */
--surface-page:var(--mm-white);
--surface-paper:var(--mm-paper);
--surface-card:var(--mm-white);
--surface-inverse:var(--mm-forest);
--surface-accent:var(--mm-lime);
--surface-earth:var(--mm-terracotta);
--surface-river:var(--mm-blue);
--surface-leaf:var(--mm-green);

--text-body:var(--mm-ink);
--text-muted:var(--mm-neutral-500);
--text-on-dark:var(--mm-white);
--text-on-accent:var(--mm-forest);
--text-link:var(--mm-forest);
--text-link-hover:var(--mm-olive);

--border-hairline:var(--mm-neutral-300);
--border-strong:var(--mm-forest);
--border-on-dark:rgba(255,255,255,.35);

--focus-ring:var(--mm-olive);
}

/* ---------- typography ---------- */
:root{
--font-display:"Newsreader","Tuna","Iowan Old Style",Georgia,serif;   /* substitute for Tuna */
--font-sans:"Hanken Grotesk","Brother 1816","Helvetica Neue",Arial,sans-serif; /* substitute for Brother 1816 */
--font-body:var(--font-display);
--font-ui:var(--font-sans);

--fw-light:300; /* @kind font */
--fw-regular:400; /* @kind font */
--fw-medium:500; /* @kind font */
--fw-semibold:600; /* @kind font */
--fw-bold:700; /* @kind font */

/* Display / editorial scale (serif) */
--fs-display-xl:clamp(56px,7vw,112px); /* @kind font */
--fs-display-l:clamp(44px,5vw,72px); /* @kind font */
--fs-display-m:clamp(34px,3.4vw,52px); /* @kind font */
--fs-display-s:28px; /* @kind font */
--fs-title:22px; /* @kind font */

/* Text scale */
--fs-body-l:20px; /* @kind font */
--fs-body:17px; /* @kind font */
--fs-body-s:15px; /* @kind font */
--fs-caption:13px; /* @kind font */
--fs-label:12px; /* @kind font */

--lh-display:1.04; /* @kind font */
--lh-heading:1.12; /* @kind font */
--lh-body:1.5; /* @kind font */
--lh-tight:1.25; /* @kind font */

--ls-display:-0.01em; /* @kind font */
--ls-body:0; /* @kind font */
--ls-label:0.08em; /* @kind font */
--ls-eyebrow:0.14em; /* @kind font */
}

/* ---------- spacing ---------- */
:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;
--space-6:32px;--space-7:40px;--space-8:56px;--space-9:80px;--space-10:120px;
--gutter:var(--space-5);
--page-margin:clamp(20px,5vw,80px);
--content-max:1280px; /* @kind spacing */
--measure:62ch;           /* editorial paragraph measure */
--measure-narrow:34ch;    /* centred statement copy */
--logo-clearspace:1em;    /* = height of the mark's cap square, per p.5 grid */
}

/* ---------- radius-shadow ---------- */
:root{
/* The brand is square-first: the mark is a hard square, packaging panels are hard-edged.
   Rounding appears only on story cards and pill controls. */
--radius-none:0;
--radius-card:18px;
--radius-card-lg:26px;
--radius-pill:999px;
--radius-input:4px;

--border-width:1px;
--border-width-strong:2px;

--shadow-card:0 18px 40px -24px rgba(16,17,11,.45);
--shadow-float:0 28px 60px -28px rgba(16,17,11,.55);
--shadow-inset-hairline:inset 0 0 0 1px var(--border-hairline);
--overlay-scrim:linear-gradient(to top,rgba(16,17,11,.72),rgba(16,17,11,0) 62%); /* @kind other */
}

/* ---------- motion ---------- */
:root{
--ease-standard:cubic-bezier(.22,.61,.36,1); /* @kind other */
--ease-entrance:cubic-bezier(.16,.84,.44,1); /* @kind other */
--dur-fast:120ms; /* @kind other */
--dur-base:220ms; /* @kind other */
--dur-slow:420ms; /* @kind other */
--hover-lift:-2px; /* @kind other */
--press-scale:.985; /* @kind other */
}

