/* Supplemental reference surfaces: each block follows its own real-world handoff. */
.reference-recovery { margin-top: 34px; padding: 28px; border-top: 3px solid #1a1a1a; background: #fff; }
.reference-recovery > header { max-width: 790px; margin-bottom: 21px; }
.reference-recovery h2 { margin: 0; color: #1a1a1a; font-size: 25px; line-height: 1.5; }
.reference-recovery > header p { margin: 9px 0 0; color: #514b45; font-size: 14px; line-height: 1.9; }

.event-term-crosswalk { border-top-color: #a4000c; }
.event-term-crosswalk-table { border: 1px solid #e0d8ce; }
.event-term-crosswalk table { width: 100%; border-collapse: collapse; color: #1a1a1a; font-size: 13px; line-height: 1.8; }
.event-term-crosswalk th, .event-term-crosswalk td { padding: 14px 16px; border-bottom: 1px solid #e0d8ce; text-align: left; vertical-align: top; }
.event-term-crosswalk thead th { background: #a4000c; color: #fff; font-weight: 700; }
.event-term-crosswalk tbody th { width: 17%; background: #f2ece3; color: #a4000c; font-weight: 700; }
.event-term-crosswalk tbody tr:nth-child(even) td { background: #fffaf5; }
.event-term-crosswalk tbody tr:hover th, .event-term-crosswalk tbody tr:hover td { background: #fff0ed; }

.packing-handoff { border-top-color: #c8a45c; background: #fff8ec; }
.packing-handoff-ledger { margin: 0; border-top: 2px solid #1a1a1a; }
.packing-handoff-ledger > div { display: grid; grid-template-columns: 126px minmax(0, 1fr); align-items: start; border-bottom: 1px solid #e0d8ce; }
.packing-handoff-ledger dt { align-self: start; padding: 17px; color: #a4000c; background: #f2ece3; font: 700 12px/1.55 "IBM Plex Mono", "Roboto Mono", monospace; text-align: left; }
.packing-handoff-ledger dd { display: grid; grid-template-columns: minmax(165px, .8fr) minmax(0, 2fr); align-items: start; gap: 18px; margin: 0; padding: 17px; background: #fff; text-align: left; }
.packing-handoff-ledger strong { display: block; align-self: start; color: #1a1a1a; font-size: 14px; line-height: 1.7; text-align: left; }
.packing-handoff-ledger span { display: block; align-self: start; color: #514b45; font-size: 13px; line-height: 1.85; text-align: left; }
.packing-handoff aside, .age-label-surfaces aside { margin-top: 19px; padding: 16px 18px; border-left: 4px solid #a4000c; background: #f2ece3; color: #514b45; font-size: 13px; line-height: 1.85; }

.age-label-surfaces { border-top-color: #a4000c; }
.age-label-surface-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 2px solid #1a1a1a; border-left: 1px solid #e0d8ce; }
.age-label-surface-list article { min-width: 0; padding: 20px 21px; border-right: 1px solid #e0d8ce; border-bottom: 1px solid #e0d8ce; background: #fff; }
.age-label-surface-list article:nth-child(2), .age-label-surface-list article:nth-child(3) { background: #f2ece3; }
.age-label-surface-list h3 { margin: 0; color: #a4000c; font-size: 17px; line-height: 1.5; }
.age-label-surface-list p { margin: 9px 0 0; color: #514b45; font-size: 13px; line-height: 1.85; }

@media (max-width: 760px) {
    .reference-recovery { padding: 23px 18px; }
    .reference-recovery h2 { font-size: 21px; }
    .event-term-crosswalk-table { border: 0; }
    .event-term-crosswalk table, .event-term-crosswalk tbody, .event-term-crosswalk tr, .event-term-crosswalk th, .event-term-crosswalk td { display: block; width: 100%; }
    .event-term-crosswalk thead { display: none; }
    .event-term-crosswalk tbody tr { margin-top: 12px; border: 1px solid #e0d8ce; background: #fff; }
    .event-term-crosswalk tbody tr:first-child { margin-top: 0; }
    .event-term-crosswalk tbody th, .event-term-crosswalk tbody td { box-sizing: border-box; padding: 11px 14px; border-bottom: 1px solid #e0d8ce; }
    .event-term-crosswalk tbody th { background: #a4000c; color: #fff; }
    .event-term-crosswalk tbody td { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 10px; background: #fff; }
    .event-term-crosswalk tbody tr:nth-child(even) td { background: #fff; }
    .event-term-crosswalk tbody td::before { content: attr(data-label); color: #a4000c; font-size: 12px; font-weight: 700; }
    .event-term-crosswalk tbody td:last-child, .event-term-crosswalk tbody th:last-child { border-bottom: 0; }
    .packing-handoff-ledger > div { grid-template-columns: 1fr; }
    .packing-handoff-ledger dt { padding: 12px 14px; }
    .packing-handoff-ledger dd { grid-template-columns: 1fr; gap: 7px; padding: 14px; }
    .packing-handoff aside, .age-label-surfaces aside { margin-right: -18px; margin-left: -18px; padding-right: 18px; padding-left: 18px; }
    .age-label-surface-list { grid-template-columns: 1fr; }
    .age-label-surface-list article:nth-child(2), .age-label-surface-list article:nth-child(3) { background: #f2ece3; }
}