/* ===========================================================
   Mavco - Design tokens
   Single source of truth for color, type, spacing, motion.
   =========================================================== */

:root {
	/* Brand */
	--mv-forest:        #1F4D2E;
	--mv-forest-700:    #173B23;
	--mv-forest-800:   #102A19;
	--mv-lime:          #7BC142;
	--mv-lime-600:      #6AAE34;
	--mv-lime-100:      #E8F4D7;

	/* Neutrals */
	--mv-ink:           #111815;  /* near-black with green tint */
	--mv-ink-80:        rgba(17, 24, 21, 0.80);
	--mv-ink-60:        rgba(17, 24, 21, 0.60);
	--mv-ink-40:        rgba(17, 24, 21, 0.40);
	--mv-ink-10:        rgba(17, 24, 21, 0.10);
	--mv-concrete:      #5C5C5C;
	--mv-stone-300:     #D8DBD3;
	--mv-stone-200:     #E6E8E1;
	--mv-stone-100:     #EEF0EA;
	--mv-bone:          #F5F6F2;
	--mv-white:         #FFFFFF;

	/* Semantic */
	--mv-bg:            var(--mv-bone);
	--mv-surface:       var(--mv-white);
	--mv-surface-alt:   var(--mv-stone-100);
	--mv-text:          var(--mv-ink);
	--mv-text-muted:    var(--mv-concrete);
	--mv-border:        var(--mv-stone-300);
	--mv-link:          var(--mv-forest);
	--mv-link-hover:    var(--mv-lime-600);
	--mv-primary:       var(--mv-forest);
	--mv-accent:        var(--mv-lime);

	/* Type */
	--mv-font-head: 'Barlow Semi Condensed', 'Arial Narrow', system-ui, sans-serif;
	--mv-font-body: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

	--mv-fs-12: 0.75rem;
	--mv-fs-14: 0.875rem;
	--mv-fs-16: 1rem;
	--mv-fs-18: 1.125rem;
	--mv-fs-20: 1.25rem;
	--mv-fs-24: 1.5rem;
	--mv-fs-28: 1.75rem;
	--mv-fs-32: 2rem;
	--mv-fs-40: 2.5rem;
	--mv-fs-48: 3rem;
	--mv-fs-56: 3.5rem;
	--mv-fs-64: 4rem;
	--mv-fs-80: 5rem;

	--mv-lh-tight: 1.05;
	--mv-lh-snug:  1.2;
	--mv-lh-base:  1.6;

	/* Spacing scale (4px base) */
	--mv-s-1:  0.25rem;
	--mv-s-2:  0.5rem;
	--mv-s-3:  0.75rem;
	--mv-s-4:  1rem;
	--mv-s-5:  1.25rem;
	--mv-s-6:  1.5rem;
	--mv-s-8:  2rem;
	--mv-s-10: 2.5rem;
	--mv-s-12: 3rem;
	--mv-s-16: 4rem;
	--mv-s-20: 5rem;
	--mv-s-24: 6rem;
	--mv-s-32: 8rem;

	/* Layout */
	--mv-container: 1200px;
	--mv-container-wide: 1360px;
	--mv-container-narrow: 880px;
	--mv-gutter: clamp(1rem, 4vw, 2.5rem);

	/* Radii / borders */
	--mv-radius-sm: 4px;
	--mv-radius:    6px;
	--mv-radius-lg: 12px;
	--mv-border-w:  1px;

	/* Shadows */
	--mv-shadow-sm: 0 1px 2px rgba(17,24,21,0.08);
	--mv-shadow:    0 8px 24px rgba(17,24,21,0.10);
	--mv-shadow-lg: 0 24px 60px rgba(17,24,21,0.18);

	/* Motion */
	--mv-ease:      cubic-bezier(0.2, 0.7, 0.2, 1);
	--mv-dur-fast:  140ms;
	--mv-dur:       240ms;
	--mv-dur-slow:  420ms;
}