.admission-page {
    --yellow: #ffc900;
    background: var(--paper)
}

.admission-page .nav-dropdown--current>button {
    color: var(--orange)
}

.admission-head {
    padding: 9.5rem 1.4rem 3rem;
    border-bottom: 1px solid
}

.admission-head > .page-breadcrumbs {
    margin-bottom: 4.5rem;
}

.breadcrumbs {
    margin: 0 0 4.5rem;
    font: .55rem var(--mono);
    text-transform: uppercase
}

.breadcrumbs a {
    color: #65665f
}

.admission-head__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, .42fr);
    gap: clamp(4rem, 9vw, 10rem);
    align-items: end
}

.page-kicker {
    margin: 0 0 1.4rem;
    color: var(--orange);
    font: 500 .58rem var(--mono);
    text-transform: uppercase
}

.admission-head h1 {
    max-width: 10ch;
    margin: 0;
    font-size: clamp(4.8rem, 8vw, 8.5rem);
    line-height: .89;
    letter-spacing: -.078em
}

.admission-head__aside {
    padding-top: 1.2rem;
    border-top: 1px solid
}

.admission-head__aside p {
    margin: 0 0 2.2rem;
    font: clamp(.8rem, 1.05vw, .95rem)/1.7 var(--mono)
}

.text-link {
    width: max-content;
    display: flex;
    gap: 2.5rem;
    padding: .7rem 0;
    border-bottom: 1px solid;
    font: 500 .58rem var(--mono);
    text-transform: uppercase;
    transition: color .2s, gap .2s
}

.text-link:hover {
    gap: 3rem;
    color: var(--orange)
}

.admission-head__meta {
    margin-top: 4.5rem;
    padding-top: 1rem;
    display: flex;
    justify-content: space-between;
    border-top: 1px solid var(--line);
    font: .53rem var(--mono);
    text-transform: uppercase
}

.admission-document {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    width: 100%
}

.admission-nav {
    position: sticky;
    top: 68px;
    align-self: start;
    height: calc(100svh - 68px);
    padding: 3rem 1.4rem;
    border-right: 1px solid
}

