.archive-head {
  padding: clamp(58px, 8vw, 104px) 0 38px;
  background: var(--paper);
  border-bottom: 1px solid var(--line-dark);
}

.archive-head h1 {
  max-width: 800px;
  margin: 0;
  color: var(--navy);
  font-family: var(--serif);
  font-size: clamp(3rem, 6vw, 5.45rem);
  font-weight: 500;
  line-height: .95;
}

.archive-section {
  padding: clamp(54px, 7vw, 84px) 0;
}

.record-list {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 3px solid var(--navy);
  background: var(--paper);
}

.record-row {
  display: grid;
  grid-template-columns: 50px minmax(0, 1.1fr) minmax(145px, auto);
  gap: 26px;
  align-items: center;
  min-height: 100px;
  padding: 28px 30px;
  border-bottom: 1px solid var(--line);
}

.record-row:hover {
  background: var(--paper-soft);
}

.number {
  align-self: start;
  padding-top: 10px;
  color: var(--gold);
}

.record-title {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(1.3rem, 2.2vw, 1.85rem);
  font-weight: 500;
  line-height: 1.06;
}

.record-actions {
  display: flex;
  justify-content: flex-end;
  gap: 16px;
  color: var(--navy);
  font-size: .78rem;
  font-weight: 800;
  white-space: nowrap;
}

.record-actions a {
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(23, 56, 120, .35);
}

.record-actions a:hover {
  color: var(--red);
  border-color: var(--red);
}

.archive-note {
  display: grid;
  grid-template-columns: 45px minmax(0, 1fr);
  gap: 20px;
  margin-top: 35px;
  padding: 28px 30px;
  border-left: 4px solid var(--blue);
  background: var(--blue-wash);
}

.archive-note .number {
  color: var(--navy);
}

.archive-note p {
  max-width: 760px;
  margin: 0;
  color: var(--ink-soft);
  font-family: var(--serif);
  font-size: 1.02rem;
}

@media (max-width: 900px) {
  :root {
    --page: min(100% - 42px, 1260px);
  }

  .record-row {
    grid-template-columns: 38px minmax(0, 1fr) minmax(140px, auto);
  }

  .record-actions {
    grid-column: 3;
    grid-row: 1;
  }
}

@media (max-width: 680px) {
  :root {
    --page: min(100% - 28px, 1260px);
  }

  .record-row {
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 12px;
    min-height: 0;
    padding: 23px 0;
    background: transparent;
  }

  .record-actions {
    grid-column: 2;
    grid-row: auto;
    justify-content: flex-start;
  }

  .archive-note {
    grid-template-columns: 32px minmax(0, 1fr);
    padding: 22px;
  }
}