/*
 * Design tokens ported from the AviranX Next.js reference (globals.css /
 * tailwind.config.ts). Single fixed dark palette — no light mode exists in
 * the source design, so none is defined here.
 */
:root {
	/* Fonts */
	--font-sora: 'Sora', system-ui, sans-serif;
	--font-dm-sans: 'DM Sans', system-ui, sans-serif;
	--font-jetbrains: 'JetBrains Mono', ui-monospace, monospace;

	/* Colors */
	--color-bg: #080f1a;
	--color-surface: #0b1929;
	--color-surface-elevated: #14233a;
	--color-surface-alt: rgba(255, 255, 255, 0.03);
	--color-border: rgba(255, 255, 255, 0.08);
	--color-border-teal: rgba(0, 200, 180, 0.25);
	--color-teal: #00c8b4;
	--color-teal-soft: rgba(0, 200, 180, 0.12);
	--color-teal-glow: rgba(0, 200, 180, 0.08);
	--color-teal-bright: #00e5a0;
	--color-ocean: #008cc8;
	--color-text: #e0e4e8;
	--color-text-dim: #9ba3ad;
	--color-text-dimmer: #6b7280;
	--color-text-muted: #3a3f47;
	--color-alert: #ff6b6b;
	--color-warm: #ffb84d;
	--color-violet: #a78bfa;

	/* Radius */
	--radius-sm: 8px;
	--radius: 10px;
	--radius-md: 12px;
	--radius-lg: 16px;
	--radius-xl: 24px;

	/* Shadows */
	--shadow-teal-glow: 0 0 60px -10px rgba(0, 200, 180, 0.25);
	--shadow-soft-lift: 0 4px 16px -4px rgba(0, 0, 0, 0.3);

	/* Type scale */
	--text-eyebrow: 12px;
	--text-small: 14px;
	--text-body: 16px;
	--text-lead: 20px;
	--text-h4: 20px;
	--text-h3: 28px;
	--text-h2: 40px;
	--text-h1: 56px;
	--text-display: 72px;

	/* Motion */
	--ease-reveal: cubic-bezier(0.22, 1, 0.36, 1);
}