/**
 * Wave Furniture Design Tokens
 * 
 * Palette:
 * - Primary: Grey & Deep Charcoal
 * - Secondary: Warm Cream & Natural Linen
 * - Supporting: Pure White, Muted Warm Neutrals
 */

:root {
	/* Primary Greys & Charcoals */
	--wave-grey-950: #121315;
	--wave-grey-900: #1a1b1e;
	--wave-grey-800: #292a2e;
	--wave-grey-700: #3c3e44;
	--wave-grey-600: #585b63;
	--wave-grey-500: #737780;
	--wave-grey-400: #9398a3;
	--wave-grey-300: #bdc1cc;
	--wave-grey-200: #e2e4e8;
	--wave-grey-100: #f1f3f5;

	/* Secondary Creams & Warm Neutrals */
	--wave-cream-50:  #fdfcf9;
	--wave-cream-100: #f7f4ee;
	--wave-cream-200: #efece3;
	--wave-cream-300: #e3ddd0;
	--wave-cream-400: #d0c7b5;
	--wave-cream-500: #b8ac97;
	--wave-taupe:      #8c8275;

	/* Core Canvas & Text */
	--wave-bg:          var(--wave-cream-50);
	--wave-bg-alt:      var(--wave-cream-100);
	--wave-surface:     #ffffff;
	--wave-surface-sub: var(--wave-cream-100);
	--wave-border:      var(--wave-cream-300);
	--wave-border-dark: var(--wave-grey-700);
	--wave-text-main:   var(--wave-grey-900);
	--wave-text-muted:  var(--wave-grey-600);
	--wave-text-light:  var(--wave-grey-400);
	--wave-white:       #ffffff;

	/* Brand Actions */
	--wave-accent:      var(--wave-grey-900);
	--wave-accent-hover:var(--wave-grey-800);
	--wave-whatsapp:    #25D366;
	--wave-whatsapp-hover: #1EBE5D;

	/* Typography */
	--wave-font-serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
	--wave-font-sans:  'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	--wave-font-mono:  'SF Mono', Consolas, Monaco, monospace;

	/* Fluid Typography Scale */
	--wave-text-xs:   0.75rem;     /* 12px */
	--wave-text-sm:   0.875rem;    /* 14px */
	--wave-text-base: 1rem;        /* 16px */
	--wave-text-md:   1.125rem;    /* 18px */
	--wave-text-lg:   1.25rem;     /* 20px */
	--wave-text-xl:   1.5rem;      /* 24px */
	--wave-text-2xl:  clamp(1.75rem, 2vw + 1rem, 2.25rem); /* 28-36px */
	--wave-text-3xl:  clamp(2.25rem, 3vw + 1rem, 3.25rem); /* 36-52px */
	--wave-text-hero: clamp(2.75rem, 5vw + 1rem, 4.5rem);  /* 44-72px */

	/* Spacing Scale */
	--wave-space-2xs: 0.25rem;  /* 4px */
	--wave-space-xs:  0.5rem;   /* 8px */
	--wave-space-sm:  0.75rem;  /* 12px */
	--wave-space-md:  1rem;     /* 16px */
	--wave-space-lg:  1.5rem;   /* 24px */
	--wave-space-xl:  2rem;     /* 32px */
	--wave-space-2xl: 3rem;     /* 48px */
	--wave-space-3xl: 4.5rem;   /* 72px */
	--wave-space-4xl: 6rem;     /* 96px */

	/* Layout Dimensions */
	--wave-container-max: 1380px;
	--wave-container-narrow: 860px;
	--wave-header-height: 84px;
	--wave-header-height-mobile: 68px;

	/* Refined Luxury Shadows */
	--wave-shadow-sm: 0 2px 8px rgba(26, 27, 30, 0.04);
	--wave-shadow-md: 0 8px 24px rgba(26, 27, 30, 0.06);
	--wave-shadow-lg: 0 16px 48px rgba(26, 27, 30, 0.08);
	--wave-shadow-card: 0 4px 20px rgba(26, 27, 30, 0.04);

	/* Curves & Borders (Minimalist, never cartoonish) */
	--wave-radius-sm: 3px;
	--wave-radius-md: 6px;
	--wave-radius-lg: 10px;
	--wave-radius-pill: 9999px;

	/* Motion & Transitions */
	--wave-ease: cubic-bezier(0.2, 0, 0.2, 1);
	--wave-transition-fast: 160ms var(--wave-ease);
	--wave-transition:      280ms var(--wave-ease);
	--wave-transition-slow: 450ms cubic-bezier(0.16, 1, 0.3, 1);
}