.resource-heading { padding-block: 44px 32px; }
.resource-heading h1 { margin: 0; color: var(--old-purple); font-size: clamp(38px, 6vw, 64px); }
.resource-banner { display: block; width: 100%; height: 350px; object-fit: cover; object-position: center; }
.resource-content { max-width: 980px; padding-block: 42px 70px; }
.resource-intro { margin-top: 0; color: var(--old-purple); font-size: clamp(26px, 4vw, 38px); }
.resource-content section { padding-block: 24px; border-bottom: 1px solid var(--old-line); scroll-margin-top: 24px; }
.resource-content section h2 { margin: 0 0 16px; color: #ff6600; font-size: 27px; }
.resource-content p { font-size: 18px; }
.resource-content a { color: #ff6600; font-family: inherit; text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.resource-content a:hover { color: var(--old-orange); }
.resource-content a:focus-visible { outline: 3px solid var(--old-orange); outline-offset: 4px; }
.resource-jumps { display: flex; flex-wrap: wrap; gap: 10px 22px; padding-bottom: 20px; }
.resource-downloads { padding-left: 24px; font-size: 18px; }
.resource-downloads li, .resource-guide li { margin-block: 10px; }
.resource-note { padding: 16px 20px; border-left: 4px solid var(--old-purple); background: var(--old-purple-soft); }
.resource-guide { padding: 22px; background: var(--old-purple-soft); scroll-margin-top: 24px; }
.resource-guide h3 { margin-top: 0; color: var(--old-purple); font-size: 23px; }
.resource-guide ol { padding-left: 24px; font-size: 18px; }
.resource-help { margin-top: 30px; }
@media (max-width: 600px) {
    .resource-banner { height: 190px; }
    .resource-heading { padding-block: 28px 22px; }
    .resource-content { padding-block: 28px 42px; }
    .resource-guide { padding: 16px; }
}
.resource-original h3 { margin: 32px 0 16px; font-size: 27px; }