/* ===========================================================
   Responsive · Mobile/Tablet · Accessibility
   =========================================================== */

/* ---------- Tablet (≤992px) ---------- */

@media (max-width: 992px) {
    .layout {
        grid-template-columns: 1fr;
        align-content: start;
    }

    .sidebar {
        position: static;
        width: auto;
        height: auto;
        flex-direction: column;
        padding: 12px 16px;
        border-right: none;
        border-bottom: 1px solid var(--border);
        box-shadow: none;
        z-index: auto;
    }

    .sidebar::after {
        display: none;
    }

    .sidebar__brand {
        margin: 0;
        text-align: left;
    }

    .sidebar__brand .brand-sub {
        text-align: left;
    }

    .nav-toggle {
        display: flex;
    }

    .nav {
        display: none;
        flex-direction: column;
        gap: 2px;
        margin-top: 12px;
    }

    .nav.is-open {
        display: flex;
    }

    .nav__link {
        border-left: 2px solid transparent;
        border-bottom: none;
        border-radius: var(--radius);
        padding: 10px 14px;
        font-size: 15px;
        text-align: left;
        justify-content: center;
    }

    .nav__link.is-active {
        border-left-color: var(--primary);
        border-bottom: none;
    }

    .content {
        grid-column: 1;
        padding: 28px 20px 24px;
    }

    .about-grid {
        grid-template-columns: 1fr;
    }

    .about-grid__profile {
        text-align: center;
    }

    .hero {
        padding-top: 0px;
    }

    .profile-img {
        max-width: 220px;
        height: auto;
        margin: 0 auto;
    }

    .about-grid__body {
        text-align: center;
    }

    .timeline-item {
        grid-template-columns: 1fr;
        gap: 6px;
    }

    .timeline-item__meta {
        text-align: left;
        margin-bottom: 10px;
    }

    .education .timeline-item__body {
        order: -1;
    }

    .education .timeline-item__dates {
        margin-top: 0;
    }

    .timeline-item__dates {
        margin-top: 0;
    }

    .period {
        margin-bottom: 2px;
        display: inline;
        margin-right: 15px;
    }

    .company {
        font-size: 18px;
    }

    .company-links {
        justify-content: flex-start;
    }

    .company-link {
        margin-top: 0;
    }
}

/* ---------- Mobile (≤768px) ---------- */

@media (max-width: 768px) {
    .card-list,
    .projects {
        grid-template-columns: 1fr;
    }

    .stats {
        grid-template-columns: repeat(2, 1fr);
    }

    .lead {
        text-align: center;
    }

    .hero__name {
        font-size: 23px;
    }

    .footer {
        flex-direction: column;
        gap: 4px;
        padding: 10px 16px;
    }

    .footer__sep {
        display: none;
    }

    .kv__row {
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }

    .kv__key {
        flex: 0 0 100%;
        text-align: center;
    }

    .kv__key::after {
        display: none;
    }

    .kv--centered {
        grid-template-columns: 1fr;
    }

    .tenure::before {
        content: "—\00a0";
    }

    .course__body ol,
    .course__body ul {
        padding-left: 1.5rem;
    }

    .course__body ol {
        padding-left: 2rem;
    }
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }

    html {
        scroll-behavior: auto;
    }
}
