/**
 * Mishtam design tokens — Plus Jakarta Sans, refined layout
 */

:root {
	/* Colors — Velvet Burgundy, Champagne Gold & Cream Porcelain */
	--ms-bg: #ffffff;
	--ms-bg-soft: #fcf9f6;
	--ms-bg-muted: #f7f2ed;
	--ms-primary: #800020;
	--ms-primary-hover: #5c0017;
	--ms-primary-light: #faf0f2;
	--ms-primary-glow: rgba(128, 0, 32, 0.25);
	--ms-accent: #c59b27;
	--ms-accent-gold: #d4af37;
	--ms-accent-light: #fef9e7;
	--ms-text: #1c1819;
	--ms-text-muted: #6e6568;
	--ms-text-inverse: #ffffff;
	--ms-border: #ede4e6;
	--ms-border-light: #f5eeef;
	--ms-error: #dc2626;
	--ms-success: #15803d;
	--ms-star: #d4af37;

	/* Gradients */
	--ms-gradient-primary: linear-gradient(135deg, #800020 0%, #a31238 50%, #c59b27 100%);
	--ms-gradient-hero: linear-gradient(108deg, rgba(28, 12, 18, 0.88) 0%, rgba(38, 14, 22, 0.65) 50%, rgba(197, 155, 39, 0.3) 100%);
	--ms-gradient-gold: linear-gradient(135deg, #d4af37 0%, #f3e5ab 50%, #c59b27 100%);
	--ms-gradient-soft: linear-gradient(180deg, #fcf9f6 0%, #ffffff 100%);

	/* Radius */
	--ms-radius-sm: 8px;
	--ms-radius-md: 14px;
	--ms-radius-lg: 20px;
	--ms-radius-xl: 32px;
	--ms-radius-pill: 999px;

	/* Shadows & Glassmorphism */
	--ms-shadow-xs: 0 1px 3px rgba(28, 24, 25, 0.04);
	--ms-shadow-sm: 0 2px 10px rgba(28, 24, 25, 0.06);
	--ms-shadow-md: 0 8px 28px rgba(28, 24, 25, 0.08);
	--ms-shadow-lg: 0 16px 48px rgba(28, 24, 25, 0.12);
	--ms-shadow-card: 0 6px 24px rgba(128, 0, 32, 0.06);
	--ms-shadow-card-hover: 0 16px 40px rgba(128, 0, 32, 0.18);
	--ms-glass-bg: rgba(255, 255, 255, 0.85);
	--ms-glass-border: rgba(197, 155, 39, 0.25);

	/* Layout */
	--ms-container: 1280px;
	--ms-container-wide: 1360px;
	--ms-container-x: clamp(20px, 3vw, 48px);
	--ms-section-y: 52px;
	--ms-section-y-lg: 64px;
	--ms-grid-gap: 28px;

	/* Spacing */
	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;
	--space-8: 64px;
	--space-9: 88px;

	/* Typography — Playfair Display (Serif Headings) + Outfit (Modern Body) */
	--ms-font: "Outfit", "Plus Jakarta Sans", system-ui, -apple-system, sans-serif;
	--ms-font-display: "Playfair Display", Georgia, serif;
	--ms-hero-h1: clamp(2.25rem, 5vw, 3.75rem);
	--ms-hero-sub: clamp(1.0625rem, 1.8vw, 1.25rem);
	--ms-h2: clamp(1.85rem, 3.4vw, 2.5rem);
	--ms-h3: 1.5rem;
	--ms-card-title: 1.125rem;
	--ms-price: 1.1875rem;
	--ms-body: 1rem;
	--ms-small: 0.875rem;
	--ms-button: 0.9375rem;
	--ms-badge: 0.75rem;
	--ms-countdown: 1.25rem;
	--ms-letter-tight: -0.025em;
	--ms-letter-wide: 0.08em;

	/* Motion */
	--ms-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--ms-ease-out: cubic-bezier(0.33, 1, 0.68, 1);
	--ms-duration: 0.35s;
	--ms-duration-slow: 0.6s;

	/* Components */
	--ms-header-height: 76px;
	--ms-header-height-mobile: 64px;
	--ms-btn-height: 50px;
}
}

/* Large desktop — use more width on 1920px+ monitors; Mac sizes unchanged below 1600px */
@media (min-width: 1600px) {
	:root {
		--ms-container: 1440px;
		--ms-container-wide: 1540px;
		--ms-container-x: clamp(24px, 2.2vw, 36px);
	}
}

@media (min-width: 1800px) {
	:root {
		--ms-container: 1520px;
		--ms-container-wide: 1680px;
		--ms-container-x: 32px;
	}
}

@media (max-width: 1024px) and (min-width: 768px) {
	:root {
		--ms-container-x: 28px;
		--ms-section-y: 44px;
		--ms-grid-gap: 20px;
	}
}

@media (max-width: 767px) {
	:root {
		--ms-container-x: 16px;
		--ms-section-y: 40px;
		--ms-section-y-lg: 48px;
		--ms-grid-gap: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--ms-duration: 0.01ms;
		--ms-duration-slow: 0.01ms;
	}
}