@media (max-width: 700px) {
    .education-card {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px 16px;
    padding-block: 20px;
}
.education-level {
    grid-column: 1 / -1;
}
.education-period {
    max-width: 130px;
    font-size: 9px;
}
.project-track {
    --card-width: 82vw;
}
    .project-card:not(.is-active) {
    filter: blur(2px);
    opacity: .58;
}
.project-card.is-active,
    .project-card:focus-visible {
    filter: blur(0);
    opacity: 1;
}
.project-dialog .project-story {
    grid-template-columns: 1fr;
    gap: 18px;
}
.project-dialog-cover {
    min-height: 190px;
}
.social-links {
    grid-template-columns: 1fr;
    margin-top: 28px;
}
.social-card {
    min-height: 110px;
}
.footer-bottom {
    flex-wrap: wrap;
    font-size: 8px;
}
.footer-bottom span:nth-child(2) {
    order: 1;
    width: 100%;
}

}
@media (prefers-reduced-motion: reduce) {
    .project-track {
    scroll-behavior: auto;
}
.project-card,
    .social-card,
    .dialog-close {
    transition: none;
}

}
@media (max-width: 620px) {
    .menu-toggle {
    order: -1;
}
.theme-toggle {
    display: inline-flex;
    width: auto;
    min-width: 92px;
    justify-content: center;
    gap: 6px;
    margin: 0 0 0 auto;
    padding: 7px 8px;
    font-size: 9px;
    white-space: nowrap;
}
.theme-label {
    display: inline;
}

}
@media (max-width: 360px) {
    .site-header {
    gap: 8px;
}
.logo {
    gap: 6px;
    font-size: 12px;
}
.clover {
    width: 20px;
}
.theme-toggle {
    min-width: 84px;
    padding-inline: 6px;
    font-size: 8px;
}

}