:root {

    /* ----------------------------------------------
    color 
    ---------------------------------------------- */
    --color-light: #fefefe;
    --color-dark: #111;
    --color-global-bg: var(--color-dark);
    --color-global-text: var(--color-light);

    /* ---------------------------------- 
    gutter 
    ---------------------------------- */
    --gutter: var(--space-m);

    /* ----------------------------------
    space (for gutter, gap, margin)
    ---------------------------------- */ 
    --space-2xs: clamp(0.375rem,0.3414rem + 0.1678vi,0.5rem);
    --space-xs: clamp(0.5625rem,0.5122rem + 0.2517vi,0.75rem);
    --space-s: clamp(0.75rem,0.6829rem + 0.3356vi,1rem);
    --space-m: clamp(1.125rem,1.0243rem + 0.5034vi,1.5rem);
    --space-l: clamp(1.5rem,1.3658rem + 0.6711vi,2rem);
    --space-xl: clamp(1.875rem,1.7072rem + 0.8389vi,2.5rem);
    --space-2xl: clamp(3rem,2.7315rem + 1.3423vi,4rem);
    --space-3xl: clamp(3.75rem,3.4144rem + 1.6779vi,5rem);
    --space-4xl: clamp(5.625rem,5.1216rem + 2.5168vi,7.5rem);
    
    --space-2xs-xs: clamp(0.375rem,0.2743rem + 0.5034vi,0.75rem);
    --space-xs-s: clamp(0.5625rem,0.4451rem + 0.5872vi,1rem);
    --space-s-m: clamp(0.75rem,0.5487rem + 1.0067vi,1.5rem);
    --space-m-l: clamp(1.125rem,0.8901rem + 1.1745vi,2rem);
    --space-l-xl: clamp(1.5rem,1.2315rem + 1.3423vi,2.5rem);
    --space-xl-2xl: clamp(1.875rem,1.3045rem + 2.8523vi,4rem);
    --space-2xl-3xl: clamp(3rem,2.4631rem + 2.6846vi,5rem);
    --space-3xl-4xl: clamp(3.75rem,2.7433rem + 5.0336vi,7.5rem);
    --space-s-l: clamp(0.75rem,0.4144rem + 1.6779vi,2rem);
    --space-l-3xl: clamp(1.5rem,0.5604rem + 4.698vw,5rem);

    /* ----------------------------------
    stroke (for border)
    ---------------------------------- */ 
    /* --stroke: 1px solid var(--stroke-color,currentColor); */
    --stroke: 1px solid white;/* mio */
    --stroke-color: var(--color-dark);
    --stroke-mid: 1px solid var(--stroke-mid-color,var(--color-mid));
    --stroke-weight-light: 1px;
    --stroke-weight-medium: 3px;
    --stroke-weight-heavy: 6px;

    /* ----------------------------------
    wrapper 
    ---------------------------------- */
    /* --wrapper-max-width: 1680px; */
    --wrapper-max-width: 55rem;

}
