/* Pelorus Voyages — the in-world travel-operator look for the Pelorus Space test corpus.
   Deliberately a different brand from the Pelorus Query site; the dataset banner
   and the "About the dataset" page are the bridge back. */

:root {
  --void: #04080f;
  --hull: #0a121e;
  --panel: #0f1a29;
  --panel-2: #142236;
  --star: #f3eee4;
  --dim: #a3aebd;
  --faint: #6d7a8b;
  --line: rgba(243, 238, 228, 0.12);
  --brass: #d4ad66;
  --brass-2: #f0d49a;
  --flare: #e8743b;
  --ice: #8fd0e8;
  --ok: #5fc59a;
  --warn: #e8b53b;
  --bad: #ef6f6c;
  --display: "Cormorant Garamond", "Cormorant", Georgia, serif;
  --sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  --max: 1200px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--void);
  color: var(--star);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  font-variant-numeric: lining-nums;
}
a { color: inherit; }
img { max-width: 100%; display: block; }
code { font-family: var(--mono); font-size: .88em; }

.wrap { width: min(var(--max), 100% - 32px); margin-inline: auto; }

/* ---------- dataset banner (the out-of-world bridge) ---------- */
.dataset-banner {
  position: relative;
  z-index: 30;
  background: #f7f8f6;
  color: #16202a;
  font-size: 13.5px;
  border-bottom: 1px solid #d9e0e5;
}
.dataset-banner .wrap {
  display: flex; gap: 12px; align-items: center; justify-content: space-between;
  padding: 8px 0; flex-wrap: wrap;
}
.dataset-banner .tag {
  display: inline-flex; align-items: center; gap: 8px;
}
.dataset-banner img { width: 18px; height: 18px; }
.dataset-banner b { font-weight: 650; }
.dataset-banner a { color: #0f766e; font-weight: 600; text-decoration: none; white-space: nowrap; }
.dataset-banner a:hover { text-decoration: underline; }
.banner-links { display: inline-flex; gap: 16px; }

/* ---------- header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 25;
  background: rgba(4, 8, 15, 0.72);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; height: 68px; gap: 24px; }
.logo { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.logo svg { width: 34px; height: 34px; }
.logo .word { white-space: nowrap; font-family: var(--display); font-size: 25px; font-weight: 600; letter-spacing: .04em; line-height: 1; }
.logo .word small { display: block; font-family: var(--sans); font-size: 9.5px; letter-spacing: .38em; color: var(--brass); font-weight: 600; margin-top: 4px; }
.main-nav { display: flex; align-items: center; gap: 28px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; }
.main-nav a { text-decoration: none; color: var(--dim); white-space: nowrap; }
.main-nav a:hover, .main-nav a[aria-current] { color: var(--star); }
.main-nav a.btn-brass { color: #1b1305; }
.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 22px; border-radius: 999px;
  font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  text-decoration: none; border: 1px solid transparent; cursor: pointer;
}
.btn-brass { background: var(--brass); color: #1b1305; }
.btn-brass:hover { background: var(--brass-2); }
.btn-ghost { border-color: rgba(243, 238, 228, .35); color: var(--star); }
.btn-ghost:hover { border-color: var(--star); }
.menu-toggle { display: none; }

/* ---------- hero ---------- */
.hero {
  position: relative; overflow: hidden;
  min-height: 720px;
  background: url(art/starfield.webp) center / cover;
  display: grid; align-items: center;
}
.hero .planet {
  position: absolute; right: -8%; top: 50%; transform: translateY(-50%);
  width: min(760px, 70vw); opacity: .98;
  filter: drop-shadow(0 0 80px rgba(232, 116, 59, .25));
}
.hero .moonlet { position: absolute; width: 90px; right: 42%; top: 16%; opacity: .9; }
.hero-copy { position: relative; z-index: 2; max-width: 620px; padding: 120px 0; }
.kicker {
  font-size: 12px; letter-spacing: .38em; text-transform: uppercase; color: var(--brass); font-weight: 600;
}
.hero h1 {
  font-family: var(--display); font-weight: 500;
  font-size: clamp(48px, 7vw, 92px); line-height: .98; margin: 18px 0 22px; letter-spacing: -.01em;
}
.hero h1 em { font-style: italic; color: var(--brass-2); }
.hero p.lede { font-size: 19px; color: var(--dim); max-width: 520px; margin: 0 0 34px; }
.hero .actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* departure board strip */
.board {
  position: relative; z-index: 3;
  margin-top: -64px;
}
.board-inner {
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: rgba(15, 26, 41, .92); border: 1px solid var(--line); border-radius: 14px;
  backdrop-filter: blur(10px); overflow: hidden;
}
.board-cell { padding: 20px 24px; border-right: 1px solid var(--line); }
.board-cell:last-child { border-right: 0; }
.board-cell .lbl { font-size: 11px; letter-spacing: .24em; text-transform: uppercase; color: var(--faint); }
.board-cell .val { font-family: var(--display); font-size: 26px; margin-top: 4px; }
.board-cell .sub { font-size: 13px; color: var(--dim); }

/* ---------- sections ---------- */
section { padding: 110px 0; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 32px; margin-bottom: 48px; flex-wrap: wrap; }
.section-head h2, h2.display {
  font-family: var(--display); font-weight: 500; font-size: clamp(36px, 4.6vw, 58px); line-height: 1.04; margin: 12px 0 0;
}
.section-head p { max-width: 460px; color: var(--dim); margin: 0; }

/* destinations */
.dest-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.dest {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, var(--panel) 0%, var(--hull) 100%);
  border: 1px solid var(--line); border-radius: 16px;
  padding: 180px 26px 26px; min-height: 420px;
  display: flex; flex-direction: column; justify-content: flex-end;
  transition: transform .3s ease, border-color .3s ease;
}
.dest:hover { transform: translateY(-4px); border-color: rgba(212, 173, 102, .5); }
.dest img { position: absolute; width: 270px; top: -80px; right: -70px; transition: transform .6s ease; }
.dest > :not(img) { position: relative; z-index: 1; }
.dest:hover img { transform: rotate(8deg) scale(1.04); }
.dest .where { font-size: 11px; letter-spacing: .26em; text-transform: uppercase; color: var(--brass); }
.dest h3 { font-family: var(--display); font-weight: 500; font-size: 34px; margin: 6px 0 8px; line-height: 1.05; }
.dest p { color: var(--dim); font-size: 14.5px; margin: 0 0 16px; }
.facts { display: flex; flex-wrap: wrap; gap: 8px; }
.fact { font-size: 12px; padding: 5px 10px; border: 1px solid var(--line); border-radius: 999px; color: var(--dim); }
.fact b { color: var(--star); font-weight: 600; }

