/* Insight Metrics content kit v4: the extra rules the approved short article, long article and news brief pages
   load after kit.css (build_v4.py EXTRA, copied unchanged). */
.imk-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 6px 0 22px; }
.imk-compare > div { padding: 20px 22px; border-radius: var(--r2); background: var(--paper); border: 1px solid var(--rule); }
.imk-compare > div:first-child { background: var(--lav2); border-color: transparent; }
.imk-compare h3 { margin: 0 0 10px; font: 400 22px/1.2 var(--serif); color: var(--ink); }
.imk-compare ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; font-size: 15.5px; line-height: 1.5; }
.imk-compare li { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 8px; }
.imk-compare li::before { content: ""; width: 7px; height: 7px; margin-top: 9px; background: var(--cat); }
.imk-inline-cta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; margin: 30px 0; padding: 26px 28px; border-radius: var(--r); background: var(--lav); color: var(--ink); }
.imk-inline-cta small { display: inline-flex; align-items: center; gap: 10px; font: 500 11px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: var(--ink); }
.imk-inline-cta small::before { content: ""; width: 8px; height: 8px; background: var(--brand); }
.imk-inline-cta h3 { margin: 10px 0 6px; font: 400 26px/1.2 var(--serif); color: var(--ink); }
.imk-inline-cta p { margin: 0; font-size: 14.5px; line-height: 1.55; color: var(--ink2); }
.imk-or { display: grid; gap: 10px; }
.imk-or .row { display: grid; grid-template-columns: 150px minmax(0, 1fr) 52px; gap: 12px; align-items: center; font-size: 14.5px; color: var(--ink2); }
.imk-or .track { position: relative; height: 26px; border-radius: 6px; background: repeating-linear-gradient(90deg, var(--rule2) 0 1px, transparent 1px 16.666%); }
.imk-or .track::before { content: ""; position: absolute; left: 16.666%; top: -4px; bottom: -4px; width: 2px; background: var(--ink); }
.imk-or .track span { position: absolute; top: 4px; bottom: 4px; border-radius: 4px; background: var(--brand); }
.imk-or .track span.lo { background: #1F8A70; transform-origin: 100% 50%; } .imk-or .track span.hi { transform-origin: 0 50%; }
.imk-or .row > b { font: 600 13px/1 var(--mono); color: var(--ink); text-align: right; }
.imk-or .axis { display: grid; grid-template-columns: 150px minmax(0, 1fr) 52px; gap: 12px; }
.imk-or .axis span { position: relative; height: 16px; font: 500 10.5px/1 var(--mono); color: var(--muted); }
.imk-or .axis span b { position: absolute; top: 4px; transform: translateX(-50%); font-weight: 500; }
.imk-briefhead { margin-top: 24px; padding: 40px 44px 34px; border-radius: 32px; background: var(--paper); border: 1px solid var(--rule); display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 36px; align-items: start; }
.imk-briefhead .imj-h1 { font-size: clamp(32px, 3.6vw, 50px); }
.imk-briefhead .imn-specimen { margin: 0; box-shadow: none; }
@media (max-width: 980px) { .imk-briefhead { grid-template-columns: minmax(0, 1fr); padding: 30px 24px 26px; } }
@media (max-width: 640px) { .imk-compare, .imk-inline-cta { grid-template-columns: minmax(0, 1fr); } .imk-or .row, .imk-or .axis { grid-template-columns: 96px minmax(0, 1fr) 44px; gap: 8px; } .imk-briefhead { border-radius: 24px; } }