.home-selected-work {
    color: #020b2c;
    padding-block: clamp(3rem, 5vw, 5rem) 0;
}

.home-selected-work__images {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}

.home-selected-work__project,
.home-selected-work__audio {
    display: block;
    position: relative;
    color: inherit;
    text-decoration: none;
}

.home-selected-work__project--print { margin-top: clamp(3rem, 6vw, 5rem); }

.home-selected-work__corporate {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: center;
    margin-bottom: clamp(3rem, 5vw, 4.5rem);
    padding-bottom: clamp(3rem, 5vw, 4.5rem);
    border-bottom: 1px solid #d6dbe4;
}

.home-selected-work__institutions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
    margin-bottom: clamp(3rem, 5vw, 4.5rem);
    padding-bottom: clamp(3rem, 5vw, 4.5rem);
    border-bottom: 1px solid #d6dbe4;
}

.home-selected-work__institution { min-width: 0; }
.home-selected-work__institution .home-selected-work__screen { margin-bottom: 1.5rem; }

.home-selected-work__screen {
    position: relative;
    min-width: 0;
    padding-top: 1.5rem;
    overflow: hidden;
    border: 1px solid #16213a;
    border-radius: .5rem;
    background: #101522;
}

.home-selected-work__screen::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 1.5rem;
    background:
        radial-gradient(circle at .8rem .75rem, #e7e8eb 0 .13rem, transparent .15rem),
        radial-gradient(circle at 1.4rem .75rem, #a6acb7 0 .13rem, transparent .15rem),
        radial-gradient(circle at 2rem .75rem, #636b7d 0 .13rem, transparent .15rem);
}

.home-selected-work__corporate-copy { min-width: 0; }

.home-selected-work__category {
    display: block;
    margin-bottom: 1rem;
    color: #88506d;
    font: 600 .875rem/1.4 'Assistant', sans-serif;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.home-selected-work__image {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 0 1.5rem;
}

.home-selected-work__image--web { aspect-ratio: 4 / 3; object-fit: cover; object-position: top; }
.home-selected-work__screen .home-selected-work__image--corporate { margin: 0; }

.home-selected-work h3 {
    margin: 0 2.5rem .875rem 0;
    color: inherit;
    font: 400 clamp(1.75rem, 2.5vw, 2.25rem)/1.25 'Jomolhari', Georgia, serif;
    text-wrap: balance;
}

.home-selected-work__description,
.home-selected-work__description p {
    margin: 0;
    max-width: 50ch;
    color: inherit;
    font: 400 1.25rem/1.55 'Assistant', sans-serif;
}

.home-selected-work__arrow {
    display: inline-flex;
    width: 1.75rem;
    height: 1.75rem;
    margin-top: 1rem;
    color: #88506d;
    transition: transform 180ms ease;
}

.home-selected-work__arrow svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.5; }

.home-selected-work a:hover,
.home-selected-work a:focus-visible { color: #020b2c; }
.home-selected-work a:hover h3,
.home-selected-work a:focus-visible h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; }
.home-selected-work a:hover .home-selected-work__arrow { transform: translateX(4px); }
.home-selected-work a:focus-visible { outline: 3px solid #88506d; outline-offset: 8px; }

.home-selected-work__audio {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) 1.75rem;
    gap: 2rem;
    align-items: center;
    margin-top: clamp(3rem, 5vw, 4.5rem);
    padding-top: 2rem;
    border-top: 1px solid #d6dbe4;
}
.home-selected-work__audio h3,
.home-selected-work__audio .home-selected-work__arrow { margin: 0; }

@media (max-width: 767px) {
    .home-selected-work__corporate { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
    .home-selected-work__institutions { grid-template-columns: minmax(0, 1fr); gap: 3rem; }
    .home-selected-work__images { grid-template-columns: minmax(0, 1fr); gap: 3rem; }
    .home-selected-work__project--print { margin-top: 0; }
    .home-selected-work__audio { grid-template-columns: minmax(0, 1fr) 1.75rem; gap: 1rem; }
    .home-selected-work__audio .home-selected-work__description { grid-column: 1; }
    .home-selected-work__audio .home-selected-work__arrow { grid-column: 2; grid-row: 1 / span 2; }
    .home-selected-work__description,
    .home-selected-work__description p { font-size: 1.1875rem; }
}

@media (prefers-reduced-motion: reduce) {
    .home-selected-work__arrow { transition: none; }
    .home-selected-work a:hover .home-selected-work__arrow { transform: none; }
}