/* ==========================================================
   AXN Portfolio Design System
   Version: 1.0
   ========================================================== */

:root {

    /* ======================================================
       COLORS
       ====================================================== */

    --color-bg: #FAFAF8;
    --color-surface: #FFFFFF;

    --color-text: #111111;
    --color-text-secondary: #5F5F5F;
    --color-text-tertiary: #8A8A8A;

    --color-border: #E7E7E3;

    --color-black: #000000;
    --color-white: #FFFFFF;



    /* ======================================================
       TYPOGRAPHY
       ====================================================== */

    --font-family:
        "Inter",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;



    /* ======================================================
       FONT SCALE
       ====================================================== */

    --text-xs: .75rem;
    --text-sm: .85rem;
    --text-base: 0.95rem;
    --text-md: 1.05rem;
    --text-lg: 1.2rem;

    --text-xl:
        clamp(1.5rem, 3.2vw, 2.25rem);

    --text-2xl:
        clamp(2.25rem, 4.5vw, 3.5rem);

    --text-hero:
        clamp(2.75rem, 5.5vw, 4.5rem);




    /* ======================================================
       LINE HEIGHT
       ====================================================== */

    --leading-tight: .95;
    --leading-normal: 1.6;
    --leading-loose: 1.9;



    /* ======================================================
       LETTER SPACING
       ====================================================== */

    --tracking-tight: -.07em;
    --tracking-normal: 0;
    --tracking-wide: .18em;



    /* ======================================================
       SPACING
       8px system
       ====================================================== */

    --space-1: .5rem;
    /* 8 */

    --space-2: 1rem;
    /* 16 */

    --space-3: 1.5rem;
    /* 24 */

    --space-4: 2rem;
    /* 32 */

    --space-5: 3rem;
    /* 48 */

    --space-6: 4rem;
    /* 64 */

    --space-7: 6rem;
    /* 96 */

    --space-8: 8rem;
    /* 128 */

    --space-9: 10rem;
    /* 160 */

    --space-10: 12rem;
    /* 192 */



    /* ======================================================
       LAYOUT
       ====================================================== */

    --container-width: 1240px;

    --container-padding: 5vw;

    --section-spacing: var(--space-7);

    --project-spacing: var(--space-6);

    /* Exhibition Rhythm Spacing */
    --gap-huge: clamp(12rem, 24vh, 22rem);
    --gap-large: clamp(6rem, 12vh, 10rem);
    --gap-medium: clamp(3rem, 6vh, 4.5rem);
    --gap-small: clamp(1.25rem, 2.5vh, 2.25rem);
    --gap-tiny: clamp(0.4rem, 0.8vh, 0.75rem);




    /* ======================================================
       BORDER RADIUS
       ====================================================== */

    --radius-none: 0;

    --radius-small: 8px;

    --radius-medium: 18px;

    --radius-large: 28px;



    /* ======================================================
       TRANSITIONS
       ====================================================== */

    --transition-fast: .2s ease;

    --transition-base: .35s ease;

    --transition-slow: .6s cubic-bezier(.22, .61, .36, 1);



    /* ======================================================
       SHADOWS
       (Minimal by design)
       ====================================================== */

    --shadow-none: none;

}