/* Font Face Definitions */
@font-face {
    font-family: 'Kaushan Script';
    src: url('{% static "fonts/Kaushan%20Script-3db770c46931b64b6e281dcb2a7d0586.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Kaushan Script';
    src: url('{% static "fonts/Kaushan%20Script-ba85b3a237ebd28058cd515071c02485.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Montserrat';
    src: url('{% static "fonts/Montserrat-99764e33f03a95926b938c6f56e08a4f.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

@font-face {
    font-family: 'Montserrat';
    src: url('{% static "fonts/Montserrat-cc6c968bcebf02819ee3afff266119d9.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
    font-family: 'Montserrat';
    src: url('{% static "fonts/Montserrat-f32ddc894c166fbd8bc0d500ff2aeb3d.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

@font-face {
    font-family: 'Montserrat';
    src: url('{% static "fonts/Montserrat-bcb799eba0c324e431d5daac3e5ea6bf.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Montserrat';
    src: url('{% static "fonts/Montserrat-5cfb114945f0457bd5a940932bb8156d.woff2" %}') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Utility Classes */
.fit-cover {
    object-fit: cover;
}

/* Footer Styles */
footer {
    background-color: #343a40;
    color: #fff;
    padding-top: 5rem;
    padding-bottom: 4rem;
}

footer h5 {
    margin-bottom: 1.5rem;
    font-weight: 700;
}

footer a, footer p {
    color: #fff;
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}

footer hr {
    border-top: 1px solid #fff;
    width: 100%;
    margin: 2rem 0;
}

footer .list-inline-item a {
    color: #fff;
    font-size: 23px;
}

/* Button Hover Styles */
button.btn-primary:hover {
    background: rgb(20, 87, 187);
}

/* Navigation Styles */
ul.main-nav {
    list-style-type: none;
    padding: 0;
    font-size: 0;
    max-width: 1000px;
    margin: 0 auto;
}

ul.main-nav > li {
    display: inline-block;
    padding: 0;
}

ul.main-nav > li > a {
    display: block;
    padding: 20px 30px;
    position: relative;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    box-sizing: border-box;
}

ul.main-nav > li:hover {
    background-color: #f9f9f9;
}

ul.main-nav > li:hover > a {
    color: #333;
    font-weight: 400;
}

ul.main-nav > li ul.sub-menu-lists {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: block;
}

ul.main-nav > li ul.sub-menu-lists > li {
    padding: 2px 0;
}

ul.main-nav > li ul.sub-menu-lists > li > a {
    font-size: 14px;
}

/* Responsive Navigation */
@media only screen and (max-width: 768px) {
    .ic.menu {
        display: block;
    }

    ul.main-nav {
        z-index: 2;
        padding: 50px 0;
        position: fixed;
        right: 0;
        top: 0;
        width: 0;
        background-color: #000;
        height: 100%;
        overflow: auto;
        transition: width 0.6s, background 0.6s;
    }

    .ic.menu:focus ~ ul.main-nav {
        width: 300px;
    }
}

@media only screen and (min-width: 769px) {
    .ic.menu {
        display: none;
    }

    ul.main-nav {
        display: block;
        position: relative;
    }
}

.fa-star {
    font-size: 20px;
    color: gray;
}

.checked {
    color: gold;
}


.project-card, .review-card {
    width: 100%;
    max-width: 350px;
    margin: auto;
    font-size: 0.5rem; /* Make font size smaller */
}

.card-body p {
    margin-bottom: 10px;
    font-size: 0.85rem; /* Reduce text size in paragraphs */
}

.text-muted {
    font-size: 0.8rem; /* Make muted text slightly smaller */
}