:root {
    /* Grayscale Colors */
    --grayscale-50: #FFFBF1;
    --grayscale-400: #DACEC5;
    --grayscale-700: #7C7169;
    --grayscale-800: #5C514A;
    --grayscale-900: #382F28;

    /* Ocre Colors */
    --ocre-100: #F0DEBB;
    --ocre-200: #E7C990;
    --ocre-600: #CF8D3D;
    --ocre-900: #B2622F;

    /* Brown Colors */
    --brown-900: #4A1300;
    --borwn-600: #773B19;
    --brown-500: #82441E;
    --brown-400: #9B5E3A;

    /* Spacing */
    --spacing-xxs: 0.25rem;
    --spacing-xs: 0.5rem;
    --spacing-sm: 0.75rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-xxl: 2.5rem;
    --spacing-xxxl: 3rem;
    --spacing-4xl: 3.5rem;
    
    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 5rem;

    /* Font Weight */
    --fw-thin: 200;
    --fw-normal: 400;
    --fw-semibold: 500;
    --fw-bold: 700;

    /* Font Size */
    --fs-title: clamp(1.5rem, 5vw, 2rem);
    --fs-subtitle: clamp(1.25rem, 4vw, 1.5rem);
    --fs-button: clamp(1rem, 2.5vw, 1.125rem);
    --fs-text: clamp(0.875rem, 2vw, 1rem);
    --fs-subtext: clamp(0.75rem, 1.5vw, 0.875rem);

    /* Font Family */
    --ff-title: 'Dancing Script', 'sans-serif';
    --ff-subtitle: 'Khula', 'sans-serif';
    --ff-text: 'Open Sans', 'sans-serif';
}