/* =========================================================================
   Axion — design tokens. The Customizer (inc/design-tokens.php) overrides
   these by emitting only the values that differ, so an untouched install ships
   this file alone. Keep the defaults there in lockstep with the :root block
   below — a mismatch means a value is emitted that was never changed.
   ========================================================================= */
:root {
	/* Grounds — light theme */
	--axn-bg:          #F8F4EA;
	--axn-bg-2:        #FFFDF7;
	/* A THIRD light ground, for the intro band under a hero. It is deliberately
	   neither `--axn-bg` nor `--axn-bg-2`: that band sits outside the two-ground
	   alternation, so if it borrowed either one it would collide with whatever
	   happened to follow it on some page. See `.axn-pintro`. */
	--axn-bg-3:        #F3EDDE;
	--axn-surface:     #FFFFFF;
	--axn-edge:        #E5DDC9;
	--axn-edge-soft:   #F0E9D9;

	/* Ink */
	--axn-ink:         #16140E;
	--axn-ink-2:       #3F3A2E;
	--axn-ink-3:       #6E6857;

	/* Brand — gold is a SURFACE on light grounds; gold-deep is the only gold ink */
	--axn-gold:        #D4AF37;
	--axn-gold-deep:   #8A6416;
	--axn-gold-hi:     #F6E29B;

	/* Action */
	--axn-green:       #2E7D22;
	--axn-green-hi:    #37941F;
	--axn-green-bright:#57B33B;

	/* Fiber spectrum — motion and light only, never text or a background fill.
	   These are real tokens: the header beam's gradient references them, and an
	   undefined stop invalidates the whole declaration silently. */
	--axn-amber:       #FF9E2C;
	--axn-magenta:     #E0479E;
	--axn-violet:      #7B5BE0;
	/* Validation — form errors only. Not part of the Design screen's contract. */
	--axn-error:       #A3231B;
	--axn-error-bg:    #FDF3F2;

	--axn-accent:      var(--axn-green);
	--axn-on-accent:   #FFFFFF;

	/* Dark surfaces — footer, dark band, logo panel */
	--axn-dark:        #0B0A07;
	--axn-dark-2:      #13110C;
	--axn-dark-edge:   #2E2820;
	--axn-dark-text:   #FFFFFF;
	--axn-dark-dim:    #E8E6E1;
	--axn-dark-dimmer: #BCB8AF;

	/* Type */
	--ff-display: 'Onest', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
	--ff-body:    'Onest', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
	--ff-tech:    'Michroma', 'Onest', system-ui, sans-serif;
	--ff-mono:    'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

	/* Weights. Four levers, not one per element: headings, the oversized feature
	   lines, body copy and buttons. A weight the chosen family doesn't ship is
	   snapped to its nearest available one before it is emitted.
	   ⚠ Navigation is deliberately NOT on a token: it runs 600 with the current
	   page at 700, and binding that pair to one user-set value can invert the
	   emphasis (active lighter than the rest). Leave it as designed. */
	--fw-head:    800;
	--fw-feature: 500;
	--fw-body:    400;
	--fw-ui:      700;

	/* Hero headlines are their own sizes, not h1. They run far larger than an
	   ordinary heading and have their own responsive curve, so a multiplier off
	   --fs-h1 would break them at phone widths. Both are Customizer-exposed. */
	--fs-hero:  clamp(2.4rem, .7rem + 7.4vw, 6.5rem);
	--fs-phero: clamp(2rem, .9rem + 4.6vw, 4.25rem);

	--fs-h1:   clamp(2rem, 1.1rem + 3.6vw, 3.5rem);
	--fs-h2:   clamp(1.625rem, 1rem + 2.4vw, 2.625rem);
	--fs-h3:   clamp(1.25rem, 1.05rem + 0.8vw, 1.625rem);
	--fs-h4:   1.125rem;
	--fs-h5:   1rem;
	--fs-h6:   0.9375rem;
	--fs-body: 1rem;
	--fs-lede: 1.0625rem;
	--fs-small:0.875rem;

	--lh-head: 1.06;
	--lh-body: 1.62;
	--ls-head: -0.03em;
	--ls-body: 0;
	--ls-tight: 0.01em;      /* buttons + nav — not touched by the Design screen */
	--ls-tech:  0.24em;      /* Michroma eyebrows */

	/* Layout */
	/* Logo width — Customizer-exposed. The compacted header scales off it. */
	--axn-logo-w:    clamp(180px, 21vw, 260px);
	--axn-container: 1340px;
	--axn-gutter:    28px;
	--axn-hdr:       106px;
	--axn-hdr-c:     84px;
	/* ⚠ Was clamp(54px, 6.4vw, 92px). Ten sections at 92px top and bottom put
	   ~1,840px of the homepage's 8,163px into gaps alone. Tightened so the
	   sections read as a sequence rather than as separate pages stacked up.
	   Sections that need more room still set their own. */
	--axn-section-y: clamp(44px, 4.8vw, 70px);

	/* Motion */
	--axn-dur:   .22s;
	--axn-dur-l: .32s;
	--axn-ease:  cubic-bezier(.33, 1, .68, 1);

	/* Elevation — one lift, used sparingly */
	--axn-lift: 0 18px 40px -26px rgba(22, 20, 14, .45);
}
