/* ════════════════════════════════════════════════════════════════════════
   NDS PRIMITIVES — dimension scales, copied from _sass/tokens/_primitives.scss
   Spacing (4px grid), radii, fluid + static typography ladders.
   ════════════════════════════════════════════════════════════════════════ */
:root {
    /* Spacing — 4px grid (DGA Figma sheet numbers in comments) */
    --spacing-none: 0px;   /* 0 */
    --spacing-xxs: 2px;    /* 0.5 */
    --spacing-xs: 4px;     /* 1 */
    --spacing-sm: 6px;     /* 1.5 */
    --spacing-md: 8px;     /* 2 */
    --spacing-lg: 12px;    /* 3 */
    --spacing-xl: 16px;    /* 4 */
    --spacing-2xl: 20px;   /* 5 */
    --spacing-3xl: 24px;   /* 6 */
    --spacing-4xl: 32px;   /* 8 */
    --spacing-5xl: 40px;   /* 10 */
    --spacing-6xl: 48px;   /* 12 */
    --spacing-7xl: 64px;   /* 16 */
    --spacing-8xl: 80px;   /* 20 */
    --spacing-9xl: 96px;   /* 24 */
    --spacing-10xl: 128px; /* 32 */
    --spacing-11xl: 160px; /* 40 */

    --radius-none: 0;
    --radius-xs: 2px;
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 16px;
    --radius-xl: 24px;
    --radius-full: 9999px;

    /* Fluid typography — display */
    --typo-display-clamp-2xl-FS: calc(clamp(48px, 6vw, 72px) * var(--user-font-scale, 1));
    --typo-display-clamp-2xl-LH: calc(clamp(58px, 7.5vw, 90px) * var(--user-font-scale, 1));
    --typo-display-clamp-2xl-MB: clamp(14.5px, 1.875vw, 22.5px); /* @kind spacing */

    --typo-display-clamp-xl-FS: calc(clamp(40px, 5vw, 60px) * var(--user-font-scale, 1));
    --typo-display-clamp-xl-LH: calc(clamp(44px, 6vw, 72px) * var(--user-font-scale, 1));
    --typo-display-clamp-xl-MB: clamp(11px, 1.5vw, 18px); /* @kind spacing */

    --typo-display-clamp-lg-FS: calc(clamp(32px, 3.75vw, 48px) * var(--user-font-scale, 1));
    --typo-display-clamp-lg-LH: calc(clamp(38px, 5vw, 60px) * var(--user-font-scale, 1));
    --typo-display-clamp-lg-MB: clamp(9.5px, 1.25vw, 15px); /* @kind spacing */

    --typo-display-clamp-md-FS: calc(clamp(24px, 3vw, 36px) * var(--user-font-scale, 1));
    --typo-display-clamp-md-LH: calc(clamp(30px, 3.67vw, 44px) * var(--user-font-scale, 1));
    --typo-display-clamp-md-MB: clamp(7.5px, 0.9175vw, 11px); /* @kind spacing */

    --typo-display-clamp-sm-FS: calc(clamp(20px, 2.5vw, 30px) * var(--user-font-scale, 1));
    --typo-display-clamp-sm-LH: calc(clamp(26px, 3.17vw, 38px) * var(--user-font-scale, 1));
    --typo-display-clamp-sm-MB: clamp(6.5px, 0.7925vw, 9.5px); /* @kind spacing */

    --typo-display-clamp-xs-FS: calc(clamp(18px, 2vw, 24px) * var(--user-font-scale, 1));
    --typo-display-clamp-xs-LH: calc(clamp(24px, 2.5vw, 30px) * var(--user-font-scale, 1));
    --typo-display-clamp-xs-MB: clamp(6px, 0.625vw, 7.5px); /* @kind spacing */

    /* Fluid typography — text */
    --typo-text-clamp-xl-FS: calc(clamp(16px, 1.875vw, 20px) * var(--user-font-scale, 1));
    --typo-text-clamp-xl-LH: calc(clamp(26px, 2.33vw, 28px) * var(--user-font-scale, 1));

    --typo-text-clamp-lg-FS: calc(clamp(14px, 1.67vw, 18px) * var(--user-font-scale, 1));
    --typo-text-clamp-lg-LH: calc(clamp(24px, 2.17vw, 26px) * var(--user-font-scale, 1));

    --typo-text-clamp-md-FS: calc(clamp(12px, 1.46vw, 16px) * var(--user-font-scale, 1));
    --typo-text-clamp-md-LH: calc(clamp(22px, 2vw, 24px) * var(--user-font-scale, 1));

    --typo-text-clamp-sm-FS: calc(clamp(10px, 1.25vw, 14px) * var(--user-font-scale, 1));
    --typo-text-clamp-sm-LH: calc(clamp(20px, 1.83vw, 22px) * var(--user-font-scale, 1));

    --typo-text-clamp-xs-FS: calc(clamp(8px, 1.04vw, 12px) * var(--user-font-scale, 1));
    --typo-text-clamp-xs-LH: calc(clamp(16px, 1.67vw, 20px) * var(--user-font-scale, 1));

    --typo-text-clamp-2xs-FS: calc(clamp(8px, 0.83vw, 10px) * var(--user-font-scale, 1));
    --typo-text-clamp-2xs-LH: calc(clamp(14px, 1.33vw, 16px) * var(--user-font-scale, 1));

    /* Static display sizes */
    --typo-display-2xl-FS: calc(72px * var(--user-font-scale, 1));
    --typo-display-2xl-LH: calc(90px * var(--user-font-scale, 1));
    --typo-display-xl-FS:  calc(60px * var(--user-font-scale, 1));
    --typo-display-xl-LH:  calc(72px * var(--user-font-scale, 1));
    --typo-display-lg-FS:  calc(48px * var(--user-font-scale, 1));
    --typo-display-lg-LH:  calc(60px * var(--user-font-scale, 1));
    --typo-display-md-FS:  calc(36px * var(--user-font-scale, 1));
    --typo-display-md-LH:  calc(44px * var(--user-font-scale, 1));
    --typo-display-sm-FS:  calc(30px * var(--user-font-scale, 1));
    --typo-display-sm-LH:  calc(38px * var(--user-font-scale, 1));
    --typo-display-xs-FS:  calc(24px * var(--user-font-scale, 1));
    --typo-display-xs-LH:  calc(32px * var(--user-font-scale, 1));

    /* Static text sizes */
    --typo-text-xl-FS:  calc(20px * var(--user-font-scale, 1));
    --typo-text-xl-LH:  calc(30px * var(--user-font-scale, 1));
    --typo-text-lg-FS:  calc(18px * var(--user-font-scale, 1));
    --typo-text-lg-LH:  calc(28px * var(--user-font-scale, 1));
    --typo-text-md-FS:  calc(16px * var(--user-font-scale, 1));
    --typo-text-md-LH:  calc(24px * var(--user-font-scale, 1));
    --typo-text-sm-FS:  calc(14px * var(--user-font-scale, 1));
    --typo-text-sm-LH:  calc(20px * var(--user-font-scale, 1));
    --typo-text-xs-FS:  calc(12px * var(--user-font-scale, 1));
    --typo-text-xs-LH:  calc(18px * var(--user-font-scale, 1));
    --typo-text-2xs-FS: calc(10px * var(--user-font-scale, 1));
    --typo-text-2xs-LH: calc(16px * var(--user-font-scale, 1));
}
