.bwe-archive-hub { padding: clamp(24px, 4vw, 64px) 0; color: #171817; background: #d9d7cf; }
.bwe-archive-hub__machine { position: relative; overflow: hidden; border: 1px solid #5f605d; background: repeating-linear-gradient(0deg, rgba(0,0,0,.025) 0 1px, transparent 1px 7px), #e1dfd7; box-shadow: 9px 9px 0 rgba(0,0,0,.11); }
.bwe-archive-hub__machine::before, .bwe-archive-hub__machine::after { position: absolute; z-index: 2; top: 12px; width: 12px; aspect-ratio: 1; border-radius: 50%; content: ""; background: radial-gradient(circle at 35% 35%, #ddd 0 12%, #777 18% 42%, #222 48% 60%, #777 66%); }
.bwe-archive-hub__machine::before { left: 12px; }
.bwe-archive-hub__machine::after { right: 12px; }
.bwe-archive-hub__header { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .34fr); color: #eceae3; background: #121313; border-bottom: 6px solid #ed2635; }
.bwe-archive-hub__header > div { padding: clamp(34px, 5vw, 72px); }
.bwe-archive-hub__header small { color: #ed2635; font: 700 12px/1.4 "Courier New", monospace; letter-spacing: .1em; }
.bwe-archive-hub__header h1 { margin: 16px 0; color: #fff; font: 900 clamp(36px, 6vw, 84px)/.9 Arial, sans-serif; letter-spacing: -.035em; text-transform: uppercase; }
.bwe-archive-hub__header p { max-width: 760px; margin: 0; color: #afaea8; font: 15px/1.7 "Courier New", monospace; }
.bwe-archive-hub__header aside { display: grid; align-content: center; gap: 12px; padding: 28px; border-left: 1px solid #4c4d4a; font: 13px/1.4 "Courier New", monospace; }
.bwe-archive-hub__header aside span { color: #888984; }
.bwe-archive-hub__header aside b { color: #ed2635; }
.bwe-archive-hub__routes { display: grid; grid-template-columns: repeat(3, 1fr); }
.bwe-archive-hub__routes a { position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto 1fr; gap: 8px 14px; min-height: 170px; padding: 26px; color: #171817; border-right: 1px solid #777873; border-bottom: 1px solid #777873; text-decoration: none; }
.bwe-archive-hub__routes a:nth-child(3n) { border-right: 0; }
.bwe-archive-hub__routes a span { grid-row: 1 / 3; color: #ed2635; font: 800 15px/1 "Courier New", monospace; }
.bwe-archive-hub__routes a b { font: 900 20px/1.1 Arial, sans-serif; text-transform: uppercase; }
.bwe-archive-hub__routes a small { color: #5f605c; font: 14px/1.55 "Courier New", monospace; }
.bwe-archive-hub__routes a:hover, .bwe-archive-hub__routes a:focus-visible { color: #fff; background: #ed2635; outline: 0; }
.bwe-archive-hub__routes a:hover span, .bwe-archive-hub__routes a:focus-visible span, .bwe-archive-hub__routes a:hover small, .bwe-archive-hub__routes a:focus-visible small { color: #fff; }
.bwe-archive-hub__machine > footer { display: flex; justify-content: space-between; gap: 16px; padding: 12px 22px; color: #b6b5af; background: #121313; font: 12px/1.4 "Courier New", monospace; }
.bwe-archive-hub__machine > footer span:first-child { color: #80d29d; }
@media (max-width: 820px) {
  .bwe-archive-hub { padding: 14px 0 28px; }
  .bwe-archive-hub__header { grid-template-columns: 1fr; }
  .bwe-archive-hub__header > div { padding: 38px 22px; }
  .bwe-archive-hub__header h1 { font-size: clamp(38px, 13vw, 62px); }
  .bwe-archive-hub__header aside { grid-template-columns: 1fr auto; padding: 18px 22px; border-left: 0; border-top: 1px solid #4c4d4a; }
  .bwe-archive-hub__routes { grid-template-columns: 1fr; }
  .bwe-archive-hub__routes a, .bwe-archive-hub__routes a:nth-child(3n) { min-height: 126px; border-right: 0; }
  .bwe-archive-hub__machine > footer { display: grid; grid-template-columns: 1fr; font-size: 12px; }
}