/* Hallmark · macrostructure: Catalogue · F6 knobs: ratio=1/1, density=4-up, action=Add · F3 knobs: cols=3+footnote, rules=every-row, nums=tabular
 * theme: custom · vibe: "the armory, forge-lit, gold on void, spec-true" · paper: #0D0B16 · accent: #C9A24B
 * display: Cinzel · body: Alegreya · outlier: Geist Mono (machine-set data role) · axes: dark / serif / warm
 * genre: editorial · nav: N12 banner+retract · footer: Ft4 dense colophon · enrichment: none (real supplier photography)
 * studied: no · context: inferred · Hallmark · pre-emit critique: P4 H5 E4 S5 R4 V5
 *
 * 2026-08-16 — RESKIN: values retuned to the apex (chainmailjack.com) Armory identity so the
 * storefront and the brand site read as one company. Token NAMES are unchanged on purpose:
 * chainmail-jack.css and woo.css hold zero hardcoded colors, so this file is the whole seam.
 * The editorial macrostructure (hairline rules every row, tabular figures, 4-up grid) is kept —
 * only the palette and the type voice moved.
 */

:root {
	/* The native form-control popups (variation selects, ordering, checkout country)
	   are painted by the OS. Without this they render as a white menu and the option
	   text inherits --color-ink (cream) — invisible. Must stay first. */
	color-scheme: dark;

	/* ---- color: forge-lit void, gold anchor ---- */
	--color-paper:        #0D0B16;
	--color-paper-2:      #171326;
	--color-paper-3:      #1E1832;
	--color-ink:          #E9E2CF;
	--color-ink-2:        #CDC6B4;
	--color-muted:        #9A937F;
	--color-rule:         rgba(201, 162, 75, 0.28);
	--color-rule-2:       rgba(201, 162, 75, 0.15);
	--color-rule-strong:  #8A6F2E;
	--color-accent:       #C9A24B;
	--color-accent-deep:  #8A6F2E;
	--color-accent-ink:   #0D0B16;
	--color-focus:        #FFD100;
	--color-error:        #C33B2A;
	--color-success:      #40D65C;

	/* WooCommerce's own form variables. select2 (.select2-dropdown /
	   .select2-selection__rendered) and the classic .show-password-input read these, so
	   naming them here keeps any enhanced dropdown on-theme without needing a selector. */
	--wc-form-color-background: var(--color-paper);
	--wc-form-color-text:       var(--color-ink);
	--wc-form-border-color:     var(--color-rule-strong);

	/* Armory extras — shared with the apex so cards/CTAs match across the seam. */
	--color-gold-hi:      #F2D98C;
	--color-quest:        #FFD100;
	--color-red:          #A6251C;
	--color-red-hi:       #C33B2A;
	--color-edge:         #2A2244;

	/* ---- type ---- */
	--font-display: "Cinzel", Georgia, serif;
	--font-body:    "Alegreya", Georgia, serif;
	--font-mono:    "Geist Mono", ui-monospace, monospace;

	/* 1.25 major-third scale. Base nudged 1rem -> 1.05rem: Alegreya's x-height
	   runs shorter than IBM Plex Sans and read small at 16px. */
	--text-xs:   0.84rem;
	--text-sm:   0.94rem;
	--text-base: 1.05rem;
	--text-md:   1.3rem;
	--text-lg:   1.5625rem;
	--text-xl:   1.9531rem;
	--text-2xl:  2.4414rem;
	--text-display-s: clamp(1.75rem, 2.5vw + 0.75rem, 2.75rem);
	--text-display:   clamp(2.1rem, 4.2vw + 0.6rem, 4.25rem);

	/* ---- space: 4pt scale ---- */
	--space-2xs: 0.25rem;
	--space-xs:  0.5rem;
	--space-sm:  0.75rem;
	--space-md:  1rem;
	--space-lg:  1.5rem;
	--space-xl:  2.5rem;
	--space-2xl: 4rem;
	--space-3xl: 6rem;

	/* ---- 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:  420ms;

	/* ---- structure ---- */
	--rule-hair: 1px;
	--radius-sm: 2px;
	--radius-md: 4px;
	--banner-h: 40px;
	--bar-h: 64px;

	/* Panel treatment lifted from the apex so a product card here and a product
	   card on the brand site are the same object. */
	--panel-shadow:
		inset 0 0 0 1px rgba(201, 162, 75, 0.32),
		inset 0 1px 0 rgba(242, 217, 140, 0.12),
		0 10px 28px rgba(0, 0, 0, 0.55);

	--z-base: 1;
	--z-raised: 10;
	--z-dropdown: 100;
	--z-sticky: 200;
	--z-modal: 400;
	--z-toast: 500;
	--z-tooltip: 600;
}