.written-media {
    border-top: 1px solid var(--line, #cbc6bc);
    margin-top: clamp(3rem, 7vw, 7rem);
    padding-top: clamp(2rem, 4vw, 4rem);
}

.written-media__heading,
.written-media-request > header {
    align-items: start;
    display: flex;
    gap: 2rem;
    justify-content: space-between;
}

.written-media__heading > p {
    max-width: 38rem;
}

.written-media-request {
    border-top: 1px solid var(--line, #cbc6bc);
    margin-top: 2rem;
    padding: 2rem 0;
}

.written-media-request.is-overdue {
    border-top-color: var(--clay, #b44d35);
}

.written-media-request__deadline {
    color: var(--muted, #746f67);
}

.written-media-request.is-overdue .written-media-request__deadline,
.written-media-request.is-overdue > header > strong {
    color: var(--clay, #b44d35);
}

.written-media-request__close {
    margin-top: 1.25rem;
}

.written-media-request > header span,
.written-media-request > header strong,
.written-media-card > div > span {
    font-size: .86rem;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.written-media-grid {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    margin: 1.5rem 0;
}

.written-media-grid figure,
.written-media-card {
    background: rgba(128, 128, 128, .07);
    margin: 0;
    padding: 1rem;
}

.written-media-grid img,
.written-media-card > img {
    aspect-ratio: 4 / 3;
    display: block;
    object-fit: contain;
    width: 100%;
}

.written-media-grid figcaption,
.written-media-card > div {
    display: grid;
    gap: .45rem;
    padding-top: 1rem;
}

.written-media-grid figcaption span,
.written-media-grid figcaption small {
    display: block;
}

.written-media-upload,
.written-media-request-form {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 1.5rem;
}

.written-media-upload .account-field--wide,
.written-media-request-form .field--wide,
.written-media-consent,
.written-media-upload > button,
.written-media-request-form > button {
    grid-column: 1 / -1;
}

.written-media-consent {
    align-items: start;
    display: flex;
    gap: .75rem;
}

.written-media-card form {
    border-top: 1px solid var(--line, #cbc6bc);
    margin-top: 1rem;
    padding-top: 1rem;
}

.written-media-card dl {
    margin: .5rem 0;
}

.written-media-card dl div {
    display: grid;
    grid-template-columns: 7rem 1fr;
}

.written-media-card dt {
    color: #746f67;
}

.interview-transferred-media {
    border-top: 1px solid var(--line, #cbc6bc);
    margin-top: 1.5rem;
    padding-top: 1.5rem;
}

.interview-transferred-media__grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.interview-transferred-media__card {
    background: rgba(128, 128, 128, .07);
    padding: 1rem;
}

.interview-transferred-media__card img {
    aspect-ratio: 4 / 3;
    object-fit: contain;
    width: 100%;
}

@media (max-width: 720px) {
    .written-media__heading,
    .written-media-request > header {
        display: block;
    }

    .written-media-upload,
    .written-media-request-form {
        grid-template-columns: 1fr;
    }
}