/* ============================================================
 * io-kenos-child v1.2 — Design Tokens
 * ------------------------------------------------------------
 * Single source of truth for every visual primitive used across
 * the theme. Components reference var(--wdz-*) only; per-client
 * palette swaps live in niche-presets.css as one-block overrides
 * on body classes.
 *
 * Load order: enqueued first (no dependencies) so every other
 * stylesheet — style.css, page-city.css, components.css,
 * niche-presets.css — can resolve --wdz-* references.
 * ============================================================ */

:root {
	/* === BRAND === */
	--wdz-navy:  #0F3460;
	--wdz-gold:  #C9A227;
	--wdz-white: #FFFFFF;
	--wdz-black: #0A0A0A;

	/* === NICHE (overridden per-client via body class in niche-presets.css) === */
	--wdz-primary: var(--wdz-navy);
	--wdz-accent:  var(--wdz-gold);

	/* === SEMANTIC === */
	--wdz-success: #0a7f3f;
	--wdz-warning: #b07e00;
	--wdz-error:   #b00020;
	--wdz-info:    #1a5fb4;

	/* === SURFACE === */
	--wdz-surface:     #FFFFFF;
	--wdz-surface-alt: #F4F4F6;

	/* === TEXT === */
	--wdz-text:              #1A1A1A;
	--wdz-text-muted:        #555555;
	--wdz-text-on-primary:   #FFFFFF;
	--wdz-text-on-gradient:  #FFFFFF;

	/* === BORDER === */
	--wdz-border:        #E4E4E7;
	--wdz-border-focus:  var(--wdz-accent);

	/* === TYPOGRAPHY === */
	--wdz-font-body:    -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
	--wdz-font-heading: var(--wdz-font-body);
	--wdz-h1:           clamp(2rem, 5vw, 3.5rem);
	--wdz-h2:           clamp(1.5rem, 3.5vw, 2.25rem);
	--wdz-h3:           clamp(1.25rem, 2.5vw, 1.75rem);
	--wdz-body:         1rem;
	--wdz-lh-tight:     1.2;
	--wdz-lh-base:      1.6;

	/* === SPACING (4px grid) === */
	--wdz-space-1: 0.25rem;
	--wdz-space-2: 0.5rem;
	--wdz-space-3: 0.75rem;
	--wdz-space-4: 1rem;
	--wdz-space-5: 1.5rem;
	--wdz-space-6: 2rem;
	--wdz-space-7: 3rem;
	--wdz-space-8: 4rem;

	/* === RADIUS === */
	--wdz-radius-sm:   4px;
	--wdz-radius-md:   8px;
	--wdz-radius-lg:   16px;
	--wdz-radius-full: 9999px;

	/* === SHADOW === */
	--wdz-shadow-sm:    0 1px 2px  rgba(15, 52, 96, 0.05);
	--wdz-shadow-md:    0 4px 12px rgba(15, 52, 96, 0.10);
	--wdz-shadow-lg:    0 12px 32px rgba(15, 52, 96, 0.15);
	--wdz-shadow-focus: 0 0 0 3px  rgba(201, 162, 39, 0.40);

	/* === Z-INDEX === */
	--wdz-z-sticky:   100;
	--wdz-z-dropdown: 200;
	--wdz-z-fab:      500;
	--wdz-z-modal:   1000;
	--wdz-z-toast:   2000;
}
