/* Nousable design tokens — mirrors the static landing's :root and aliases to theme.json presets so authored CSS keeps working as we port. */

:root {
	/* Surfaces */
	--cream:       var(--wp--preset--color--cream);
	--cream-2:     var(--wp--preset--color--cream-2);
	--cream-3:     var(--wp--preset--color--cream-3);
	--white:       var(--wp--preset--color--white);
	--header:      var(--wp--preset--color--header);
	--border-soft: var(--wp--preset--color--border-soft);

	/* Text */
	--ink:   var(--wp--preset--color--ink);
	--ink-2: var(--wp--preset--color--ink-2);
	--ink-3: var(--wp--preset--color--ink-3);
	--ink-4: var(--wp--preset--color--ink-4);

	/* Brand — primary scale */
	--primary-50:  var(--wp--preset--color--primary-50);
	--primary-100: var(--wp--preset--color--primary-100);
	--primary-200: var(--wp--preset--color--primary-200);
	--primary-300: var(--wp--preset--color--primary-300);
	--primary-400: var(--wp--preset--color--primary-400);
	--primary-500: var(--wp--preset--color--primary-500);
	--primary-600: var(--wp--preset--color--primary-600);
	--primary-700: var(--wp--preset--color--primary-700);
	--primary-800: var(--wp--preset--color--primary-800);
	--primary-900: var(--wp--preset--color--primary-900);
	--primary-950: var(--wp--preset--color--primary-950);

	/* Brand semantic aliases */
	--cyan:      var(--primary-500);
	--cyan-2:    var(--primary-600);
	--cyan-dark: var(--primary-700);
	--cyan-pale: var(--primary-100);
	--cyan-tint: var(--primary-50);

	/* Accent — pink scale */
	--accent-50:  var(--wp--preset--color--accent-50);
	--accent-100: var(--wp--preset--color--accent-100);
	--accent-200: var(--wp--preset--color--accent-200);
	--accent-300: var(--wp--preset--color--accent-300);
	--accent-400: var(--wp--preset--color--accent-400);
	--accent-500: var(--wp--preset--color--accent-500);
	--accent-600: var(--wp--preset--color--accent-600);
	--accent-700: var(--wp--preset--color--accent-700);
	--accent-800: var(--wp--preset--color--accent-800);
	--accent-900: var(--wp--preset--color--accent-900);
	--accent-950: var(--wp--preset--color--accent-950);

	/* Accent aliases */
	--purple:    var(--accent-500);
	--purple-bg: var(--accent-100);

	/* Status */
	--green:    var(--wp--preset--color--green);
	--green-bg: #E8F5ED;
	--amber:    var(--wp--preset--color--amber);
	--amber-bg: #FFF3DC;
	--blue:     var(--wp--preset--color--blue);
	--blue-bg:  #EBF0FD;
	--red:      var(--wp--preset--color--red);
	--red-bg:   #FDECEA;

	/* Radii */
	--r-2xs: 2px; --r-xs: 4px;
	--r-sm: 8px; --r-md: 16px; --r-lg: 16px; --r-xl: 16px;
	--r-2xl: 16px; --r-3xl: 16px; --r-full: 9999px;

	/* Shadows */
	--sh-card: var(--wp--preset--shadow--card);
	--sh-lift: var(--wp--preset--shadow--lift);
	--sh-hard: var(--wp--preset--shadow--hard);
	--sh-ring: 0 0 0 7px var(--primary-50);

	/* Glass blur — backdrop-filter (for glass surfaces).
	   Reduced ~35-40% from original 24/18/28/48 to lighten GPU compositing
	   during scroll. Visual difference is minimal at this range. */
	--blur-panel:   14px;
	--blur-control: 10px;
	--blur-hover:   18px;

	/* Glow blur — filter: blur() for radial-glow effects */
	--blur-glow: 32px;

	/* Glass surfaces — translucent white for glassmorphism panels */
	--surface-glass:        rgba(255, 255, 255, 0.55);
	--surface-glass-strong: rgba(255, 255, 255, 0.78);
	--surface-glass-border: rgba(255, 255, 255, 0.65);

	/* Fonts */
	--font:  var(--wp--preset--font-family--sans);
	--serif: var(--wp--preset--font-family--serif);
	--ease-out:    cubic-bezier(.22,1,.36,1);
	--ease-spring: cubic-bezier(.34,1.56,.64,1);
}
