.archive-recommendation {
  margin: 0 0 28px;
  padding: clamp(22px, 4vw, 34px);
  border: 1px solid rgba(181, 154, 104, .32);
  border-left: 3px solid var(--archive-gold, #b59a68);
  background: linear-gradient(115deg, #17120e, #0c0a08);
}

.archive-recommendation .eyebrow {
  margin: 0 0 10px;
  color: #d8bd89;
}

.archive-recommendation p:last-child {
  max-width: 790px;
  margin: 0;
  color: #c9bdad;
  font: 500 clamp(1rem, 2vw, 1.2rem)/1.65 Georgia, serif;
}

.archive-document-number {
  display: inline-block;
  margin-bottom: 15px;
  padding: 6px 11px;
  border: 1px solid rgba(181, 154, 104, .55);
  color: #e2c58f;
  background: rgba(181, 154, 104, .08);
  font: 600 .85rem/1.2 Arial, sans-serif;
  letter-spacing: .18em;
}

.archive-card .status { display: block; }

.archive-timeline h2 { overflow-wrap: anywhere; }

.archive-doc-back {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  margin: 26px 0;
  padding: 12px 20px;
  border: 1px solid rgba(181, 154, 104, .6);
  color: #e9d4a8;
  background: #17120ee8;
  font: 700 .72rem/1.35 Arial, sans-serif;
  letter-spacing: .12em;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .2s, border-color .2s;
}

.archive-doc-back:hover,
.archive-doc-back:focus-visible {
  border-color: #e2c58f;
  color: #fff2d7;
  background: #2b2116;
}

@media (max-width: 600px) {
  .archive-doc-back { max-width: 100%; width: 100%; text-align: center; }
  .archive-recommendation { margin-bottom: 18px; }
}