@layer theme {
    :root {
        --base-blue: #0b6b63;
        --light-blue: #0d9488;
        --ultra-dark-blue: #074f4a;
        --ultra-light-blue: #6fd6c9;
        --green-blue: #5eead4;
        --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: #009966;
        --dark-green: #007a55;
        --light-green-to-blue: #40b3a2;
        --bg-transparent: transparent;
        --bg-yellow: yellow;
        --footer-bg: #0f766e;
        --header-bg: #0d9488;
        --base-orange: #f97316;
        --base-purple: #5a189a;
        --light-purple: #e0aaff;
        --hero-bg-color: #0e6b62;
        --cta-bg-color: #5eead4;
        --banner-bg-color: #0f766e;
    }

    .dark {
    }
}