.reference-intro h1 { max-width: 22ch; }
.reference-overview { color: #425560; font-weight: 700; margin-top: 1.5rem; }
.reference-jump { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.4rem; }
.reference-jump a { padding: .7rem 1rem; border: 1px solid #8fa2a7; border-radius: 999px; color: #071925; background: #fff; font-size: .95rem; font-weight: 650; text-decoration: none; }
.reference-jump a:hover { background: #e8f5cc; }
.reference-jump a:focus-visible, .reference-photo:focus-visible { outline: 3px solid #315e74; outline-offset: 4px; }
.reference-section { scroll-margin-top: 100px; }
.reference-section:nth-of-type(odd) { background: #f4f7f4; }
.reference-section h2 { max-width: 28ch; }
.reference-context { max-width: 82ch; line-height: 1.8; color: #43565e; }
.reference-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.reference-card { margin: 0; min-width: 0; border: 1px solid #dbe4e3; border-radius: 18px; background: #fff; overflow: hidden; }
.reference-photo { display: flex; justify-content: center; align-items: center; aspect-ratio: 4/3; padding: 12px; background: #eaf0ef; }
.reference-photo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.reference-card figcaption { padding: 20px 22px 24px; color: #43565e; font-size: .96rem; line-height: 1.75; }
.reference-card figcaption strong { display: block; margin-bottom: .7rem; color: #071925; font-size: 1.1rem; line-height: 1.4; }
.reference-number { display: block; color: #456716; font-size: .78rem; font-weight: 750; letter-spacing: .05em; margin-bottom: .45rem; }
.reference-thermal-note { max-width: 82ch; margin-top: 2rem; padding: 1rem 1.25rem; border-left: 3px solid #557916; background: #eef6de; color: #324423; line-height: 1.7; }
.reference-alias { display: block; height: 0; scroll-margin-top: 100px; }
@media (min-width: 1200px) { .reference-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .reference-grid { grid-template-columns: 1fr; gap: 20px; } .reference-jump a { flex: 1 1 200px; } .reference-card figcaption { padding: 18px; } }
