/* Case-study additions; self-hosted alongside the unmodified KERN assets. */
.case-body h3 { font-size: 1.25rem; margin-block: 1.5rem .5rem; }
.case-body ul, .case-body ol { margin-block: 1rem; }
.case-outline { margin-top: 2rem; }
.case-outline ul { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; list-style: none; padding: 0; }
.case-outline li { margin: 0; }
.case-outline a { display: inline-block; padding-block: .375rem; }
.case-facts p { font-size: 1rem; margin-top: 1rem; }
.case-architecture { margin-block: 3rem; border-top: 1px solid var(--site-line); padding-top: 2rem; }
.case-architecture h2 { margin-bottom: 1rem; }
.case-architecture > p { max-width: 70ch; }
.architecture-figure { margin: 1.5rem 0; }
.architecture-figure picture { display: block; background: var(--kern-color-layout-background-default-contextual); border: 1px solid var(--kern-color-decorative-border-contextual); border-radius: .25rem; padding: 1rem; }
.architecture-figure img { display: block; width: 100%; height: auto; }
.architecture-figure figcaption { max-width: 80ch; margin-top: 1rem; font-size: 1rem; color: var(--site-muted); }
.diagram-links { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; list-style: none; padding: 0; margin-block: 1rem; }
.diagram-links li { margin: 0; }
.diagram-links a { display: inline-block; padding-block: .5rem; }
.diagram-description { max-width: 75ch; }
.diagram-description summary { cursor: pointer; padding-block: .75rem; font-weight: 500; text-decoration: underline; text-underline-offset: .2em; color: var(--site-action); }
.diagram-description ol { margin-block: 1rem; }
@media (max-width: 46rem) {
 .architecture-figure picture { max-width: 26rem; padding: .5rem; margin-inline: auto; }
}
@media (forced-colors: active) {
 .architecture-figure picture { border-color: CanvasText; }
 .diagram-description summary { color: LinkText; }
}
@media print {
 .diagram-description::details-content { content-visibility: visible; }
 .diagram-description > ol { display: block !important; }
}