/* ==========================================================================
 * Content sections: features, specs, trust, cross-sell, FAQ (M5–M9)
 * ========================================================================== */

/* ---------- features ---------- */
.vp-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.vp-feat {
  padding: 14px 13px; border-radius: var(--r);
  border: 1px solid var(--line); background: var(--card);
}
.vp-feat__ic { font-size: 21px; line-height: 1; margin-bottom: 9px; }
.vp-feat h3 { font-size: 13px; font-weight: 800; margin: 0 0 4px; }
.vp-feat p { margin: 0; font-size: 11.5px; color: var(--dim); line-height: 1.55; }

/* highlight the mileage claim */
.vp-mileage {
  grid-column: 1 / -1;
  padding: 15px 14px; border-radius: var(--r);
  border: 1px solid rgba(46, 242, 208, .34);
  background: linear-gradient(120deg, rgba(46, 242, 208, .12), rgba(46, 242, 208, .02));
}
.vp-mileage__big {
  font-size: 26px; font-weight: 900; letter-spacing: -.8px;
  line-height: 1.1; color: var(--cy);
}
.vp-mileage__big small {
  font-size: 13px; color: var(--txt-2); font-weight: 700;
  letter-spacing: 0;
}
.vp-mileage p { margin: 6px 0 0; font-size: 11.5px; color: var(--dim); line-height: 1.55; }

/* ---------- specs ---------- */
.vp-specs {
  border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; background: var(--card);
}
.vp-spec {
  display: flex; justify-content: space-between; gap: 12px;
  padding: 11px 13px; font-size: 12.5px;
  border-bottom: 1px solid var(--line-soft);
}
.vp-spec:last-child { border-bottom: 0; }
.vp-spec__k { color: var(--dim); flex: 0 0 auto; }
.vp-spec__v { font-weight: 800; text-align: right; }

/* ---------- trust ---------- */
.vp-trusts { display: grid; gap: 9px; }
.vp-trust {
  display: flex; gap: 11px; align-items: flex-start;
  padding: 12px 13px; border-radius: var(--r-sm);
  border: 1px solid var(--line); background: var(--card);
}
.vp-trust__ic {
  flex: 0 0 auto; width: 30px; height: 30px; border-radius: 9px;
  background: rgba(46, 242, 208, .1); color: var(--cy);
  display: flex; align-items: center; justify-content: center;
}
.vp-trust b { display: block; font-size: 12.5px; }
.vp-trust p { margin: 2px 0 0; font-size: 11.5px; color: var(--dim); }

/* ---------- cross-sell ---------- */
.vp-x {
  display: flex; gap: 12px; align-items: center;
  padding: 11px; margin-bottom: 9px;
  border: 1px solid var(--line); border-radius: var(--r);
  background: var(--card); text-decoration: none;
  transition: border-color .15s ease;
}
.vp-x:last-child { margin-bottom: 0; }
.vp-x:active { border-color: var(--cy); }
.vp-x__img {
  width: 58px; height: 58px; flex: 0 0 auto;
  border-radius: 10px; object-fit: cover;
}
.vp-x__t { flex: 1; min-width: 0; }
.vp-x__n { font-size: 12.5px; font-weight: 800; line-height: 1.3; }
.vp-x__s { font-size: 10.5px; color: var(--faint); margin-top: 3px; }
.vp-x__p { font-size: 11.5px; color: var(--dim); margin-top: 5px; }
.vp-x__p b { color: var(--cy); font-size: 13px; }
.vp-x__p s { color: var(--faint); margin-left: 5px; }
.vp-x__a {
  flex: 0 0 auto; font-size: 11px; font-weight: 900;
  background: var(--cy); color: #04211C;
  border-radius: 9px; padding: 8px 11px; white-space: nowrap;
}
.vp-x-note {
  font-size: 10.5px; color: var(--faint); margin-top: 11px; line-height: 1.6;
}

/* ---------- FAQ ---------- */
.vp-faq {
  border: 1px solid var(--line); border-radius: var(--r);
  overflow: hidden; background: var(--card);
}
.vp-fq { border-bottom: 1px solid var(--line-soft); }
.vp-fq:last-child { border-bottom: 0; }
.vp-fq__q {
  display: flex; justify-content: space-between; align-items: center;
  gap: 12px; width: 100%; text-align: left;
  padding: 14px 13px; border: 0; background: transparent;
  font-size: 13px; font-weight: 800;
}
.vp-fq__ic {
  flex: 0 0 auto; color: var(--cy); font-size: 17px; line-height: 1;
  transition: transform .2s ease;
}
.vp-fq.is-open .vp-fq__ic { transform: rotate(45deg); }
.vp-fq__a {
  display: none; padding: 0 13px 14px;
  font-size: 12px; color: var(--dim); line-height: 1.7;
}
.vp-fq.is-open .vp-fq__a { display: block; }

/* ---------- section divider ---------- */
.vp-sec__rule {
  height: 1px; background: var(--line-soft);
  margin: 0 var(--pad);
}
