.navbar {
    font-size: var(--font-size-ui);
    font-family: var(--font-family-ui), sans-serif;
    font-weight: 700;
}

/*homepage*/

.name-section {
    font-family: var(--font-family-header), sans-serif;
    font-size: var(--font-size-header);
}

.job-section {
    font-family: var(--font-family-body), sans-serif;
    font-size: calc(var(--font-size-header) * 0.7);
}

.see-project-btn {
    font-family: var(--font-family-ui), sans-serif;
    font-size: var(--font-size-ui);
    font-weight: bold;
    text-decoration: none;
    color: black;
    border: 2px solid black;
    padding: 5px;
}

.see-project-btn:hover {
    color: var(--color-code01);
    background-color: var(--color-code03);
}

/*about page*/

.title {
    font-family: var(--font-family-body), sans-serif;
    font-weight: bolder;
    font-size: var(--font-size-header);
    color: white;
}

.biography-section {
    font-family: var(--font-family-body), sans-serif;
    font-size: var(--font-size-body);
    color: black;
    background-color: var(--color-code01);
}

/*project page*/
.project-container {
    font-family: var(--font-family-body), sans-serif;
    font-size: var(--font-size-body);
}

.project-title {
    font-family: var(--font-family-body), sans-serif;
    font-size: calc(var(--font-size-body) + 0.25rem);
    font-weight: bold;
}

.projects-section-header {
    padding-top: 5rem;
    padding-bottom: 1rem;
    font-family: var(--font-family-body), sans-serif;
    font-size: var(--font-size-header);
    font-weight: normal;
}
.word-look {
    font-family: var(--font-family-header), sans-serif;
}

.project-desc-box {
    background-color: var(--color-code01);
}

/*contact page*/
.page-header {
    font-family: var(--font-family-ui), sans-serif;
    font-size: calc(var(--font-size-header) - 1rem);
    font-weight: bold;
    color: white;
}

.word-touch {
    font-family: var(--font-family-header), sans-serif;
}

.contact-info-box {
    width: fit-content;
    margin: 2rem auto;
    background-color: var(--color-code01);
}

.email-link {
    font-family: var(--font-family-body), sans-serif;
    font-weight: bold;
    text-decoration: none;
    color: black;
}

.email-link:hover {
    text-decoration: underline;
    color: var(--color-code03);
}

.contact-info {
    font-family: var(--font-family-body), sans-serif;
    font-size: var(--font-size-body);
    font-weight: bold;
    text-decoration: none;
    color: black;
}

.linkedin-link {
    color: black;
    text-decoration: none;
}

.linkedin-link:hover {
    text-decoration: underline;
    color: var(--color-code02);
}

.linkedin-emoji:hover {
    text-decoration: none;
}

/*footer section*/

footer a {
    text-decoration: none;
}

footer.footer-container a {
    color: inherit;
}

footer.footer-container i{
    font-size: clamp(20px, 4vw, 36px);
    transition: color 0.2s ease;
    color: inherit;
}

footer.footer-container span {
    transition: color 0.2s ease;
    color: inherit;
}

.footer-section {
    text-decoration: none;
    color: inherit;
}

.footer-section .footer-box {
    transition: transform 0.2s ease;
}

.footer-section:hover .footer-box {
    transform: scale(1.2);
}


/*colorssss=))))))*/
.index-page-footer .footer-section {
    color: var(--color-code04);
}

.index-page-footer .footer-section:hover {
    color: var(--color-code03);
}



/*about page colors*/
.about-page-footer .footer-section {
    color: var(--color-code01);
}

.about-page-footer .footer-section:hover {
    color: var(--color-code04);
}


/*projects page colors*/

.project-page-footer .footer-section {
    color: var(--color-code03);
}

.project-page-footer .footer-section:hover {
    color: var(--color-code04);
}



@media (max-width: 576px) {
    .footer-container i {
        font-size: 28px;
    }

    .footer-section .footer-box {
        transition: transform 0.2s ease;
    }

    .footer-section:hover .footer-box {
        transform: scale(1.2);
    }
}