/* Footer Color Configuration - Change this value to adjust the footer color */
        :root {
            --footer-bg-color: #000000; /* Default: Black - Change this hex value as needed  Black: #000000, Dark gray: #1a1a1a, Navy: #0a1929 */
        }




        body {

            font-family: Arial, sans-serif;

            display: flex;

            flex-direction: column;

            min-height: 100vh;

        }

        .footer {

            background-color: #2d3748;

            color: #cbd5e0;

            padding: 32px 0;

            margin-top: auto;

        }

        .footer .container {

            max-width: 1200px;

            margin: 0 auto;

            padding: 0 24px;

            display: flex;

            flex-direction: column;

        }

        .footer .container > div {

            margin-bottom: 24px;

        }

        .footer h2, .footer h3 {

            font-size: 20px;

            font-weight: bold;

        }

        .footer p {

            margin-top: 8px;

            color: #a0aec0;

        }

        .footer ul {

            list-style-type: none;

            padding: 0;

        }

        .footer ul li {

            margin-bottom: 8px;

        }

        .footer ul li a {

            color: #a0aec0;

            text-decoration: none;

        }

        .footer ul li a:hover {

            color: #cbd5e0;

        }

        .footer .bottom {

            text-align: center;

            color: #718096;

        }

        @media (min-width: 768px) {

            .footer .container {

                flex-direction: row;

                justify-content: space-between;

            }

            .footer .container > div {

                margin-bottom: 0;

            }

        }