@layer theme {
    :root {
        --base-blue: #16a34a;
        --light-blue: #22c55e;
        --ultra-dark-blue: #0b6b36;
        --ultra-light-blue: #7ee7a1;
        --green-blue: #4cc9f0;
        --alpha-blue: #93c5fd80;
        --white-a01: #ffffff1a;
        --light-gray-blue: #9ca3af;
        --base-black: #000000;
        --alpha-black: #272f3a4d;
        --base-red: #ff0000;
        --base-white: #ffffff;
        --alpha-white: #ffffffcc;
        --transparent-gray: #64646448;
        --base-green: #16a34a;
        --dark-green: #15803d;
        --light-green-to-blue: #40b3a2;
        --bg-transparent: transparent;
        --bg-yellow: yellow;
        --footer-bg: #15803d;
        --header-bg: #16a34a;
        --base-orange: #f97316;
        --base-purple: #5a189a;
        --light-purple: #e0aaff;
        --hero-bg-color: #effaf1;
        --cta-bg-color: #4ade80;
        --banner-bg-color: rgba(21, 128, 61, 0.16);
    }

    .dark {
    }
}