/* THE 2026-08-09 ARCHIVE RECORDS' OWN LAYOUT, AS PUBLISHED (governor ruling, 2026-09-21). Those forty records carried
   these rules as an inline <style> block, which the served style-src 'self' refuses, so they rendered unstyled. They
   now link this file instead, where the block sat. It carries EXACTLY August's rules -- not legal.css, whose later
   typography (h1, h2 and lead sizes, the related-navigation heading, the current-page marker) the August records never
   had and would misrepresent -- with two named exceptions: the narrow .legal-content and .legal-meta columns are
   minmax(0, 1fr), not 1fr, the repairs legal.css carries, because 1fr cannot shrink below the widest word and
   overflowed a phone at 200% zoom ("COUNSEL_APPROVAL_REQUIRED" in this set's metadata is 232px).
   tests/legal-archive-presentation.test.mjs quotes the August block and holds this file to it rule by rule. */

.legal-shell {
  width: min(calc(100% - var(--page-gutter, 2rem)), 74rem);
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 5rem) 0;
}

.legal-hero {
  max-width: 54rem;
}

.legal-status {
  border: 2px solid currentColor;
  border-radius: 1rem;
  padding: 1rem;
  margin: 1.5rem 0;
  background: color-mix(in srgb, var(--brand-soft, #eef2ff) 60%, transparent);
}

.legal-meta {
  display: grid;
  grid-template-columns: minmax(8rem, 12rem) 1fr;
  gap: 0.45rem 1rem;
  margin: 1.5rem 0 2.5rem;
}

.legal-meta dt {
  font-weight: 800;
}

.legal-meta dd {
  margin: 0;
}

.legal-content {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(15rem, 1fr);
  gap: clamp(2rem, 6vw, 5rem);
  align-items: start;
}

.legal-copy {
  max-width: 48rem;
}

.legal-copy section {
  margin-bottom: 2.5rem;
}

.legal-copy li,
.legal-copy p {
  line-height: 1.7;
}

.legal-nav {
  position: sticky;
  top: 6rem;
  border: 1px solid var(--line, #d7dce3);
  border-radius: 1rem;
  padding: 1rem;
}

.legal-nav ul {
  margin: 0.7rem 0 0;
  padding-left: 1.2rem;
}

.legal-nav a {
  display: inline-block;
  padding: 0.22rem 0;
}

.policy-directory {
  columns: 2;
  column-gap: 2rem;
}

.policy-directory li {
  break-inside: avoid;
  margin: 0.35rem 0;
}

@media (max-width: 48rem) {
  /* The two values that are not August's: minmax(0, 1fr) in place of 1fr, here and in .legal-meta (see the header). */
  .legal-content {
    grid-template-columns: minmax(0, 1fr);
  }

  .legal-nav {
    position: static;
  }

  .legal-meta {
    grid-template-columns: minmax(0, 1fr);
  }

  .legal-meta dd {
    margin-bottom: 0.65rem;
  }

  .policy-directory {
    columns: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  * {
    scroll-behavior: auto !important;
  }
}