/* Hallmark · tokens · GARLAND inc. — editorial / Long Document / custom brand theme
 * Portable design tokens. The page CSS references these by name (never inline values).
 * Vibe: craft-devotion · warm cork paper · deep-green ink · gold thread.
 */
:root {
  /* ---- Colour (OKLCH, anchored on the GARLAND brand) ---- */
  --color-paper:        oklch(0.945 0.020 85);   /* warm cream page          */
  --color-paper-2:      oklch(0.905 0.028 84);   /* deeper cork (subtle band) */
  --color-paper-3:      oklch(0.965 0.014 85);   /* lightest cream (insets)   */

  --color-ink:          oklch(0.275 0.012 70);   /* warm near-black body      */
  --color-ink-soft:     oklch(0.275 0.012 70 / 0.82);
  --color-ink-faint:    oklch(0.430 0.012 70);   /* muted small text (≥4.5:1) */

  --color-green:        oklch(0.300 0.045 158);  /* deep-green headings       */
  --color-green-deep:   oklch(0.235 0.035 158);  /* darkest green (spreads)   */
  --color-green-mid:    oklch(0.360 0.048 158);

  --color-accent:       oklch(0.600 0.085 78);   /* bright gold — decorative only (rules, numerals, underlines) */
  --color-accent-strong:oklch(0.450 0.072 66);   /* bronze-gold — readable small text (≈brand gold-800, ≥4.5:1) */
  --color-accent-hi:    oklch(0.830 0.080 84);   /* lighter gold — CTA hover  */
  --color-accent-soft:  oklch(0.780 0.085 82);   /* gold on dark, CTA fill    */

  --color-on-green:     oklch(0.950 0.018 85);   /* cream text on green       */
  --color-on-green-soft:oklch(0.950 0.018 85 / 0.82);

  --color-rule:         oklch(0.600 0.050 80 / 0.24);  /* gold hairline       */
  --color-rule-strong:  oklch(0.600 0.050 80 / 0.42);
  --color-focus:        oklch(0.450 0.072 66);         /* bronze-gold ring (≥3:1 on paper) */

  /* ---- Derived / state colours (kept as named tokens — no mid-render inlines) ---- */
  --color-selection:    oklch(0.780 0.085 82 / 0.45);  /* gold wash           */
  --color-paper-blur:   oklch(0.945 0.020 85 / 0.85);  /* nav backdrop        */
  --color-green-wash:   oklch(0.300 0.045 158 / 0.06); /* ghost-CTA hover     */
  --color-error:        oklch(0.500 0.170 27);          /* form error text (readable red on paper) */
  --shadow-logo:        0 20px 42px oklch(0.275 0.012 70 / 0.26);

  /* ---- Type ---- */
  --font-display: "Zen Old Mincho", "Hiragino Mincho ProN", serif;  /* JP headings */
  --font-body:    "Noto Sans JP", system-ui, sans-serif;            /* prose, UI   */
  --font-latin:   "Cinzel", serif;                                  /* outlier: Latin wordmark + labels */

  /* 1.25 major third, 16px base */
  --text-xs:   0.8rem;
  --text-sm:   0.9rem;
  --text-base: 1rem;
  --text-md:   1.125rem;
  --text-lg:   1.5rem;
  --text-xl:   1.95rem;
  --text-2xl:  2.44rem;
  --text-3xl:  3.05rem;
  --text-display:   clamp(2.4rem, 5vw + 1rem, 4.4rem);
  --text-display-s: clamp(1.9rem, 3.5vw + 0.75rem, 3.1rem);

  /* ---- Spacing (4-pt scale, semantic) ---- */
  --space-3xs: 0.25rem; --space-2xs: 0.5rem;  --space-xs: 0.75rem;
  --space-sm:  1rem;    --space-md:  1.5rem;   --space-lg: 2rem;
  --space-xl:  3rem;    --space-2xl: 4.5rem;   --space-3xl: 7rem;
  --space-4xl: 10rem;

  --page-gutter: clamp(1.25rem, 5vw, 4rem);
  --measure: 64ch;

  /* ---- Motion ---- */
  --ease-out:    cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in:     cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long:  460ms;

  /* ---- Lines & radii ---- */
  --rule:        1px solid var(--color-rule);
  --rule-strong: 1px solid var(--color-rule-strong);
  --radius-sm:   4px;
  --radius-pill: 999px;

  /* ---- Layering ---- */
  --z-base: 0; --z-raised: 10; --z-nav: 50; --z-top: 100;
}
