/* A quiet continuation of the reading page, using the approved category palette. */
.guide-v5 .related-cases{padding:39px 0 55px;border-top:1px solid #dce2d8}
.guide-v5 .related-cases-heading{display:flex;align-items:baseline;justify-content:space-between;gap:40px;margin-bottom:31px}
.guide-v5 .related-cases-heading h2{margin:0;font:400 30px/1.25 Lora,serif;letter-spacing:-.8px;color:#263a30}
.guide-v5 .related-cases-heading p{max-width:340px;margin:0;font:12px/1.8 Inter,sans-serif;color:#7b867d;text-wrap:pretty}
.guide-v5 .related-cases-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.guide-v5 .related-case{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto 1fr auto;gap:0 25px;min-width:0;padding:27px 28px 23px;border:1px solid #dfe4dc;background:#ffffff6b;color:#263a30;border-radius:3px;isolation:isolate;transition:border-color .22s ease,background-color .22s ease}
.guide-v5 .related-case-accent{position:absolute;left:28px;top:-1px;width:54px;height:4px;background:linear-gradient(100deg,var(--tone-light),var(--tone-rich));border-radius:0 0 2px 2px}
.guide-v5 .related-case-category{grid-column:1/-1;font:9px/1.6 Inter,sans-serif;letter-spacing:.055em;text-transform:uppercase;color:#7c887e;margin-bottom:19px}
.guide-v5 .related-case h3{grid-column:1/-1;max-width:440px;margin:0 0 21px;font:500 23px/1.33 Manrope,sans-serif;letter-spacing:-.65px;text-transform:lowercase;text-wrap:pretty;color:#263a30}
.guide-v5 .related-case-connection{grid-column:1/-1;display:block;max-width:430px;margin:0 0 24px;font:12px/1.75 Inter,sans-serif;color:#7c867e;text-wrap:pretty}
.guide-v5 .related-case-connection>span{display:block;margin-bottom:3px;color:#4b6255;font-weight:500}
.guide-v5 .related-case-open{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:20px;font:11px/1.5 Inter,sans-serif;color:#54685b}
.guide-v5 .related-case-open>span{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border:1px solid #cfd8cc;border-radius:50%;color:#294434;transition:background-color .4s ease,border-color .4s ease,color .4s ease}
/* Size the viewport, not the SVG: both copies must travel the same distance. */
.guide-v5 .related-case-open .ui-arrow{--arrow-size:12px}
.guide-v5 .related-case:focus-visible{outline:2px solid #263a30;outline-offset:5px}
.guide-v5 .related-case:focus-visible .related-case-open>span{background:var(--tone-soft);border-color:var(--tone-rich)}
html[data-color-mode="dark"] .guide-v5 .related-case:focus-visible .related-case-open>span{color:#203328}
@media(hover:hover){.guide-v5 .related-case:hover{border-color:#b8c4b5;background:#fff}.guide-v5 .related-case:hover .related-case-open>span{background:var(--tone-soft);border-color:var(--tone-rich)}}
@media(max-width:760px){.guide-v5 .related-cases{padding:30px 0 38px}.guide-v5 .related-cases-heading{display:block;margin-bottom:25px}.guide-v5 .related-cases-heading h2{font-size:27px;letter-spacing:-.6px}.guide-v5 .related-cases-heading p{margin-top:13px;max-width:320px}.guide-v5 .related-cases-grid{grid-template-columns:1fr;gap:20px}.guide-v5 .related-case{padding:24px 22px 19px}.guide-v5 .related-case-accent{left:22px}.guide-v5 .related-case h3{font-size:21px;letter-spacing:-.5px}.guide-v5 .related-case-connection{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.guide-v5 .related-case,.guide-v5 .related-case-open>span{transition:none}}
