/*=========================================================
    Village Welfare Society
    Global Design Variables
=========================================================*/

:root{

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

    --primary-color:#0056D2;
    --primary-dark:#003D99;
    --primary-light:#3D8BFF;

    --secondary-color:#0A2540;
    --secondary-light:#153B66;

    --accent-color:#2E7D32;
    --accent-hover:#1B5E20;

    --warning-color:#F4B400;
    --danger-color:#D93025;

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

    --white:#FFFFFF;
    --off-white:#F8FAFC;
    --section-bg:#F4F8FC;
    --footer-bg:#081B33;

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

    --text-dark:#1E293B;
    --text-light:#64748B;
    --text-white:#FFFFFF;

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

    --border-color:#E5E7EB;

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

    --shadow-sm:0 2px 10px rgba(0,0,0,.05);

    --shadow-md:0 10px 25px rgba(0,0,0,.08);

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

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

    --radius-sm:8px;
    --radius-md:12px;
    --radius-lg:20px;
    --radius-xl:40px;

    /*=====================================================
        FONT FAMILY
    =====================================================*/

    --heading-font:'Poppins',sans-serif;
    --body-font:'Open Sans',sans-serif;

    /*=====================================================
        FONT SIZE
    =====================================================*/

    --fs-12:12px;
    --fs-14:14px;
    --fs-16:16px;
    --fs-18:18px;
    --fs-20:20px;
    --fs-24:24px;
    --fs-30:30px;
    --fs-36:36px;
    --fs-48:48px;
    --fs-60:60px;

    /*=====================================================
        FONT WEIGHT
    =====================================================*/

    --fw-300:300;
    --fw-400:400;
    --fw-500:500;
    --fw-600:600;
    --fw-700:700;
    --fw-800:800;

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

    --space-5:5px;
    --space-10:10px;
    --space-15:15px;
    --space-20:20px;
    --space-30:30px;
    --space-40:40px;
    --space-50:50px;
    --space-60:60px;
    --space-80:80px;
    --space-100:100px;
    --space-120:120px;

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

    --transition-fast:.25s ease;

    --transition-normal:.40s ease;

    --transition-slow:.70s ease;

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

    --container-width:1320px;

    /*=====================================================
        NAVBAR
    =====================================================*/

    --navbar-height:95px;

    --navbar-scroll-height:78px;

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

    --z-navbar:999;

    --z-modal:9999;

}