/* experiences (flyers) */
.exp-row { display: grid; grid-template-columns: 1.2fr 1fr; gap: 0; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; margin-bottom: 22px; background: var(--panel); }
.exp-row.flip { grid-template-columns: 1fr 1.2fr; }
.exp-row.flip .exp-art { order: 2; }
.exp-art { position: relative; min-height: 340px; background: url(art/starfield.webp) center / cover; overflow: hidden; }
.exp-art img.hz { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 62%; object-fit: cover; }
.exp-art img.orb { position: absolute; width: 38%; top: 12%; right: 10%; }
.exp-body { padding: 44px; }
.exp-body h3 { font-family: var(--display); font-weight: 500; font-size: 40px; line-height: 1.05; margin: 8px 0 14px; }
.exp-body p { color: var(--dim); }
.exp-body .quote { font-family: var(--display); font-style: italic; font-size: 22px; color: var(--star); line-height: 1.3; border-left: 2px solid var(--brass); padding-left: 16px; margin: 18px 0; }

/* itineraries */
.itins { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.itin { border: 1px solid var(--line); border-radius: 16px; padding: 30px; background: var(--hull); display: flex; flex-direction: column; }
.itin.feature { background: linear-gradient(160deg, #1b2a40, #0c1523); border-color: rgba(212, 173, 102, .45); }
.itin .code { font-family: var(--mono); font-size: 12px; color: var(--brass); letter-spacing: .12em; }
.itin h3 { font-family: var(--display); font-weight: 500; font-size: 32px; margin: 6px 0 4px; }
.itin .days { font-size: 14px; color: var(--dim); margin-bottom: 20px; }
.route { list-style: none; padding: 0; margin: 0 0 22px; position: relative; flex: 1; }
.route::before { content: ""; position: absolute; left: 6px; top: 8px; bottom: 8px; width: 1px; background: linear-gradient(var(--brass), transparent); }
.route li { position: relative; padding: 0 0 12px 26px; font-size: 14.5px; }
.route li::before { content: ""; position: absolute; left: 1px; top: 7px; width: 11px; height: 11px; border-radius: 50%; background: var(--void); border: 2px solid var(--brass); }
.route li span { color: var(--faint); font-size: 12.5px; display: block; }

/* cabin classes */
.cabins { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.cabin { padding: 34px; border-right: 1px solid var(--line); background: var(--hull); }
.cabin:last-child { border-right: 0; background: linear-gradient(180deg, #1c2a3f, var(--hull)); }
.cabin .tier { font-size: 11px; letter-spacing: .3em; text-transform: uppercase; color: var(--brass); }
.cabin h3 { font-family: var(--display); font-weight: 500; font-size: 38px; margin: 6px 0 14px; }
.cabin ul { padding: 0; margin: 0; list-style: none; }
.cabin li { padding: 9px 0; border-top: 1px solid var(--line); font-size: 14px; color: var(--dim); display: flex; justify-content: space-between; gap: 12px; }
.cabin li b { color: var(--star); font-weight: 600; text-align: right; }

/* brochure library strip */
.library-cta {
  display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: center;
  border: 1px solid var(--line); border-radius: 18px; padding: 44px;
  background: radial-gradient(circle at 90% 20%, rgba(212, 173, 102, .16), transparent 50%), var(--panel);
}

/* footer */
.site-footer { border-top: 1px solid var(--line); padding: 60px 0 40px; color: var(--faint); font-size: 13.5px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
.site-footer h4 { color: var(--star); font-size: 12px; letter-spacing: .24em; text-transform: uppercase; margin: 0 0 14px; font-weight: 600; }
.site-footer a { display: block; text-decoration: none; padding: 3px 0; }
.site-footer a:hover { color: var(--star); }
.fine { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; }

/* ---------- dataset / traps pages ---------- */
.page-hero { padding: 96px 0 56px; background: url(art/starfield.webp) center / cover; border-bottom: 1px solid var(--line); position: relative; overflow: hidden; }
.page-hero img.orb { position: absolute; width: 360px; right: -60px; top: -40px; opacity: .85; }
.page-hero h1 { font-family: var(--display); font-weight: 500; font-size: clamp(42px, 6vw, 72px); line-height: 1; margin: 16px 0 18px; max-width: 800px; position: relative; }
.page-hero p { font-size: 18.5px; color: var(--dim); max-width: 680px; margin: 0; position: relative; }
.prose { max-width: 760px; }
.prose p, .prose li { color: #cfd5de; }
.prose h2 { font-family: var(--display); font-weight: 500; font-size: 40px; margin: 64px 0 12px; line-height: 1.1; }
.prose h3 { font-size: 18px; margin: 32px 0 8px; }
.prose code { background: var(--panel-2); padding: 1px 6px; border-radius: 4px; }
.stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 36px 0; }
.stat { border: 1px solid var(--line); border-radius: 14px; padding: 20px; background: var(--hull); }
.stat .n { font-family: var(--display); font-size: 46px; line-height: 1; color: var(--brass-2); }
.stat .l { font-size: 13px; color: var(--dim); margin-top: 6px; }

.family-table, .doc-table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 20px 0; }
.family-table th, .family-table td, .doc-table th, .doc-table td { text-align: left; padding: 11px 12px; border-bottom: 1px solid var(--line); vertical-align: top; }
.family-table th, .doc-table th { font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: var(--faint); font-weight: 600; }
.family-table td:first-child { font-family: var(--mono); font-size: 12.5px; color: var(--brass); width: 36%; word-spacing: .4em; }

/* trap cards */
.trap-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0 0; }
.trap-nav a { font-size: 13px; text-decoration: none; padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; color: var(--dim); }
.trap-nav a:hover { color: var(--star); border-color: var(--brass); }
.trap { border: 1px solid var(--line); border-radius: 18px; background: var(--hull); margin: 28px 0; overflow: hidden; scroll-margin-top: 90px; }
.trap-head { display: grid; grid-template-columns: 64px 1fr; gap: 20px; padding: 30px 32px 10px; }
.trap-num { font-family: var(--display); font-size: 54px; line-height: .9; color: var(--brass); }
.trap-head h3 { font-family: var(--display); font-weight: 500; font-size: 32px; margin: 0 0 6px; line-height: 1.1; }
.trap-head p { margin: 0; color: var(--dim); }
.trap-body { padding: 10px 32px 32px 116px; }
.qa { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
.q { grid-column: 1 / -1; font-size: 17px; padding: 14px 18px; border-radius: 12px; background: var(--panel-2); border: 1px solid var(--line); }
.q::before { content: "Passenger asks"; display: block; font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--faint); margin-bottom: 4px; }
.ans { padding: 16px 18px; border-radius: 12px; font-size: 14.5px; border: 1px solid; }
.ans::before { display: block; font-size: 10.5px; letter-spacing: .24em; text-transform: uppercase; margin-bottom: 6px; font-weight: 600; }
.ans.wrong { border-color: rgba(239, 111, 108, .35); background: rgba(239, 111, 108, .06); }
.ans.wrong::before { content: "What a naive RAG says"; color: var(--bad); }
.ans.right { border-color: rgba(95, 197, 154, .35); background: rgba(95, 197, 154, .06); }
.ans.right::before { content: "What the corpus supports"; color: var(--ok); }
.why { margin-top: 14px; font-size: 14px; color: var(--dim); }
.why b { color: var(--star); }
.srcs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.src { font-family: var(--mono); font-size: 11.5px; padding: 3px 8px; border-radius: 6px; background: rgba(212, 173, 102, .1); color: var(--brass-2); border: 1px solid rgba(212, 173, 102, .25); text-decoration: none; }

.callout { border-left: 3px solid var(--brass); background: var(--panel); padding: 18px 22px; border-radius: 0 12px 12px 0; margin: 28px 0; color: #cfd5de; }
.callout b { color: var(--star); }

/* brochure library */
.shelf { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.brochure { border: 1px solid var(--line); border-radius: 14px; background: var(--hull); overflow: hidden; display: flex; flex-direction: column; text-decoration: none; }
.brochure .cover { height: 150px; position: relative; background: url(art/starfield.webp) center / cover; overflow: hidden; }
.brochure .cover img { position: absolute; }
.brochure .cover .hz { left: 0; bottom: 0; width: 100%; height: 55%; object-fit: cover; }
.brochure .cover .orb { width: 110px; right: -16px; top: -14px; }
.brochure .meta { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 6px; }
.brochure .meta .t { font-family: var(--display); font-size: 21px; line-height: 1.15; }
.brochure .meta .f { font-family: var(--mono); font-size: 11.5px; color: var(--faint); }
.brochure .links { display: flex; gap: 8px; padding: 0 16px 16px; }
.brochure .links a, .brochure .links span { font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--line); color: var(--dim); }
.brochure .links a.pdf { border-color: rgba(212, 173, 102, .5); color: var(--brass-2); }
.brochure .links span.soon { opacity: .5; }
.filter-bar { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 26px; }
.filter-bar button { font: inherit; font-size: 13px; background: transparent; color: var(--dim); border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; cursor: pointer; }
.filter-bar button[aria-pressed="true"] { background: var(--brass); color: #1b1305; border-color: var(--brass); }

.shelf-title { font-family: var(--display); font-weight: 500; font-size: 30px; margin: 54px 0 18px; display: flex; align-items: baseline; gap: 12px; scroll-margin-top: 90px; }
.shelf-title span { font-family: var(--mono); font-size: 13px; color: var(--faint); }
.brochure .untitled { font-style: normal; color: var(--warn); opacity: .8; }
.brochure[hidden], .shelf[hidden], .shelf-title[hidden] { display: none; }
.pdf-rules { display: grid; grid-template-columns: 1fr 1.4fr; gap: 44px; border: 1px solid var(--line); border-radius: 18px; padding: 40px; background: var(--hull); }
.rule-list { list-style: none; margin: 0; padding: 0; }
.rule-list li { padding: 12px 0; border-top: 1px solid var(--line); color: var(--dim); font-size: 14.5px; }
.rule-list li:first-child { border-top: 0; padding-top: 0; }
.rule-list b { color: var(--star); }
.rule-list code, .page-hero code { background: var(--panel-2); padding: 1px 6px; border-radius: 4px; }
.skip-link[hidden] { display: none; }

.code-chip { font-family: var(--mono); font-size: 11.5px; letter-spacing: .06em; color: var(--ice); margin-bottom: 6px; }
.legend { color: var(--faint); font-size: 14px; max-width: 760px; margin: 0 0 8px; }

/* dataset landing */
.split { display: grid; grid-template-columns: 1fr 1.5fr; gap: 56px; align-items: start; }
.split .prose p { margin-top: 0; }
.board-cell .sub code { font-size: 12px; color: var(--brass-2); }
.fail-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.fail { display: flex; flex-direction: column; gap: 8px; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--hull); text-decoration: none; transition: border-color .25s ease, transform .25s ease; }
.fail:hover { border-color: rgba(212, 173, 102, .5); transform: translateY(-3px); }
.fail b { font-family: var(--display); font-weight: 500; font-size: 26px; line-height: 1.1; }
.fail .fq { font-size: 15px; color: var(--star); }
.fail .fa { font-size: 14px; color: var(--dim); }
.library-cta.lit { grid-template-columns: 1.3fr 1fr; }
.lit-stack { position: relative; height: 300px; }
.sheet { position: absolute; width: 190px; height: 268px; border-radius: 6px; overflow: hidden; background: #050a12 url(art/starfield.webp) center / cover; box-shadow: 0 24px 50px rgba(0, 0, 0, .5); border: 1px solid rgba(255, 255, 255, .08); }
.sheet::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 52%; background: repeating-linear-gradient(180deg, #f7f3ea 0 10px, #d9d2c3 10px 11px, #f7f3ea 11px 16px); border-top: 4px solid var(--brass); }
.sheet img { position: absolute; left: 0; width: 100%; height: 30%; top: 18%; object-fit: cover; }
.sheet img.o { width: 70px; height: auto; left: auto; right: 12px; top: 10px; }
.sheet.s1 { left: 0; top: 30px; transform: rotate(-8deg); }
.sheet.s2 { left: 90px; top: 10px; transform: rotate(-1deg); z-index: 2; }
.sheet.s3 { left: 180px; top: 34px; transform: rotate(7deg); z-index: 1; }
.get-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.get { border: 1px solid var(--line); border-radius: 16px; padding: 28px; background: var(--hull); display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.get .step { font-family: var(--display); font-size: 40px; line-height: 1; color: var(--brass); }
.get h3 { font-family: var(--display); font-weight: 500; font-size: 28px; margin: 4px 0 0; }
.get p { color: var(--dim); font-size: 14.5px; margin: 6px 0 14px; }
.get p code, .callout code { background: var(--panel-2); padding: 1px 6px; border-radius: 4px; font-size: 12.5px; }
.get pre { margin: 0; width: 100%; overflow-x: auto; background: #03060b; border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; font-size: 12.5px; line-height: 1.6; color: #d9e2ec; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .main-nav a.anchor { display: none; }
  .fail-grid, .get-grid { grid-template-columns: 1fr 1fr; }
  .dest-grid, .itins { grid-template-columns: 1fr 1fr; }
  .shelf { grid-template-columns: repeat(3, 1fr); }
  .main-nav { gap: 20px; }
}
@media (max-width: 640px) {
  .main-nav a:not(.btn) { display: none; }
  .site-header .wrap { gap: 12px; }
  .logo svg { width: 28px; height: 28px; }
  .logo .word { font-size: 20px; }
  .logo .word small { letter-spacing: .28em; }
  .main-nav .btn { padding: 9px 14px; font-size: 11px; letter-spacing: .08em; }
}
@media (max-width: 960px) {
  .dest-grid, .itins, .cabins { grid-template-columns: 1fr; }
  .cabin { border-right: 0; border-bottom: 1px solid var(--line); }
  .board-inner { grid-template-columns: 1fr 1fr; }
  .board-cell:nth-child(2) { border-right: 0; }
  .board-cell:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .exp-row, .exp-row.flip { grid-template-columns: 1fr; }
  .exp-row.flip .exp-art { order: 0; }
  .exp-body { padding: 28px; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .stat-row { grid-template-columns: 1fr 1fr; }
  .shelf { grid-template-columns: 1fr 1fr; }
  .trap-body { padding: 10px 20px 24px; }
  .trap-head { padding: 24px 20px 6px; grid-template-columns: 44px 1fr; }
  .trap-num { font-size: 40px; }
  .library-cta, .library-cta.lit, .pdf-rules, .split { grid-template-columns: 1fr; padding: 28px; }
  .split { padding: 0; gap: 20px; }
  .lit-stack { display: none; }
  .hero { min-height: 620px; }
  .hero .planet { right: -40%; width: 110vw; opacity: .45; }
}
@media (max-width: 560px) {
  .shelf, .qa, .fail-grid, .get-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  section { padding: 72px 0; }
  .family-table td:first-child { white-space: normal; }
  .table-scroll { overflow-x: auto; }
}

/* brochure links */
.brochure .coverlink { display: block; text-decoration: none; }
.brochure .meta .t a { color: inherit; text-decoration: none; }
.brochure .meta .t a:hover { color: var(--brass-2); }