/* Contractor Standings — design tokens
   Direction 02, "Record." Warm paper, one serif, one accent.
   Shares nothing with Next Division Consulting by design. */

:root {
  /* ---- Color -------------------------------------------------------- */
  --paper:         #FBF8F2;   /* page background */
  --paper-raised:  #FFFFFF;   /* badge fills, claim-page cards */
  --ink:           #1C2620;   /* headings, business names        14.70:1 */
  --ink-secondary: #4A5A52;   /* body copy, scores, metadata      6.89:1 */
  --ink-muted:     #8A9490;   /* decorative captions only         2.95:1 */
  --accent:        #2F5A3D;   /* rank numerals, links, badge frame 7.47:1 */
  --accent-deep:   #1E3D28;   /* hover, badge text               11.30:1 */
  --rule:          #CFC7B6;   /* major dividers */
  --rule-light:    #EAE4D8;   /* row separators */

  /* --ink-muted is 2.95:1 on paper — below the 3:1 large-text floor and
     well below AA's 4.5:1 for body text. It is deliberately NOT used for
     scores, metadata, or the edition line; those carry information and use
     --ink-secondary. Reserve --ink-muted for text that is purely ornamental
     and whose loss costs the reader nothing. */

  /* ---- Type --------------------------------------------------------- */
  --font: "Newsreader", Georgia, "Times New Roman", serif;

  --size-masthead:  32px;
  --size-section:   20px;
  --size-body:      15px;   /* also business name and rank numeral */
  --size-score:     13px;
  --size-fine:      12px;   /* also edition line */

  --weight-regular: 400;
  --weight-medium:  500;

  --leading-body:   1.65;
  --leading-tight:  1.3;
  --track-masthead: -0.3px;

  /* ---- Layout ------------------------------------------------------- */
  --measure:    720px;  /* a document, not an app */
  --gutter:     24px;
  --row-y:      18px;   /* vertical padding inside a standings row */
  --section-y:  56px;   /* space between major sections */
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink-secondary);
  font-family: var(--font);
  font-size: var(--size-body);
  line-height: var(--leading-body);
  font-variant-numeric: tabular-nums;   /* figures align without a second family */
  -webkit-font-smoothing: antialiased;
}

.wrap { max-width: var(--measure); margin: 0 auto; padding: 0 var(--gutter); }

h1, h2, h3 { color: var(--ink); font-weight: var(--weight-medium); margin: 0; }
h2 { font-size: var(--size-section); line-height: var(--leading-tight); }

a { color: var(--accent); text-decoration: none; border-bottom: 1px solid var(--rule); }
a:hover { color: var(--accent-deep); border-bottom-color: currentColor; }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

/* Hairline rules, never boxes. */
.rule       { border: 0; border-top: 1px solid var(--rule);       margin: 0; }
.rule-light { border: 0; border-top: 1px solid var(--rule-light); margin: 0; }

.fine { font-size: var(--size-fine); color: var(--ink-secondary); }
.caption { font-size: var(--size-fine); color: var(--ink-muted); font-style: italic; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}