/*
 * tokens.css — Design Tokens
 *
 * Single source of truth for colors, typography, spacing, and layout
 * variables used across the Kojiki Trail site. Change a value here and
 * it propagates everywhere.
 *
 * @package Kadence_Kojiki_Trail
 */

:root {
	/* ============ COLORS ============ */
	--paper:           #F2EDE0;  /* Washi base */
	--paper-deep:      #E8E0CC;  /* One step deeper washi */
	--paper-dark:      #DDD2B8;  /* Emphasized background */
	--ink:             #1C1813;  /* Sumi black */
	--ink-soft:        #4A413A;  /* Softer ink */
	--ink-faint:       #8B8278;  /* Faint ink (captions) */
	--vermillion:      #A8392E;  /* Shu vermillion */
	--vermillion-deep: #8B2A22;  /* Deeper vermillion (hover) */
	--gold:            #B08D57;  /* Kin gold */
	--hairline:        rgba(28, 24, 19, 0.15);
	--hairline-strong: rgba(28, 24, 19, 0.35);

	/* ============ TYPOGRAPHY ============ */
	--font-display: 'Cormorant Garamond', Georgia, serif;
	--font-body:    'Lora', Georgia, serif;
	--font-label:   'Cinzel', serif;

	/* ============ SCALE ============ */
	/* clamp() interpolates between mobile and desktop sizes. */
	--fs-h1:    clamp(48px, 6vw, 92px);
	--fs-h2:    clamp(32px, 4vw, 44px);
	--fs-h3:    clamp(22px, 2.5vw, 28px);
	--fs-body:  19px;
	--fs-lede:  26px;
	--fs-small: 14px;
	--fs-label: 11px;

	/* ============ SPACING ============ */
	--sp-xs: 8px;
	--sp-s:  16px;
	--sp-m:  32px;
	--sp-l:  64px;
	--sp-xl: 128px;

	/* ============ LAYOUT ============ */
	--container-max:  1200px;
	--content-max:    760px;
	--reading-line:   1.78;
	--letter-display: -0.02em;
	--letter-cinzel:  0.32em;
}
