:root {
    /* ─── Fluid Spacing (به جای padding/margin ثابت) ─── */
    --space-xs:  clamp(0.5rem,  1vw,   0.75rem);   /*  8px → 12px */
    --space-sm:  clamp(0.75rem, 1.5vw, 1rem);      /* 12px → 16px */
    --space-md:  clamp(1rem,    2vw,   1.5rem);    /* 16px → 24px */
    --space-lg:  clamp(1.5rem,  3vw,   2.5rem);    /* 24px → 40px */
    --space-xl:  clamp(2rem,    4vw,   4rem);      /* 32px → 64px */
    --space-2xl: clamp(3rem,    6vw,   6rem);      /* 48px → 96px */

    /* ─── Fluid Typography ─── */
    --text-xs:   clamp(0.7rem,  0.65rem + 0.25vw, 0.8rem);
    --text-sm:   clamp(0.8125rem, 0.78rem + 0.3vw, 0.9375rem);
    --text-base: clamp(0.9375rem, 0.9rem + 0.4vw, 1.0625rem);
    --text-lg:   clamp(1.125rem, 1rem + 0.6vw, 1.375rem);
    --text-xl:   clamp(1.375rem, 1.1rem + 1.2vw, 1.875rem);
    --text-2xl:  clamp(1.75rem,  1.3rem + 2vw,   2.75rem);
    --text-3xl:  clamp(2.25rem,  1.5rem + 3vw,   3.5rem);

    /* ─── Fluid Container ─── */
    --container-pad: clamp(1rem, 3vw, 2rem);
    --container-max: min(100% - 2 * var(--container-pad), 1120px);

    /* ─── Fluid Radius ─── */
    --radius-sm: clamp(8px, 1.2vw, 12px);
    --radius-md: clamp(12px, 1.8vw, 18px);
    --radius-lg: clamp(16px, 2.5vw, 24px);

    /* ─── Breakpoints (مرجع) ─── */
    --bp-sm: 640px;
    --bp-md: 768px;
    --bp-lg: 1024px;
    --bp-xl: 1280px;
}