/* TantraGuru, direction A. Token bridge.
   theme.json is the single source of truth. This file only maps the names that
   site.css (verbatim from homepage A v1) reads onto the theme.json presets.
   Change a value in theme.json, never here. */

:root {
  /* Brand (fixed by the client) */
  --color-rimon: var(--wp--preset--color--rimon);
  --color-yam: var(--wp--preset--color--yam);

  /* Neutrals (DNA scale) */
  --n-0: var(--wp--preset--color--n-0);
  --n-1: var(--wp--preset--color--n-1);
  --n-2: var(--wp--preset--color--n-2);
  --n-3: var(--wp--preset--color--n-3);
  --n-4: var(--wp--preset--color--n-4);
  --n-5: var(--wp--preset--color--n-5);
  --n-6: var(--wp--preset--color--n-6);
  --n-7: var(--wp--preset--color--n-7);
  --n-8: var(--wp--preset--color--n-8);

  /* Semantic roles */
  --bg-page: var(--n-1);
  --bg-band: var(--n-2);
  --bg-card: var(--n-0);
  --bg-elevated: var(--wp--preset--color--elevated);
  --ink: var(--n-8);
  --ink-body: var(--n-6);
  --ink-caption: var(--n-5);
  --line: var(--n-3);
  --link: var(--color-yam);
  --link-hover: var(--color-rimon);

  /* Type */
  --font-heading: var(--wp--preset--font-family--heading);
  --font-body: var(--wp--preset--font-family--body);
  --font-mono: var(--wp--preset--font-family--mono);

  --fs-display: var(--wp--preset--font-size--display);
  --fs-h1: var(--wp--preset--font-size--h-1);
  --fs-h2: var(--wp--preset--font-size--h-2);
  --fs-h3: var(--wp--preset--font-size--h-3);
  --fs-body: var(--wp--preset--font-size--body);
  --fs-small: var(--wp--preset--font-size--small);
  --fs-caption: var(--wp--preset--font-size--caption);
  --fs-overline: var(--wp--preset--font-size--overline);

  --lh-display: var(--wp--custom--line-height--display);
  --lh-h1: var(--wp--custom--line-height--h-1);
  --lh-h2: var(--wp--custom--line-height--h-2);
  --lh-h3: var(--wp--custom--line-height--h-3);
  --lh-body: var(--wp--custom--line-height--body);
  --lh-small: var(--wp--custom--line-height--small);

  /* Spacing (8px base) */
  --s-1: var(--wp--preset--spacing--1);
  --s-2: var(--wp--preset--spacing--2);
  --s-3: var(--wp--preset--spacing--3);
  --s-4: var(--wp--preset--spacing--4);
  --s-5: var(--wp--preset--spacing--5);
  --s-6: var(--wp--preset--spacing--6);
  --s-7: var(--wp--preset--spacing--7);
  --s-8: var(--wp--preset--spacing--8);
  --s-9: var(--wp--preset--spacing--9);
  --s-10: var(--wp--preset--spacing--10);

  --section-y: var(--wp--custom--layout--section-y-mobile);
  --gutter: var(--wp--custom--layout--gutter-mobile);
  --content-max: var(--wp--custom--layout--content-max);

  /* Shape */
  --r-sm: var(--wp--custom--radius--sm);
  --r-md: var(--wp--custom--radius--md);
  --r-lg: var(--wp--custom--radius--lg);
  --r-pill: var(--wp--custom--radius--pill);

  /* Elevation */
  --shadow-low: var(--wp--preset--shadow--low);
  --shadow-medium: var(--wp--preset--shadow--medium);
  --shadow-high: var(--wp--preset--shadow--high);

  /* Motion */
  --ease-out: var(--wp--custom--motion--ease-out);
  --ease-in: var(--wp--custom--motion--ease-in);
  --dur-micro: var(--wp--custom--motion--dur-micro);
  --dur-normal: var(--wp--custom--motion--dur-normal);
  --dur-macro: var(--wp--custom--motion--dur-macro);

  /* Mark */
  --mark-min: var(--wp--custom--mark--min);
}

@media (min-width: 1024px) {
  :root {
    --section-y: var(--wp--custom--layout--section-y-desktop);
    --gutter: var(--wp--custom--layout--gutter-desktop);
  }
}
