/**
 * CSS Custom Properties
 *
 * All color, typography, and spacing tokens.
 * Source: WAYFINDER-DESIGN-SPEC.md
 *
 * @package Wayfinder
 * @since 1.0.0
 */

:root {
	/* Colors - Brand Palette */
	--color-navy: #2B3157;
	--color-lime: #D3D83B;
	--color-lime-highlight: #D9DC3E;
	--color-orange: #FF7A3D;
	--color-teal: #1BC7BA;
	--color-white: #FFFFFF;
	--color-card-bg: #F7F7F7;
	--color-dark-text: #313031;

	/* Colors - Footer */
	--color-footer-bg: #2B3157;
	--color-footer-label: #D3D83B;
	--color-footer-link: #FFFFFF;

	/* Colors - Borders */
	--color-border: rgba(255, 255, 255, 0.2);

	/* Typography - Font Families */
	--font-heading: 'Bebas Neue', sans-serif;
	--font-body: 'Roboto', sans-serif;

	/* Typography - Font Sizes (base values, scale as needed) */
	--font-size-hero: 60px;
	--font-size-nav: 22px;
	--font-size-product-name: 24px;
	--font-size-price: 22px;
	--font-size-label: 18px;
	--font-size-body: 16px;

	/* Typography - Font Weights */
	--font-weight-regular: 400;
	--font-weight-bold: 700;

	/* Spacing Scale */
	--space-xs: 4px;
	--space-sm: 8px;
	--space-md: 16px;
	--space-lg: 32px;
	--space-xl: 64px;
	--space-2xl: 96px;
	--space-section: clamp(48px, 8vw, 96px);

	/* Layout */
	--container-max-width: 1440px;
	--container-padding: clamp(1rem, 5vw, 120px);

	/* Transitions */
	--transition-fast: 150ms ease;
	--transition-base: 300ms ease;
}