/* A composed desktop canvas with an always-present reading index. */
.adaptive-desktop .x-layout {
    display: grid;
    grid-template-columns: clamp(190px,20vw,240px) minmax(0,1fr);
    gap: clamp(32px,5vw,72px);
    max-width: 1440px;
    padding: clamp(32px,4.5vw,64px);
    margin: auto
}

.adaptive-desktop .x-sidebar {
    display: flex;
    position: sticky;
    top: clamp(32px,4.5vw,64px);
    height: calc(100dvh - 2 * clamp(32px,4.5vw,64px));
    border: 0;
    padding: 0 20px 0 0;
    align-self: start;
    overflow: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--line) transparent
}

.adaptive-desktop .x-sidebar .v-brand {
    font-size: 38px;
    letter-spacing: -.03em
}

.adaptive-desktop .x-sidebar .v-brand br {
    display: block
}

.adaptive-desktop .x-sidebar p {
    margin-top: 24px;
    font-size: 14px;
    justify-self: start
}

.adaptive-desktop .x-sidebar nav {
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 8px;
    margin-top: 40px;
    font-size: 14px
}

.adaptive-desktop .x-sidebar>.micro {
    display: block;
    margin-top: auto
}

.adaptive-desktop .x-intro {
    padding: 0 0 64px
}

.adaptive-desktop .x-intro h1 {
    font-size: 64px;
    /* max-width:12ch; */
    line-height: 1.04;
    margin: 24px 0
}

.adaptive-desktop .x-intro p {
    /* max-width:54ch; */
    font-size: 18px;
    line-height: 1.7
}

.adaptive-desktop .x-table-head,.adaptive-desktop .x-project {
    grid-template-columns: 32px minmax(0,1fr) 54px 24px;
    gap: 20px
}

.adaptive-desktop .x-year {
    display: block
}

.adaptive-desktop .x-detail {
    grid-template-columns: minmax(0,1.4fr) minmax(0,1fr);
    opacity: 1;
    max-height: none;
    padding: 0 0 32px 52px
}

.adaptive-desktop .x-row:hover .x-detail {
    max-height: none;
    padding: 0 0 32px 52px
}

.adaptive-desktop .x-detail img {
    max-height: none;
    aspect-ratio: 5/4;
    object-fit: contain
}

.adaptive-desktop .case-index-disclosure {
    display: flex;
    margin-top: 28px
}

.adaptive-desktop .case-index-disclosure>summary {
    display: none
}

.adaptive-desktop .case-sidebar .case-index {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin: 0;
    max-height: calc(100dvh - 240px);
    overflow-y: auto;
    padding: 0
}

.adaptive-desktop .case-sidebar .case-index a {
    font-size: 14px;
    padding: 13px 0;
    min-height: 46px;
    white-space: normal
}

.adaptive-desktop .case-index a::before,.adaptive-desktop .case-index a::after {
    display: none
}

.adaptive-desktop .case-main {
    padding-top: 0;
    max-width: 900px
}

.adaptive-desktop .case-main #case-title {
    font-size: 72px;
    letter-spacing: -.045em
}

.adaptive-desktop .case-main .case-lead {
    font-size: 22px;
    line-height: 1.55;
    max-width: 52ch
}

.adaptive-desktop .case-main .case-image {
    margin: 40px 0
}

.adaptive-desktop .case-story {
    margin: 64px 0
}

.adaptive-desktop .case-main .case-story p {
    font-size: 18px;
    line-height: 1.8;
    max-width: 65ch
}

.adaptive-desktop .case-story h2 {
    font-size: 26px
}

.adaptive-desktop .case-sidebar .case-index a {
    padding-left: 18px
}

.adaptive-desktop .case-sidebar .case-index a[aria-current="location"] {
    padding-left: 22px
}

.adaptive-desktop .case-sidebar .case-index a::before,.adaptive-desktop .case-sidebar .case-index a::after {
    display: block;
    top: 6px;
    bottom: 6px;
    left: 0;
    width: 2px;
    border-radius: 2px
}

.adaptive-desktop .case-highlight {
    padding: 40px 0;
    margin: 64px 0
}

.adaptive-desktop .case-main .case-highlight p {
    font-size: 38px
}

.adaptive-desktop .case-page section {
    scroll-margin-top: 40px
}

/* Case studies use the sidebar on desktop; project rows remain compact. */
.mobile-story-header {
    display: none
}

.adaptive-desktop:not(.case-page) .x-row {
    display: block;
    padding: 0
}

.adaptive-desktop .case-index-disclosure:not([open])>.case-index {
    display: none
}