/* =========================================================================
   scottish-invention.css
   Page-specific styles for the Register of Scottish Invention.
   Built entirely on the site's design tokens (Dunbar Tall + CMY), so it
   stays in keeping with the rest of arwatch.co. Loaded only on that page.
   ========================================================================= */

/* ---- intro ---- */
.reg-intro h1 { max-width: 16ch; }
.reg-accent { color: var(--magenta); }
.reg-standfirst {
  max-width: 64ch;
  margin: 1.4em 0 0;
  font-size: clamp(1.1rem, 1rem + .55vw, 1.35rem);
  line-height: 1.55;
  color: var(--ink-soft);
}
.reg-standfirst strong { font-weight: var(--w-medium); color: var(--ink); }

/* ---- legend ---- */
.reg-legend {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1px;
  margin: 0;
  background: var(--line);
  border: 1px solid var(--line);
}
.reg-legend div { background: var(--paper); padding: 1.2rem 1.35rem; }
.reg-legend dt {
  font-family: var(--display); font-weight: var(--w-medium);
  font-size: .78rem; letter-spacing: .14em; text-transform: uppercase;
  color: var(--magenta); margin: 0 0 .45rem;
}
.reg-legend dd { margin: 0; font-size: .95rem; line-height: 1.45; color: var(--muted); }

/* ---- categories ---- */
.cat { margin-top: clamp(3rem, 6vw, 5rem); }
.cat:first-child { margin-top: 0; }
.cat-head { max-width: 62ch; margin: 0 0 clamp(1.5rem, 3vw, 2.25rem); }
.cat-index {
  font-family: var(--display); font-weight: var(--w-medium);
  font-size: .82rem; letter-spacing: .18em; text-transform: uppercase;
  color: var(--muted); display: flex; align-items: center; gap: .8rem; margin: 0 0 .7rem;
}
.cat-index::before {
  content: ""; width: 30px; height: 3px; border-radius: 2px; background: var(--cmy);
}
.cat-name { font-size: clamp(1.8rem, 1.2rem + 2.6vw, 3rem); margin: 0; }
.cat-def { max-width: 62ch; margin: .7em 0 0; color: var(--muted); }

/* ---- entries ---- */
.entries { list-style: none; margin: clamp(1.5rem, 3vw, 2.25rem) 0 0; padding: 0; }
.entry {
  display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 0 1.4rem;
  padding: 1.35rem 0; border-top: 1px solid var(--line);
}
.entry:last-child { border-bottom: 1px solid var(--line); }
.entry-no {
  font-family: var(--display); font-weight: var(--w-medium);
  font-size: .9rem; color: var(--muted); padding-top: .35rem;
  font-variant-numeric: tabular-nums;
}
.entry-body { max-width: 62ch; }
.entry-thing {
  font-family: var(--display); font-weight: var(--w-regular);
  letter-spacing: -.01em; font-size: clamp(1.15rem, 1rem + .6vw, 1.4rem);
  line-height: 1.15; margin: 0; color: var(--ink);
}
.entry-meta {
  font-family: var(--display); font-weight: var(--w-medium);
  font-size: .82rem; letter-spacing: .03em; color: var(--ink-soft);
  margin: .45rem 0 0;
}
.entry-note { margin: .45rem 0 0; color: var(--ink-soft); line-height: 1.55; }
.entry-note b { color: var(--ink); font-weight: var(--w-medium); }

/* ---- colophon ---- */
.reg-colophon { max-width: 62ch; }
.reg-colophon .strap {
  font-family: var(--display); font-weight: var(--w-regular);
  color: var(--ink); letter-spacing: -.01em;
  font-size: clamp(1.3rem, 1rem + 1.5vw, 1.9rem); margin: 1em 0 0;
}

@media (max-width: 560px) {
  .entry { grid-template-columns: 42px minmax(0, 1fr); gap: 0 1rem; }
}