.admission-nav__inner {
    height: 100%;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.admission-nav__inner::-webkit-scrollbar {
    display: none
}

.admission-nav__label {
    margin: 0 0 2rem;
    font: 500 .56rem var(--mono);
    text-transform: uppercase
}

.admission-nav nav {
    display: flex;
    flex-direction: column;
    border-top: 1px solid
}

.admission-nav nav a {
    display: grid;
    grid-template-columns: 2rem 1fr;
    gap: .6rem;
    padding: 1rem .85rem;
    border-bottom: 1px solid var(--line);
    font: .75rem/1.4 var(--mono);
    transition: background-color .2s, color .2s
}

.admission-nav nav a:hover {
    color: var(--orange)
}

.admission-nav nav span {
    color: #777870
}

.admission-status {
    margin-top: 3rem;
    padding: 1rem;
    background: var(--yellow);
    border: 1px solid
}

.admission-status>span {
    display: block;
    font: .5rem var(--mono);
    text-transform: uppercase
}

.admission-status strong {
    display: block;
    margin: 2rem 0 0;
    font-size: 2.8rem;
    line-height: 1;
    letter-spacing: -.06em
}

.admission-status small {
    display: block;
    margin: .35rem 0 1.5rem;
    font: .52rem var(--mono);
    text-transform: uppercase
}

.solid-button {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    padding: .9rem 1rem;
    color: var(--paper);
    background: var(--ink);
    border: 1px solid var(--ink);
    font: 500 .57rem var(--mono);
    text-transform: uppercase;
    box-shadow: 4px 4px 0 var(--orange);
    transition: transform .2s, box-shadow .2s
}

.solid-button:hover {
    transform: translate(4px, 4px);
    box-shadow: none
}

.admission-content {
    min-width: 0;
    width: 100%;
    max-width: 1280px;
    margin-inline: auto;
    padding: 0 clamp(2rem, 6vw, 7rem) 7rem
}

.content-intro,
.contact-section,
.campus-section {
    padding: clamp(5rem, 8vw, 8rem) 0;
    scroll-margin-top: 5rem
}

.content-intro {
    border-bottom: 1px solid
}

.section-heading {
    margin-bottom: 4rem
}

.section-heading>span {
    padding-top: .55rem;
    font: 500 .56rem var(--mono);
    text-transform: uppercase
}

.section-heading h2 {
    max-width: 10ch;
    margin: 0;
    font-size: clamp(3.2rem, 5vw, 5.3rem);
    line-height: .98;
    letter-spacing: -.067em
}

.intro-copy {
    max-width: 46rem;
    margin: 0;
    font: clamp(.9rem, 1.15vw, 1.05rem)/1.8 var(--mono)
}

/* .steps {
    border-bottom: 1px solid
} */

.step {
    display: grid;
    grid-template-columns: minmax(15rem, .75fr) minmax(17rem, 1fr);
    gap: clamp(1.5rem, 4vw, 4.5rem);
    padding: clamp(3.5rem, 6vw, 6rem) 0;
    border-bottom: 1px solid;
    scroll-margin-top: 5rem
}

.step:last-child {
    border-bottom: 0
}

.step h3 {
    max-width: 10ch;
    margin: 0;
    font-size: clamp(2.3rem, 3.7vw, 3.9rem);
    line-height: .95;
    letter-spacing: -.06em
}

.step__body {
    padding-top: .1rem
}

.step__body>p {
    max-width: 36rem;
    margin: 0;
    font: .76rem/1.75 var(--mono)
}

.step__body>.text-link {
    margin-top: 2rem
}

.timing {
    width: max-content;
    margin-top: 1.5rem !important;
    padding: .5rem .65rem;
    background: var(--yellow);
    border: 1px solid;
    font-size: .53rem !important;
    text-transform: uppercase
}

.document-list {
    margin: 2.5rem 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid
}

.document-list li {
    display: grid;
    grid-template-columns: 2.2rem 1fr;
    gap: .6rem;
    padding: 1rem 0;
    border-bottom: 1px solid
}

.document-list li>span {
    font: .5rem var(--mono)
}

.document-list strong {
    font-size: clamp(1rem, 1.45vw, 1.3rem);
    line-height: 1.25;
    letter-spacing: -.025em
}

.document-list small {
    grid-column: 2;
    color: #65665f;
    font: .56rem/1.5 var(--mono)
}

.contact-section {
    border-bottom: 1px solid
}

.contact-panel {
    display: grid;
    grid-template-columns: .72fr 1fr;
    border: 1px solid
}

.contact-panel>div:first-child {
    padding: 1.4rem;
    background: var(--yellow);
    border-right: 1px solid
}

.contact-panel p {
    max-width: 25rem;
    margin: 0;
    font: .68rem/1.7 var(--mono)
}

.contact-links a {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1rem;
    padding: 1rem 1.2rem;
    border-bottom: 1px solid;
    font: .55rem var(--mono);
    text-transform: uppercase;
    transition: background .2s
}

.contact-links a:last-child {
    border-bottom: 0
}

.contact-links a:hover {
    background: var(--cream)
}

.contact-links strong {
    font-weight: 500
}

.campus-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border-top: 1px solid;
    border-left: 1px solid
}

.campus {
    min-height: 22rem;
    padding: 1.3rem;
    display: flex;
    flex-direction: column;
    border-right: 1px solid;
    border-bottom: 1px solid
}

.campus>span {
    font: 500 .53rem var(--mono);
    text-transform: uppercase
}

.campus h3 {
    max-width: 10ch;
    margin: auto 0 1.5rem;
    font-size: clamp(2rem, 3.2vw, 3.5rem);
    line-height: .96;
    letter-spacing: -.06em
}

.campus address {
    font: normal .63rem/1.7 var(--mono)
}

.application-cta {
    padding: 3rem 1.4rem;
    display: grid;
    grid-template-columns: 1fr minmax(15rem, 27rem) auto;
    gap: clamp(2rem, 6vw, 7rem);
    align-items: end;
    background: var(--yellow);
    border-top: 1px solid
}

.application-cta>div>span {
    font: 500 .53rem var(--mono);
    text-transform: uppercase
}

