/* Evidence band: two photographs shown as plates, used on the service pages where the
   argument is otherwise carried entirely by prose. CLAUDE.md counts a section with no
   images and no reason for having none as a defect, not restraint. */

.plates { padding-block: var(--section-gap-tight); }

.plates__inner {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad);
}

.plates__title { max-width: var(--measure-h2); }

.plates__lead {
  margin-top: var(--space-md);
  max-width: var(--measure-lead);
  font-size: var(--text-lead);
  line-height: var(--lh-lead);
  color: var(--text-secondary);
}

.plates__grid {
  display: grid;
  gap: var(--grid-gap);
  margin-top: var(--space-2xl);
}

.plates__item {
  margin: 0;
  padding: var(--plate-mount);
  background: var(--surface-raised);
  border: var(--border-plate);
  box-shadow: var(--shadow-plate);
  transition: transform var(--dur-fast) var(--ease-exit),
              box-shadow var(--dur-fast) var(--ease-exit);
}

.plates__item:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-plate-lift);
  transition-duration: var(--dur-base);
  transition-timing-function: var(--ease-slide);
}

/* The icon sits in the index column beside the number, on the same 24px grid and in
   the same accent as every other mark on the page. */
.records__icon {
  margin-top: var(--space-xs);
  color: var(--accent);
}

@media (min-width: 900px) {
  .plates__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* The second plate drops half a step, so the pair reads as two prints laid down
     rather than as a two-column figure. */
  .plates__item:nth-child(2) { transform: translateY(var(--space-2xl)); }
  .plates__item:nth-child(2):hover { transform: translateY(calc(var(--space-2xl) - 2px)); }
  .plates__grid { margin-bottom: var(--space-2xl); }
}


/* Every photograph on this site is a labelled plate; the evidence band was the one
   place that shipped bare images. */
.plates__item { position: relative; }

.plates__cap {
  position: absolute;
  left: var(--plate-mount);
  bottom: calc(-1 * var(--space-sm));
}
