/**
 * ALW design tokens — single source of truth (up-alw.lovable.app).
 *
 * @package ALW
 * @since   1.0.0
 */

:root {
	/* Colors (OKLCH) */
	--alw-background: oklch(99% 0.005 200);
	--alw-foreground: oklch(18% 0.04 220);
	--alw-foreground-80: oklch(18% 0.04 220 / 0.8);
	--alw-foreground-30: oklch(18% 0.04 220 / 0.3);
	--alw-foreground-20: oklch(18% 0.04 220 / 0.2);
	--alw-foreground-95: oklch(18% 0.04 220 / 0.95);
	--alw-primary: oklch(55% 0.09 195);
	--alw-primary-foreground: oklch(99% 0.005 195);
	--alw-primary-10: oklch(55% 0.09 195 / 0.1);
	--alw-primary-5: oklch(55% 0.09 195 / 0.05);
	--alw-primary-glow: oklch(68% 0.11 190);
	--alw-secondary: oklch(96% 0.015 195);
	--alw-secondary-foreground: oklch(28% 0.06 200);
	--alw-muted: oklch(96% 0.01 195);
	--alw-muted-40: oklch(96% 0.01 195 / 0.4);
	--alw-muted-foreground: oklch(50% 0.02 200);
	--alw-accent: oklch(94% 0.04 195);
	--alw-accent-foreground: oklch(25% 0.06 220);
	--alw-gold: oklch(78% 0.14 75);
	--alw-gold-foreground: oklch(22% 0.05 60);
	--alw-gold-20: oklch(78% 0.14 75 / 0.2);
	--alw-gradient-gold: linear-gradient(135deg, oklch(82% 0.14 80), oklch(72% 0.16 60));
	--alw-gradient-hero: linear-gradient(135deg, oklch(38% 0.08 200) 0%, oklch(52% 0.1 195) 55%, oklch(68% 0.11 190) 100%);
	--alw-gold-30: oklch(78% 0.14 75 / 0.3);
	--alw-primary-glow-40: oklch(68% 0.11 190 / 0.4);
	--alw-primary-foreground-85: oklch(99% 0.005 195 / 0.85);
	--alw-on-dark-muted: oklch(99% 0.005 200 / 0.75);
	--alw-card: oklch(100% 0 0);
	--alw-gradient-card: linear-gradient(160deg, oklch(100% 0 0) 0%, oklch(97% 0.012 195) 100%);
	--alw-border: oklch(90% 0.01 210);
	--alw-border-60: oklch(90% 0.01 210 / 0.6);
	--alw-background-85: oklch(99% 0.005 200 / 0.85);
	--alw-background-60: oklch(99% 0.005 200 / 0.6);
	--alw-background-95: oklch(99% 0.005 200 / 0.95);
	--alw-white: oklch(100% 0 0);
	--alw-white-90: oklch(100% 0 0 / 0.9);
	--alw-white-50: oklch(100% 0 0 / 0.5);
	--alw-white-30: oklch(100% 0 0 / 0.3);
	--alw-white-10: oklch(100% 0 0 / 0.1);
	--alw-hero-glow-teal: oklch(78% 0.13 190 / 0.55);
	--alw-hero-glow-gold: oklch(82% 0.14 80 / 0.35);
	--alw-hero-shade-top: rgb(10 30 40 / 0.15);
	--alw-hero-shade-bottom: rgb(10 30 40 / 0.55);
	--alw-hero-outline: rgb(255 255 255 / 0.85);

	/* Typography */
	--alw-font-body: "Open Sans", sans-serif;
	--alw-font-body-ar: "Tajawal", sans-serif;
	--alw-font-heading: "Google Sans", sans-serif;
	--alw-font-heading-ar: "Tajawal", sans-serif;
	--alw-font-weight-heading: 500;
	--alw-font-sans: var(--alw-font-body);
	--alw-font-sans-en: var(--alw-font-body);
	--alw-font-sans-ar: var(--alw-font-body-ar);
	--alw-font-size-body: 16px;
	--alw-line-height-body: 1.5;
	--alw-font-size-h1-sm: 30px;
	--alw-font-size-h1-md: 48px;
	--alw-font-size-h1-lg: 60px;
	--alw-font-size-h1-xl: 72px;
	--alw-font-size-h2: 36px;
	--alw-font-size-h3: 18px;
	--alw-font-size-subtitle-sm: 14px;
	--alw-font-size-subtitle: 16px;
	--alw-line-height-subtitle: 26px;
	--alw-font-size-eyebrow: 10px;
	--alw-font-size-eyebrow-lg: 11px;
	--alw-font-weight-eyebrow: 600;
	--alw-letter-spacing-eyebrow: 0.22em;
	--alw-letter-spacing-heading: -0.025em;
	--alw-nav-font-size: 13px;
	--alw-nav-font-weight: 400;
	--alw-nav-letter-spacing: 0.18em;
	--alw-nav-gap: 28px;
	--alw-btn-font-size: 12px;
	--alw-btn-font-weight: 700;
	--alw-btn-letter-spacing: 0.18em;

	/* Layout */
	--alw-container-max-width: 1280px;
	--alw-header-height: 80px;
	--alw-topbar-height: 36px;
	--alw-header-stack-height: calc(var(--alw-topbar-height) + var(--alw-header-height));
	--alw-header-max-width: 1400px;
	--alw-header-padding-x: 20px;
	--alw-header-padding-x-md: 32px;
	--alw-header-z-index: 50;
	--alw-footer-margin-top: 96px;
	--alw-section-padding-y-sm: 64px;
	--alw-section-padding-y-lg: 96px;
	--alw-section-padding-y-alt: 80px;
	--alw-container-padding-x: 16px;
	--alw-container-padding-x-md: 24px;

	/* Radius */
	--alw-radius-base: 0.875rem;
	--alw-radius-icon: 0.75rem;
	--alw-radius-card: 1rem;
	--alw-radius-card-lg: 1.5rem;
	--alw-radius-pill: 9999px;
	--alw-radius-nav-item: 8px;

	/* Effects */
	--alw-blur-sm: 8px;
	--alw-blur-md: 16px;
	--alw-transition: 150ms ease;
	--alw-shadow-soft: 0 10px 30px -12px oklch(55% 0.09 195 / 0.22);
	--alw-shadow-glow: 0 20px 60px -20px oklch(55% 0.09 195 / 0.45);
}
