/* Vehicle landing pages. Builds on parts.css. */
.vx-head .pp-for em { color: var(--rust); }
.vx-read h2 { margin-top: 26px; }
.vx-read h2:first-child { margin-top: 0; }
.vx-fit li { font-size: 17px; }
.vx-src { margin-left: 4px; padding: 0 5px; border: 1px solid var(--line); border-radius: 2px; font-family: var(--mono); font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase; color: var(--muted); text-decoration: none; white-space: nowrap; vertical-align: 2px; background: #fff; }
.vx-src:hover, .vx-src:focus-visible { color: var(--rust); border-color: var(--rust); }
.vx-spec { width: 100%; border-collapse: collapse; margin: 4px 0 6px; font-size: 14px; background: #fff; border: 1px solid var(--line); }
.vx-spec th, .vx-spec td { padding: 7px 10px; text-align: left; border-bottom: 1px dashed var(--line); vertical-align: top; }
.vx-spec thead th { font-family: var(--mono); font-size: 10.5px; letter-spacing: 1.4px; text-transform: uppercase; color: var(--muted); border-bottom: 2px solid var(--ink); }
.vx-spec tbody th { font-family: var(--display); font-weight: 700; white-space: nowrap; }
.vx-spec td em { font-family: var(--serif); color: var(--muted); }
.vx-years td { font-family: var(--serif); font-size: 15px; }
.vx-change { margin: 6px 0 0 4px; font-size: 19px; }
.vx-change::before { content: "↑ "; }
.vx-recalls { list-style: none; margin: 6px 0 0; padding: 0; counter-reset: rc; }
.vx-recalls li { position: relative; padding: 10px 0 10px 16px; border-left: 3px solid var(--orange); margin-bottom: 10px; background: linear-gradient(90deg, #fff, transparent); }
.vx-recalls p { margin: 4px 0; font-size: 16px !important; line-height: 1.5 !important; }
.vx-recall-id { font-size: 13px; font-weight: 600; margin-right: 6px; }
.vx-recall-years { margin-left: 10px; font-family: var(--serif); font-style: italic; color: var(--muted); }
.vx-recalls small { color: var(--muted); font-size: 11px; letter-spacing: .4px; }
.vx-none { font-style: italic; color: var(--muted); }
.vx-vin { margin: 26px 0 8px; padding: 14px 18px 12px; background: var(--card); border: 1px solid var(--line); border-top: 4px solid var(--plum); border-radius: 0 0 10px 10px; }
.vx-vin p { margin: 0 0 4px; font-size: 16.5px !important; }
.vx-vin-head { font-family: var(--display) !important; font-weight: 700; font-size: 19px !important; letter-spacing: -.2px; }
.vx-vin .px-margin { margin-top: 8px; }
.vx-guides, .vx-sources, .vx-excluded { font-family: var(--serif); font-size: 15px; color: var(--muted); }
.vx-guides { margin-top: 22px; }
.vx-guides a, .vx-sources a { color: var(--rust); }
.vx-sources { font-style: italic; border-top: 1px dashed var(--line); padding-top: 10px; }
.vx-partlist { list-style: none; margin: 0; padding: 0; columns: 2 220px; column-gap: 20px; }
.vx-partlist li { break-inside: avoid; border-bottom: 1px dashed var(--line); }
.vx-partlist a { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 9px 2px; color: var(--ink); text-decoration: none; }
.vx-partlist b { font-family: var(--display); font-size: 17px; }
.vx-partlist span { font-family: var(--serif); font-style: italic; font-size: 14px; color: var(--muted); }
.vx-partlist a:hover b, .vx-partlist a:focus-visible b { color: var(--rust); text-decoration: underline; }
.vx-notes { margin: 0; padding-left: 20px; font-family: var(--serif); font-size: 17px; line-height: 1.55; }
.vx-srclist { margin: 0 0 14px; padding-left: 18px; font-family: var(--serif); font-size: 15px; line-height: 1.6; }
.vx-srclist .vx-src { text-transform: none; letter-spacing: 0; font-size: 12px; white-space: normal; }
.vx-index { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 0 34px; }
.vx-index li { padding: 14px 0; border-bottom: 1px dashed var(--line); }
.vx-index > li > a { display: grid; grid-template-columns: 64px 1fr; column-gap: 10px; color: var(--ink); text-decoration: none; }
.vx-rank { grid-row: span 2; align-self: start; padding: 4px 0; text-align: center; background: #2a2420; color: var(--orange); border-radius: 3px; font-size: 12px; }
.vx-index b { font-family: var(--display); font-size: 22px; letter-spacing: -.3px; }
.vx-index em { font-family: var(--serif); color: var(--muted); }
.vx-index p { margin: 8px 0 0 74px; font-family: var(--serif); font-size: 14.5px; line-height: 1.6; }
.vx-index p a { color: var(--ink); text-decoration-color: #cfc5b6; text-underline-offset: 3px; }
.vx-index > li > a:hover b { color: var(--rust); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (max-width: 560px) {
  .vx-spec { font-size: 13px; }
  .vx-spec th, .vx-spec td { padding: 6px 7px; }
  .vx-index p { margin-left: 0; }
}
.vx-twin { margin: 0 0 18px; padding: 10px 14px; border-left: 4px solid var(--plum); background: var(--card); }