/**
 * Lume Urban Ink — design tokens.
 * Ported 1:1 from the design bundle's tokens/{fonts,colors,typography,spacing}.css.
 * Every component partial and template in this theme reads these custom properties —
 * change the brand here, not in the templates.
 */
@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@700&family=Unbounded:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;700&display=swap');

:root {
	/* color — base */
	--ink: #111111;
	--paper: #FFFFFF;
	--ash: #EDEDED;
	--smoke: #6B6B6B;
	--graphite: #3A3A3A;
	--acid: #F2FF3D;
	--scrim: rgba(17, 17, 17, .5);
	--scrim-soft: rgba(17, 17, 17, .35);
	--paper-glass: rgba(255, 255, 255, .94);
	/* color — semantic */
	--text-body: var(--ink);
	--text-secondary: var(--graphite);
	--text-muted: var(--smoke);
	--text-inverse: var(--paper);
	--surface-page: var(--paper);
	--surface-card: var(--paper);
	--surface-placeholder: var(--ash);
	--surface-selected: var(--acid);
	--surface-inverse: var(--ink);
	--border-default: var(--ink);
	--border-width: 1px;
	--border-strong: 1.5px;
	--link: var(--ink);

	/* type — families */
	--font-script: 'Caveat', cursive;
	--font-display: 'Unbounded', sans-serif;
	--font-body: 'IBM Plex Sans', system-ui, sans-serif;
	--font-mono: 'IBM Plex Mono', monospace;
	/* type — script (logo / set name) */
	--script-hero: 700 96px/.85 var(--font-script);
	--script-logo: 700 42px/1 var(--font-script);
	--script-footer: 700 64px/1 var(--font-script);
	/* type — display labels: always uppercase, tracked */
	--display-h2: 500 14px/1.4 var(--font-display);
	--display-eyebrow: 500 12px/1.4 var(--font-display);
	--display-sub: 500 13px/1.4 var(--font-display);
	--display-menu: 500 20px/1.2 var(--font-display);
	--display-cta: 600 13px/1 var(--font-display);
	--tracking-display: .1em;
	--tracking-cta: .08em;
	/* type — body */
	--body-lg: 400 18px/1.4 var(--font-body);
	--body-md: 400 15px/1.45 var(--font-body);
	--body-sm: 400 14px/1.55 var(--font-body);
	--body-xs: 400 12.5px/1.4 var(--font-body);
	--label-md: 600 14px/1.3 var(--font-body);
	--label-lg: 500 17px/1.3 var(--font-body);
	/* type — mono: prices, meta, counters */
	--mono-price-xl: 500 34px/1 var(--font-mono);
	--mono-stat-lg: 400 28px/1 var(--font-mono);
	--mono-price-lg: 400 20px/1 var(--font-mono);
	--mono-price: 400 13px/1 var(--font-mono);
	--mono-meta: 400 11px/1.4 var(--font-mono);
	--tracking-meta: .08em;

	/* spacing */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 20px;
	--space-6: 24px;
	--space-7: 32px;
	--space-8: 56px;
	--page-gutter: 20px;
	--page-max: 430px;
	--wrap-max: 1200px;
	--radius: 0;
	--hit-min: 44px;
	--header-h: 60px;
	--cta-h: 58px;
	--cta-h-sm: 52px;
	--control-h: 40px;
	--ease-out: cubic-bezier(.2, .8, .2, 1);
	--dur-fast: .2s;
	--dur-med: .3s;
	--dur-slow: .45s;
}