:root {
                --dark-blue: #0b2c3e;
                --soft-blue: #b4c9d6;
                --primary-blue: #2D82B5;
                --light-blue: #88CDF6;
                --lighter-blue: #BCE6FF;
                --cream: #fbf8ef;
                --white: #ffffff;
                --gray-light: #d1d1d1;
                --black: #000000;
            }
            @font-face {
                font-family: 'Montserrat';
                src: url('/fonts/Montserrat.woff2') format('woff2');
                src: url('/fonts/Montserrat.ttf') format('truetype');
                font-weight: normal;
                font-style: normal;
                font-display: swap;
            }

            body {
                font-family: 'Montserrat', sans-serif;
                background-color: var(--cream);
                color: var(--dark-blue);
                line-height: 1.6;
                font-weight: 400;
                overflow-x: hidden;
                /* 4. Improve text rendering */
                -webkit-font-smoothing: antialiased;
            }

            * {
                /* border: 1px solid red; */
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }

            *, *::before, *::after {
                box-sizing: border-box;
            }

            a {
                text-decoration: none;
            }
            /* 6. Inherit fonts for form controls */
            input, button, textarea, select {
                font: inherit;
            }

            
            /* 7. Avoid text overflows */
            p, h1, h2, h3, h4, h5, h6 {
                overflow-wrap: break-word;
            }
            
            /* 8. Improve line wrapping */
            p {
                text-wrap: pretty;
            }
            h1, h2, h3, h4, h5, h6 {
                text-wrap: balance;
            }