/* DRVCAM promo card used inside blog posts and one service page. Follows the Clean Trust theme tokens (light and dark). */
.drvc { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 28px; align-items: center; margin: 36px 0; padding: 26px 28px; border-radius: 18px; background: var(--dr-panel); border: 1px solid var(--tr-card-border); box-shadow: var(--tr-sh-1, none); }
.drvc * { box-sizing: border-box; }
.drvc a { text-decoration: none !important; border-bottom: 0 !important; }
.drvc-shot { display: block; align-self: stretch; min-height: 300px; position: relative; border-radius: 18px; overflow: hidden; border: 1px solid var(--tr-card-border); }
.drvc-shot img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.drvc-title { margin: 0 0 6px; font-size: 1.35rem; line-height: 1.25; font-weight: 800; color: var(--tr-head, inherit); }
.drvc-lead { margin: 0; font-size: .95rem; line-height: 1.55; opacity: .88; }
.drvc-uses { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 16px 0 0; padding: 0; list-style: none; }
.drvc-uses li { margin: 0; padding: 10px 12px; border-radius: 10px; background: color-mix(in srgb, var(--dr-accent) 9%, transparent); font-size: .84rem; line-height: 1.35; }
.drvc-uses b { display: block; margin-bottom: 2px; font-size: .88rem; color: var(--tr-head, inherit); }
.drvc-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 16px; }
.drvc a.drvc-btn { display: inline-flex; align-items: center; padding: 11px 18px; border-radius: 10px; background: var(--dr-accent); color: var(--dr-on-accent) !important; font-weight: 700; font-size: .92rem; box-shadow: var(--tr-sh-btn, none); transition: transform .15s, background .15s; }
.drvc a.drvc-btn:hover { background: var(--tr-accent-hover, var(--dr-accent)); transform: translateY(-1px); }
.drvc-note { font-size: .8rem; opacity: .7; }
@media (max-width: 700px) {
  .drvc { grid-template-columns: 1fr; padding: 22px 20px; gap: 20px; }
  .drvc-shot { min-height: 340px; max-width: 230px; margin: 0 auto; width: 100%; }
  .drvc-uses { grid-template-columns: 1fr; }
}

/* article typography resets: prose styles must not leak into the card */
.drvc .drvc-shot img { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; max-width: none !important; margin: 0 !important; border-radius: 0 !important; border: 0 !important; box-shadow: none !important; }
.drvc .drvc-title { margin: 0 0 6px !important; line-height: 1.25 !important; font-size: 1.3rem !important; }
.drvc .drvc-lead { margin: 0 !important; line-height: 1.5 !important; }
.drvc .drvc-uses { margin: 14px 0 0 !important; padding: 0 !important; list-style: none !important; }
.drvc .drvc-uses li { margin: 0 !important; padding: 10px 12px !important; line-height: 1.35 !important; }
.drvc .drvc-foot { margin-top: 14px !important; }
@media (max-width: 700px) {
  .drvc { gap: 16px; padding: 18px 16px; margin: 28px 0; }
  .drvc-shot { min-height: 250px; max-width: 150px; }
  .drvc .drvc-title { font-size: 1.15rem !important; }
  .drvc .drvc-uses { gap: 8px; }
  .drvc .drvc-uses li { padding: 8px 12px !important; }
}

@media (max-width: 700px) {
  .drvc .drvc-uses { display: flex !important; flex-wrap: wrap; gap: 8px; }
  .drvc .drvc-uses li { padding: 6px 12px !important; border-radius: 999px !important; }
  .drvc .drvc-uses li b { display: inline; margin: 0; }
  .drvc .drvc-uses li span { display: none; }
  .drvc-shot { min-height: 230px; max-width: 140px; }
}