/* Fonts */
:root {
    --font-body: "Montserrat", serif;
    --font-headline: "Montserrat", serif;
}

/* Font Sizing */

:root {
    /* Font size scale - Major third scale */
    --fs-xs: clamp(0.7rem, 0.7rem + 0.25vw, 0.8rem);
    --fs-sm: clamp(0.8rem, 0.825rem + 0.25vw, 0.925rem);
    --fs-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
    --fs-md: clamp(1.125rem, 1.075rem + 0.375vw, 1.375rem);
    --fs-lg: clamp(1.25rem, 1.175rem + 0.5vw, 1.75rem);
    --fs-xl: clamp(1.5rem, 1.375rem + 0.75vw, 2.25rem);
    --fs-2xl: clamp(1.875rem, 1.675rem + 1vw, 3rem);
    --fs-3xl: clamp(2.25rem, 1.975rem + 1.5vw, 4rem);
    /* Display sizes for dramatic headings */
    --fs-display-1: clamp(3rem, 2.5rem + 2vw, 5.5rem);
    --fs-display-2: clamp(3.75rem, 3rem + 3vw, 7rem);
    /* Line height scale */
    --leading-tight: 1.1;
    --leading-snug: 1.25;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --leading-loose: 2;
    /* Display specific line heights */
    --leading-display: 1.05; /* Tighter leading for large display text */
}

/* General Body */

body, html {
    font-family: var(--font-body);
    font-weight: 400;
    color: var(--blue);
    font-size: var(--fs-base);
    line-height: var(--leading-normal);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

/* Headings */

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6, .display-1, .display-2 {
    font-family: var(--font-headline);
    font-weight: 500;
    color: var(--dark-teal);
    margin-top: 2rem;

    &:first-child {
        margin-top: 0;
    }
}

h1, .h1 {
    font-size: var(--fs-3xl);
    line-height: var(--leading-tight);
    margin-bottom: 0.75em;
}

h2, .h2 {
    font-size: var(--fs-2xl);
    line-height: var(--leading-tight);
    margin-bottom: 0.65em;
}

h3, .h3 {
    font-size: var(--fs-xl);
    line-height: var(--leading-snug);
    margin-bottom: 0.6em;
}

h4, .h4 {
    font-size: var(--fs-lg);
    line-height: var(--leading-snug);
    margin-bottom: 0.5em;
}

h5, .h5 {
    font-size: var(--fs-md);
    line-height: var(--leading-normal);
    margin-bottom: 0.5em;
}

h6, .h6 {
    font-size: var(--fs-xs);
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: .05rem;
}

/* Extra Display Headings */

.display-1 {
    font-size: var(--fs-display-1);
    line-height: var(--leading-display);
    margin-bottom: 0.75em;
}

.display-2 {
    font-size: var(--fs-display-2);
    line-height: var(--leading-display);
    margin-bottom: 0.75em;
}

/* Content */

.font-body {
    font-family: var(--font-body);
    font-weight: 400;
}

.font-headline {
    font-family: var(--font-headline);
    font-weight: 700;
}

p {
    margin-top: 0;
    margin-bottom: clamp(1rem, 0.95rem + 0.25vw, 1.5rem);
}

.p {
    font-size: inherit;
    text-transform: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    font-family: inherit;
    line-height: inherit;
    color: inherit;
}

.fs-large {
    font-size: var(--fs-md);
}

.fs-base {
    font-size: var(--fs-base);
}

.fs-small {
    font-size: var(--fs-sm);
}

.fs-x-small {
    font-size: var(--fs-xs);
}

.bold, strong {
    font-weight: 700;
}

.fw-regular {
    font-weight: 400;
}

.text-underline {
    text-decoration: underline;
}

ul.list-none {
    list-style: none;
    padding-left: 0;
}

ul {
    padding-left: 1.25rem;
    li {
        margin-bottom: 0.4rem; /* Set to desired margin */
    }
}

@media (max-width:767px) {
    ul.md-center-text {
        list-style: none;
        padding-left: 0;

        li {
            position: relative;
            margin-bottom: 1rem;
            padding-bottom: 1rem;

            &:before {
                content: "";
                position: absolute;
                left: 50%;
                bottom: 0;
                transform: translateX(-50%);
                height: 1px;
                width: 5rem;
                background-color: var(--white-sand);
            }

            &:last-child {
                margin-bottom: 0;
                padding-bottom: 0;
                &:before {
                    display: none;
                }
            }
        }
    }
}

.navbar ul li {
    margin-bottom: 0; /* Remove on nav list */
}

/* Links */

a {
    color: var(--blue); /* Set to desired color */
    transition: all .15s;
    outline: 0;
}

    a:hover, a:focus {
        color: inherit;
    }

    a.blank {
        color: inherit;
        text-decoration: none;
    }

    a.blank:hover, a.blank:focus {
        text-decoration: none;
    }

        a.blank.hover-orange:hover {
            color: #ef4f35;
        }

        a.hover-span-white span {
            transition: all .15s;
        }
        
        a.hover-span-white:hover span {
            color:var(--white);
        }

        a.hover-underline {
            text-decoration: none;

            &:hover {
                text-decoration: underline;
            }
        }