.application-cta h2 {
    margin: 1.2rem 0 0;
    font-size: clamp(2.8rem, 4.8vw, 5rem);
    line-height: .94;
    letter-spacing: -.065em
}

.application-cta p {
    margin: 0;
    font: .66rem/1.65 var(--mono)
}

.application-cta .solid-button {
    min-width: 12rem
}

@media(max-width:1100px) {
    .admission-document {
        grid-template-columns: 190px minmax(0, 1fr)
    }

    .admission-content {
        padding-inline: 3rem
    }

    .step {
        grid-template-columns: minmax(13rem, .7fr) 1fr;
        gap: 1.5rem
    }

    .contact-panel {
        grid-template-columns: 1fr
    }

    .contact-panel>div:first-child {
        border-right: 0;
        border-bottom: 1px solid
    }

    .contact-links a {
        grid-template-columns: 1fr
    }

    .application-cta {
        grid-template-columns: 1fr auto
    }

    .application-cta>p {
        grid-column: 1
    }
}

@media(max-width:900px) {
    .step {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media(max-width:640px) {
    .admission-head {
        padding: 7rem 1.2rem 2rem
    }

    .breadcrumbs {
        margin-bottom: 3rem
    }

    .admission-head__grid {
        grid-template-columns: 1fr;
        gap: 3rem
    }

    .admission-head h1 {
        font-size: clamp(3.8rem, 15vw, 5.2rem);
        line-height: .96
    }

    .admission-head__meta {
        margin-top: 3rem
    }

    .admission-head__meta span:first-child {
        display: none
    }

    .admission-document {
        display: block
    }

    .admission-nav {
        position: static;
        height: auto;
        padding: 1rem 1.2rem;
        border-right: 0;
        border-bottom: 1px solid;
        overflow: auto
    }

    .admission-nav__inner {
        width: max-content;
        height: auto;
        overflow: visible
    }

    .admission-nav__label,
    .admission-status {
        display: none
    }

    .admission-nav nav {
        flex-direction: row;
        border-top: 0
    }

    .admission-nav nav a {
        display: flex;
        gap: .4rem;
        padding: .65rem 1rem;
        border: 1px solid;
        border-right: 0;
        white-space: nowrap
    }

    .admission-nav nav a:last-child {
        border-right: 1px solid
    }

    .admission-content {
        padding: 0 1.2rem 5rem
    }

    .content-intro,
    .contact-section,
    .campus-section {
        padding-block: 5rem
    }

    .section-heading {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        margin-bottom: 3rem
    }

    .section-heading h2 {
        font-size: clamp(3.2rem, 13vw, 4.5rem)
    }

    .intro-copy,
    .contact-panel,
    .campus-grid {
        margin-left: 0
    }

    .step {
        grid-template-columns: minmax(0, 1fr);
        padding: 3.5rem 0;
        gap: 1rem
    }

    .step h3 {
        font-size: clamp(2.5rem, 10vw, 3.8rem)
    }

    .step__body {
        grid-column: 1;
        margin-top: 1rem
    }

    .document-list li {
        grid-template-columns: 1.8rem 1fr
    }

    .contact-panel {
        grid-template-columns: 1fr
    }

    .contact-links a {
        grid-template-columns: 1fr;
        gap: .35rem
    }

    .campus-grid {
        grid-template-columns: 1fr
    }

    .campus {
        min-height: 19rem
    }

    .application-cta {
        grid-template-columns: 1fr;
        padding: 3.5rem 1.2rem
    }

    .application-cta>p {
        grid-column: auto
    }

    .application-cta .solid-button {
        width: max-content
    }
}

/* UX spacing and readability refinements. */
@media (max-width: 640px) {
    .admission-nav {
        overflow: visible;
    }

    .admission-nav__inner {
        width: 100%;
    }

    .admission-nav nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border-top: 1px solid;
        border-left: 1px solid;
    }

    .admission-nav nav a {
        min-height: 44px;
        padding: .8rem .65rem;
        border: 0;
        border-right: 1px solid;
        border-bottom: 1px solid;
        white-space: normal;
        font-size: .7rem;
    }
}