/**
 * SLINKOR design tokens.
 *
 * These variables document the shared visual foundation without overriding
 * Blocksy components or WordPress content on their own.
 */

:root {
	/* Colors. */
	--slinkor-color-brand: #00AEEF;
	--slinkor-color-brand-hover: #009BD7;
	--slinkor-color-brand-hover-strong: #008FD6;
	--slinkor-color-heading: #1D1D1F;
	--slinkor-color-text: #62676F;
	--slinkor-color-text-secondary: #6C7379;
	--slinkor-color-background: #FFFFFF;
	--slinkor-color-header-background: #FAFBFC;
	--slinkor-color-surface: #F7F8FA;
	--slinkor-color-border: #E5E8EB;
	--slinkor-color-border-subtle: #EEEEEE;

	/* Typography. */
	--slinkor-font-heading: "Barlow", "Helvetica Neue", Arial, sans-serif;
	--slinkor-font-navigation: var(--slinkor-font-heading);
	--slinkor-font-button: var(--slinkor-font-heading);
	--slinkor-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

	/* Layout. */
	--slinkor-content-width: 1200px;
	--slinkor-product-description-width: 1120px;
	--slinkor-outer-padding-desktop: 24px;
	--slinkor-outer-padding-mobile: 18px;

	/* Radius. */
	--slinkor-radius-small: 10px;
	--slinkor-radius-medium: 12px;
	--slinkor-radius-card: 14px;
	--slinkor-radius-pill: 999px;

	/* Buttons. */
	--slinkor-button-height: 50px;
	--slinkor-button-padding-inline: 30px;
	--slinkor-button-radius: 14px;
	--slinkor-button-font-size: 15px;
	--slinkor-button-font-weight: 600;

	/* Shadows. */
	--slinkor-shadow-card: 0 8px 22px rgba(20, 30, 40, 0.045);
	--slinkor-shadow-elevated: 0 12px 30px rgba(20, 30, 40, 0.055);
	--slinkor-shadow-mega: 0 24px 66px rgba(16, 24, 40, 0.11);

	/* Motion. */
	--slinkor-duration-standard: 0.25s;
	--slinkor-duration-image: 0.65s;
	--slinkor-easing-standard: ease;
	--slinkor-transition-standard: var(--slinkor-duration-standard) var(--slinkor-easing-standard);
	--slinkor-transition-image: var(--slinkor-duration-image) var(--slinkor-easing-standard);

	/* Spacing scale. */
	--slinkor-space-0: 0;
	--slinkor-space-1: 4px;
	--slinkor-space-2: 8px;
	--slinkor-space-3: 12px;
	--slinkor-space-4: 16px;
	--slinkor-space-5: 24px;
	--slinkor-space-6: 32px;
	--slinkor-space-7: 48px;
	--slinkor-space-8: 64px;
	--slinkor-space-9: 80px;
}