/*
 * Design tokens — آوا ثانی
 * Minimal / Luxury / Editorial / Natural. Generous white space, muted nude
 * accent, near-black text. All spacing/typography in rem so a font swap
 * from wp-admin never breaks layout.
 */
:root {
	/* Color */
	--c-ivory: #FBF8F4;
	--c-bg: var(--c-ivory);
	--c-surface: #FFFFFF;
	--c-band: #F4EEE5; /* warm beige section band */
	--c-nude: #E9DCCC; /* soft nude */
	--c-border: #E6DCCE;
	--c-charcoal: #221E1B;
	--c-text: var(--c-charcoal);
	--c-text-soft: #6F6459;
	--c-text-faint: #9C8F80;
	--c-dark: #1B1714; /* near-black band, mirrors reference's dark sections */
	--c-dark-text: #F3ECE2;
	--c-dark-text-soft: #C9BBAA;
	--c-accent: #A9695C; /* muted rose / nude terracotta */
	--c-accent-dark: #8F5548;
	--c-accent-soft: #EFDAD2;
	--c-white: #FFFFFF;
	--c-overlay: rgba(27, 23, 20, 0.45);

	/* Typography */
	--font-fa: 'Vazirmatn', Tahoma, system-ui, sans-serif;
	--font-display: var(--font-fa);
	--lh-tight: 1.25;
	--lh-normal: 1.65;
	--lh-loose: 1.9;

	--fs-h1: clamp(2rem, 1.35rem + 3vw, 3.75rem);
	--fs-h2: clamp(1.6rem, 1.2rem + 1.8vw, 2.75rem);
	--fs-h3: clamp(1.25rem, 1.05rem + 0.9vw, 1.75rem);
	--fs-h4: clamp(1.1rem, 1rem + 0.4vw, 1.3rem);
	--fs-lead: clamp(1.05rem, 0.95rem + 0.4vw, 1.25rem);
	--fs-body: 1rem;
	--fs-small: 0.875rem;
	--fs-caption: 0.75rem;

	/* Spacing scale */
	--sp-1: 0.25rem;
	--sp-2: 0.5rem;
	--sp-3: 0.75rem;
	--sp-4: 1rem;
	--sp-5: 1.5rem;
	--sp-6: 2rem;
	--sp-7: 2.5rem;
	--sp-8: 3rem;
	--sp-9: 4rem;
	--sp-10: 5rem;
	--sp-11: 6.5rem;
	--sp-12: 8rem;

	--section-space: clamp(3.5rem, 2.5rem + 4vw, 8rem);
	--section-space-sm: clamp(2.5rem, 2rem + 2vw, 5rem);

	/* Layout */
	--container-max: 1280px;
	--container-pad: 1.25rem;
	--radius-sm: 6px;
	--radius-md: 14px;
	--radius-lg: 28px;
	--radius-pill: 999px;

	/* Motion */
	--ease: cubic-bezier(0.22, 1, 0.36, 1);
	--dur-fast: 0.2s;
	--dur-base: 0.45s;
	--dur-slow: 0.9s;

	/* Elevation */
	--shadow-sm: 0 2px 10px rgba(34, 30, 27, 0.06);
	--shadow-md: 0 12px 32px rgba(34, 30, 27, 0.10);
	--shadow-lg: 0 24px 60px rgba(34, 30, 27, 0.16);

	--header-h: 84px;
}

@media (max-width: 767px) {
	:root {
		--container-pad: 1.125rem;
		--header-h: 68px;
	}
}
