/*=========================================================
    KKF DESIGN TOKENS v2.0
=========================================================*/

:root {

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

    --kk-primary: #C62828;
    --kk-primary-dark: #8E0000;
    --kk-secondary: #FFB300;
    --kk-gold: #D4AF37;

    /*=====================================================
        BACKGROUND
    =====================================================*/

    --kk-bg: #FFF8F0;
    --kk-bg-light: #FFFCF8;
    --kk-bg-dark: #222222;

    --kk-surface: #FFFFFF;

    /*=====================================================
        TEXT
    =====================================================*/

    --kk-text: #212121;
    --kk-text-form-label: #444444;
    --kk-text-light: #666666;
    --kk-text-muted: #999999;
    --kk-text-white: #FFFFFF;

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

    --kk-border: #ECECEC;
    --kk-border-light: #F5F5F5;

    /*=====================================================
        STATUS
    =====================================================*/

    --kk-success: #2E7D32;
    --kk-danger: #D32F2F;
    --kk-warning: #F9A825;
    --kk-info: #2196F3;

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

    --kk-radius-sm: 6px;
    --kk-radius: 12px;
    --kk-radius-lg: 20px;
    --kk-radius-xl: 30px;
    --kk-radius-pill: 999px;

    /*=====================================================
        SHADOWS
    =====================================================*/

    --kk-shadow-sm:
        0 2px 6px rgba(0, 0, 0, .06);

    --kk-shadow:
        0 10px 30px rgba(0, 0, 0, .08);

    --kk-shadow-md:
        0 15px 40px rgba(0, 0, 0, .10);

    --kk-shadow-lg:
        0 20px 50px rgba(0, 0, 0, .12);

    --kk-shadow-xl:
        0 30px 70px rgba(0, 0, 0, .16);

    --kk-shadow-card:
        0 12px 30px rgba(0, 0, 0, .06);

    --kk-shadow-hover:
        0 25px 60px rgba(0, 0, 0, .12);

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

    --kk-transition-fast: .20s ease;
    --kk-transition: .30s ease;
    --kk-transition-slow: .50s ease;

    /*=====================================================
        CONTAINER
    =====================================================*/

    --kk-container: 1280px;
    --kk-container-lg: 1400px;
    --kk-container-sm: 1140px;

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

    --kk-section-padding: 100px;
    --kk-section-padding-mobile: 70px;

    --kk-gap-xs: 10px;
    --kk-gap-sm: 15px;
    --kk-gap-md: 25px;
    --kk-gap-lg: 40px;
    --kk-gap-xl: 60px;

    /*=====================================================
        Z-INDEX
    =====================================================*/

    --kk-z-dropdown: 1000;
    --kk-z-sticky: 1020;
    --kk-z-fixed: 1030;
    --kk-z-modal: 1050;
    --kk-z-toast: 1100;

    /*=====================================================
        FONTS
    =====================================================*/

    --kk-font: 'Poppins', sans-serif;

    --kk-font-heading: 'Poppins', sans-serif;


    --kk-font-size-xs: 12px;
    --kk-font-size-sm: 14px;
    --kk-font-size-md: 16px;
    --kk-font-size-lg: 18px;
    --kk-font-size-xl: 20px;
    --kk-font-size-2xl: 22px;
    --kk-font-size-3xl: 32px;
    --kk-font-size-4xl: 44px;
    --kk-font-size-5xl: 56px;


}