/*! Copyright (c) 2026 DM Vans. All rights reserved. Proprietary - not for reuse. */
/* DM Van Inventory - listing and detail pages.
 * Mobile-first (most visitors are on phones). Fonts and colour variables
 * come from the theme: Tenso, Switzer and PP Fraktion Mono, and
 * --contrast / --contrast-2 / --accent / --accent-2 / --base / --base-2.
 * Every value below falls back to the DM Vans palette when a variable is
 * missing, so the pages still render correctly on their own.
 * Every class is prefixed dmvi-.
 */

.dmvi-wrap {
    --dmvi-contrast: var(--contrast, #1b3235);
    --dmvi-contrast-2: var(--contrast-2, #120e0c);
    --dmvi-accent: var(--accent, #699390);
    --dmvi-accent-2: var(--accent-2, #d7c6a3);
    --dmvi-base: var(--base, #efeee8);
    --dmvi-base-2: var(--base-2, #fcf9f4);
    --dmvi-radius: 15px;

    box-sizing: border-box;
    flex: 1 1 100%;
    width: 100%;
    max-width: 1200px;
    min-width: 0;
    margin: 0 auto;
    padding: 24px 16px 56px;
    background: var(--dmvi-base);
    color: var(--dmvi-contrast);
    font-family: "PP Fraktion Mono", monospace;
    line-height: 1.5;
    overflow-wrap: break-word;
}

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

.dmvi-wrap [hidden] {
    display: none !important;
}

.dmvi-wrap img {
    display: block;
    max-width: 100%;
    height: auto;
}

.dmvi-wrap p,
.dmvi-wrap ul {
    margin: 0;
    padding: 0;
}

.dmvi-wrap ul {
    list-style: none;
}

.dmvi-wrap a {
    color: inherit;
}

/* ---------------- Listing head + filter ---------------- */

.dmvi-head {
    margin-bottom: 28px;
}

.dmvi-head__title {
    margin: 0 0 6px;
    font-family: Tenso, sans-serif;
    font-weight: 900;
    font-size: 1.75rem;
    line-height: 1.2;
    text-transform: uppercase;
}

.dmvi-head__intro {
    color: var(--dmvi-contrast);
    max-width: 60ch;
}

.dmvi-filter {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px;
}

.dmvi-wrap .dmvi-filter__btn {
    min-height: 44px;
    padding: 10px 22px;
    border: 1px dashed var(--dmvi-contrast);
    border-radius: 9999px;
    background: transparent;
    color: var(--dmvi-contrast);
    font-family: "PP Fraktion Mono", monospace;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase;
    cursor: pointer;
}

.dmvi-wrap .dmvi-filter__btn.is-active {
    border-style: solid;
    background: var(--dmvi-contrast);
    color: var(--dmvi-base-2);
}

/* Inside the dark opening band the pills read light-on-dark, as designed. */
.dmvi-hero .dmvi-filter__btn {
    border-color: var(--dmvi-base-2);
    color: var(--dmvi-base-2);
}

.dmvi-hero .dmvi-filter__btn.is-active {
    border-color: var(--dmvi-base-2);
    background: var(--dmvi-base-2);
    color: var(--dmvi-contrast-2);
}

/* ---------------- How reserving works (Ross, 2026-09-27) ---------------- */

.dmvi-how {
    margin-bottom: 36px;
    padding-top: 28px;
    border-top: 1px dashed var(--dmvi-contrast);
}

.dmvi-wrap .dmvi-how__title {
    margin: 0 0 20px;
    font-family: Tenso, sans-serif;
    font-weight: 900;
    font-size: 26px;
    line-height: 1.3;
    text-transform: uppercase;
}

.dmvi-how__steps {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.dmvi-how__step {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.dmvi-how__num {
    flex: 0 0 auto;
    font-family: Switzer, sans-serif;
    font-weight: 800;
    font-size: 36px;
    line-height: 1;
    color: var(--dmvi-accent);
}

.dmvi-how__text {
    padding-top: 6px;
    font-family: "PP Fraktion Mono", monospace;
    font-size: 15px;
}

.dmvi-how__note {
    margin-top: 20px;
    font-size: 13px;
}

/* ---------------- Month sections ---------------- */

.dmvi-sections {
    display: flex;
    flex-direction: column;
    gap: 44px;
}

.dmvi-month {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.dmvi-month__head {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 16px;
    padding-bottom: 10px;
    border-bottom: 1px dashed var(--dmvi-contrast);
}

.dmvi-wrap .dmvi-month__title {
    margin: 0;
    font-family: Switzer, sans-serif;
    font-weight: 700;
    font-size: 24px;
    line-height: 1.25;
    letter-spacing: normal;
    text-transform: none;
}

.dmvi-month__note {
    font-family: "PP Fraktion Mono", monospace;
    font-size: 13px;
}

/* ---------------- Card grid ---------------- */

.dmvi-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
}

/* ---------------- Card ---------------- */

.dmvi-wrap .dmvi-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border-radius: var(--dmvi-radius);
    overflow: hidden;
    background: var(--dmvi-contrast);
    color: var(--dmvi-base-2);
    text-decoration: none;
    transition: box-shadow 0.15s ease, transform 0.15s ease;
}

/* Same specificity as .dmvi-wrap .dmvi-card, so the size colour wins. */
.dmvi-wrap .dmvi-card--lv3 { background: var(--dmvi-contrast); color: var(--dmvi-base-2); }
.dmvi-wrap .dmvi-card--lv5 { background: var(--dmvi-accent); color: var(--dmvi-base-2); }
.dmvi-wrap .dmvi-card--lv7 { background: var(--dmvi-accent-2); color: var(--dmvi-contrast); }

.dmvi-card:hover,
.dmvi-card:focus-visible {
    box-shadow: 0 6px 20px rgba(11, 12, 14, 0.18);
    transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
    .dmvi-card,
    .dmvi-card:hover {
        transition: none;
        transform: none;
    }
}

.dmvi-card__media {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 240px;
    background: var(--dmvi-base-2);
}

.dmvi-card--detail .dmvi-card__media {
    height: 220px;
}

.dmvi-wrap .dmvi-card__img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.dmvi-card__body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 24px 24px 28px;
    text-align: center;
}

.dmvi-card--detail .dmvi-card__body {
    padding: 22px 18px 24px;
}

.dmvi-card__size,
.dmvi-card__heading-model {
    font-family: Switzer, sans-serif;
    font-weight: 700;
    font-size: 21.6px;
    line-height: 1.25;
}

.dmvi-card__color,
.dmvi-card__heading-color {
    font-family: Switzer, sans-serif;
    font-weight: 500;
    font-size: 21.6px;
    line-height: 1.25;
}

.dmvi-card__heading {
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

/* The theme colours every h1 with --contrast, the LV3 card's own background (Ross, 2026-10-02:
   "LV3 Backcountry Granite" unreadable). The heading takes its card's text colour instead. */
.dmvi-wrap .dmvi-card__heading { color: inherit; }

/* Campaign name + photo count under the colour line (Ross, 2026-09-27). */
.dmvi-card__name {
    font-family: Switzer, sans-serif;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.3;
}

.dmvi-card__photos {
    font-family: "PP Fraktion Mono", monospace;
    font-size: 12px;
}

.dmvi-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 16px;
    color: var(--dmvi-contrast);
    font-size: 0.9375rem;
    text-align: center;
}

/* ---------------- Price, monthly, status ---------------- */

.dmvi-price {
    display: block;
    margin-top: 6px;
    font-size: 20px;
}

.dmvi-price__label,
.dmvi-price__amount {
    font-weight: inherit;
}

.dmvi-monthly {
    display: block;
    font-size: 13px;
}

.dmvi-status {
    display: block;
    margin-top: 4px;
    font-size: 13px;
}

.dmvi-pickup--talk {
    display: block;
    margin-top: 10px;
    font-size: 13px;
}

/* ---------------- Pills (pickup + badges) ---------------- */

.dmvi-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 14px;
}

.dmvi-pill {
    display: inline-block;
    padding: 5px 12px;
    border-radius: 9999px;
    font-family: "PP Fraktion Mono", monospace;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    text-transform: uppercase;
    white-space: nowrap;
}

.dmvi-pill--outline {
    border: 1px solid currentColor;
    color: inherit;
    background: transparent;
}

.dmvi-pill--filled {
    background: var(--dmvi-contrast-2);
    color: var(--dmvi-base-2);
}

/* A van with a sale pending: same card, its own colour so it reads at a glance (Ross, 2026-10-02). */
.dmvi-pill--pending {
    background: var(--dmvi-accent);
    color: var(--dmvi-base-2);
}

/* ---------------- Notice, empty state, fine print ---------------- */

.dmvi-notice {
    padding: 20px 24px;
    border: 1px dashed var(--dmvi-contrast);
    border-radius: var(--dmvi-radius);
}

.dmvi-notice__text {
    font-weight: 700;
}

.dmvi-notice__next {
    margin-top: 6px;
}

.dmvi-notice__next a {
    text-decoration: underline;
}

.dmvi-empty {
    padding: 32px 16px;
    border: 1px dashed var(--dmvi-contrast);
    border-radius: var(--dmvi-radius);
    text-align: center;
}

.dmvi-wrap .dmvi-empty__title {
    margin-bottom: 6px;
    font-family: Tenso, sans-serif;
    font-weight: 900;
    font-size: 1.25rem;
    text-transform: uppercase;
}

.dmvi-empty .dmvi-btn {
    margin-top: 16px;
}

.dmvi-wrap .dmvi-fineprint {
    margin-top: 44px;
    padding: 32px 0 36px;
    border-top: 1px dashed var(--dmvi-contrast);
    font-size: 12px;
    line-height: 1.6;
}

/* ---------------- Recently sold ---------------- */

.dmvi-sold {
    margin-top: 44px;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    border: 1px dashed var(--dmvi-contrast);
    border-radius: var(--dmvi-radius);
}

.dmvi-wrap .dmvi-sold__title {
    margin: 0;
    font-family: Tenso, sans-serif;
    font-weight: 900;
    font-size: 32px;
    line-height: 1.2;
    text-transform: uppercase;
}

.dmvi-sold__list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 40px;
    row-gap: 12px;
    font-size: 15px;
}

.dmvi-sold__row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.dmvi-dot {
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
    border-radius: 9999px;
    /* A faint ring so a White van's dot shows on the cream page. */
    box-shadow: inset 0 0 0 1px rgba(27, 50, 53, 0.28);
}

/* ---------------- Buttons ---------------- */

.dmvi-wrap .dmvi-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    padding: 15px 20px;
    border: 1px dashed var(--dmvi-contrast);
    border-radius: 9999px;
    background: transparent;
    color: var(--dmvi-contrast);
    font-family: "PP Fraktion Mono", monospace;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: uppercase;
    text-decoration: none;
}

.dmvi-wrap .dmvi-btn--primary {
    border-color: var(--dmvi-base-2);
    background: var(--dmvi-contrast);
    color: var(--dmvi-base-2);
}

.dmvi-wrap a:focus-visible,
.dmvi-wrap button:focus-visible,
.dmvi-wrap summary:focus-visible {
    outline: 2px solid var(--dmvi-accent);
    outline-offset: 2px;
}

/* ---------------- Detail ---------------- */

.dmvi-back {
    margin-bottom: 0;
    font-family: "PP Fraktion Mono", monospace;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.dmvi-back a {
    color: var(--dmvi-accent-2);
}

.dmvi-back a::before {
    content: "\2190\00a0";
}

.dmvi-detail__top {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
}

.dmvi-detail__card-col,
.dmvi-detail__side {
    display: flex;
    flex-direction: column;
    gap: 20px;
    min-width: 0;
}

/* Van page gallery (Ross, 2026-09-27): a swipeable photo track (scroll
   snap, works without JS), arrows + counter and a thumbnail row from the
   script, and a full-screen viewer. Square on phones, 4:3 on desktop, so
   portrait slides and wide renders both show large. */
.dmvi-card--detail .dmvi-card__media--gallery {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    height: auto;
    background: #fff;
}

.dmvi-gallery { position: relative; }

.dmvi-wrap .dmvi-gallery__track {
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    aspect-ratio: 1 / 1;
    outline-offset: -3px;
    position: relative;
}
.dmvi-gallery__track::-webkit-scrollbar { display: none; }

.dmvi-gallery__slide {
    flex: 0 0 100%;
    scroll-snap-align: start;
    scroll-snap-stop: always;
    display: flex;
}
.dmvi-gallery__slide a { display: flex; width: 100%; cursor: zoom-in; }
.dmvi-gallery__slide img { width: 100%; height: 100%; object-fit: contain; }

.dmvi-wrap .dmvi-gallery__count {
    position: absolute;
    right: 12px;
    bottom: 12px;
    margin: 0;
    padding: 4px 10px;
    border-radius: 9999px;
    background: rgba(18, 14, 12, 0.72);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    pointer-events: none;
}

.dmvi-wrap .dmvi-gallery__nav,
.dmvi-wrap .dmvi-lightbox__nav,
.dmvi-wrap .dmvi-lightbox__close,
.dmvi-lightbox__nav,
.dmvi-lightbox__close {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 9999px;
    background: rgba(252, 249, 244, 0.92);
    color: #120e0c;
    box-shadow: 0 2px 8px rgba(18, 14, 12, 0.2);
    cursor: pointer;
}
.dmvi-wrap .dmvi-gallery__nav { top: 50%; transform: translateY(-50%); }
.dmvi-wrap .dmvi-gallery__nav--prev { left: 10px; }
.dmvi-wrap .dmvi-gallery__nav--next { right: 10px; }
.dmvi-wrap .dmvi-gallery__nav:disabled,
.dmvi-lightbox__nav:disabled { opacity: 0; pointer-events: none; }

.dmvi-gallery__thumbs {
    display: flex;
    gap: 10px;
    padding: 14px 16px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scroll-padding-inline: 16px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.dmvi-gallery__thumbs::-webkit-scrollbar { display: none; }
/* Browsers drop a scroller's end padding; this keeps 16px after the last thumb. */
.dmvi-gallery__thumbs::after { content: ""; flex: 0 0 6px; }

.dmvi-wrap .dmvi-gallery__thumb {
    flex: 0 0 auto;
    width: 76px;
    height: 76px;
    padding: 0;
    border: none;
    border-radius: 8px;
    overflow: hidden;
    background: var(--dmvi-base-2);
    cursor: pointer;
    opacity: 0.6;
    scroll-snap-align: start;
    transition: opacity 0.15s ease;
}
.dmvi-wrap .dmvi-gallery__thumb:hover { opacity: 0.85; }

.dmvi-gallery__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dmvi-wrap .dmvi-gallery__thumb[aria-current="true"] {
    opacity: 1;
    outline: 2px solid var(--dmvi-contrast);
    outline-offset: -2px;
}

@media (min-width: 960px) {
    .dmvi-wrap .dmvi-gallery__track { aspect-ratio: 4 / 3; }
}

/* Full-screen viewer (appended to <body>, outside .dmvi-wrap). */
.dmvi-lightbox {
    width: 100vw;
    height: 100vh;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgba(18, 14, 12, 0.95);
}
.dmvi-lightbox::backdrop { background: rgba(18, 14, 12, 0.95); }
.dmvi-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.dmvi-lightbox__img {
    max-width: calc(100vw - 32px);
    max-height: calc(100vh - 110px);
    object-fit: contain;
    touch-action: pan-y;
    user-select: none;
}
.dmvi-lightbox__close { top: 16px; right: 16px; }
.dmvi-lightbox__nav { top: 50%; transform: translateY(-50%); }
.dmvi-lightbox__nav--prev { left: 16px; }
.dmvi-lightbox__nav--next { right: 16px; }
.dmvi-lightbox__count {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    margin: 0;
    text-align: center;
    color: #fcf9f4;
    font-family: "PP Fraktion Mono", monospace;
    font-size: 14px;
}

.dmvi-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.dmvi-also__pills {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.dmvi-also__pill {
    display: inline-block;
    padding: 7px 14px;
    border: 1px dashed var(--dmvi-contrast);
    border-radius: 9999px;
    font-size: 13px;
    font-weight: 700;
}

/* A month whose van is held: solid, in the pending colour, so it stands out from the open months. */
.dmvi-also__pill--pending {
    border: 1px solid var(--dmvi-accent);
    background: var(--dmvi-accent);
    color: var(--dmvi-base-2);
}

.dmvi-timing__note {
    margin-top: 12px;
    font-size: 12px;
}

.dmvi-model-photo {
    position: relative;
    display: block;
    height: 220px;
    border-radius: var(--dmvi-radius);
    overflow: hidden;
    background-color: var(--dmvi-base-2);
    background-position: center;
    background-size: cover;
    text-decoration: none;
}

.dmvi-model-photo__pill {
    position: absolute;
    left: 14px;
    bottom: 14px;
    padding: 10px 16px;
    border-radius: 9999px;
    font-family: "PP Fraktion Mono", monospace;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
}

.dmvi-wrap .dmvi-section__title {
    margin: 0 0 12px;
    font-family: Tenso, sans-serif;
    font-weight: 900;
    font-size: 26px;
    line-height: 1.3;
    text-transform: uppercase;
}

.dmvi-specs {
    max-width: 75ch;
}

.dmvi-wrap .dmvi-specs p,
.dmvi-wrap .dmvi-specs ul,
.dmvi-wrap .dmvi-specs ol {
    margin: 0 0 12px;
}

.dmvi-wrap .dmvi-specs ul,
.dmvi-wrap .dmvi-specs ol {
    padding-left: 20px;
    list-style: revert;
}

.dmvi-specs table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
}

.dmvi-pdf {
    margin-top: 12px;
}

.dmvi-section {
    margin-top: 44px;
    padding-top: 28px;
    border-top: 1px dashed var(--dmvi-contrast);
}

.dmvi-features {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px 24px;
}

.dmvi-features li {
    position: relative;
    padding-left: 22px;
}

.dmvi-features li::before {
    content: "";
    position: absolute;
    top: 0.55em;
    left: 2px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--dmvi-accent);
}

/* ---------------- Wider screens ---------------- */

@media (min-width: 600px) {
    .dmvi-wrap {
        padding: 32px 24px 64px;
    }

    .dmvi-grid,
    .dmvi-features {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dmvi-wrap .dmvi-btn {
        width: auto;
    }

    .dmvi-actions {
        flex-direction: row;
        flex-wrap: wrap;
    }
}

/* Recently Sold: two columns at 768px+, one below it, as specified. */
@media (min-width: 768px) {
    .dmvi-sold__list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 960px) {
    .dmvi-head__title {
        font-size: 2.25rem;
    }

    .dmvi-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 32px;
    }

    .dmvi-features {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dmvi-detail__top {
        grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
        gap: 32px;
        align-items: start;
    }

    .dmvi-detail__side {
        position: sticky;
        top: 24px;
    }

    .dmvi-how__steps {
        flex-direction: row;
        gap: 32px;
    }

    .dmvi-how__step {
        flex: 1 1 0;
    }
}

/* ---------------- Dark opening band (Ross, 2026-09-26) ----------------
   The site header is transparent with a white logo and sits over the top of
   every page; the theme's pages open on a dark band so it shows. On the
   plugin's own URLs (not inside the shortcode) the listing heading and the
   detail page's back link sit on the same kind of band, full width. */
body.dmvi-page { overflow-x: clip; background: var(--base, #efeee8); }
/* The plugin's own URLs render a <main>; the band starts at the very top there. */
body.dmvi-page main.dmvi-wrap { padding-top: 0; }
.dmvi-hero {
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 150px max(20px, calc(50vw - 560px)) 56px;
    background: var(--contrast-2, #120e0c);
    color: var(--base-2, #fcf9f4);
    text-align: center;
}
.dmvi-hero .dmvi-head__title { color: var(--base-2, #fcf9f4); font-size: 48px; }
.dmvi-hero .dmvi-head__intro { color: var(--accent-2, #d7c6a3); margin-left: auto; margin-right: auto; }
.dmvi-hero .dmvi-filter { justify-content: center; }
.dmvi-hero--slim { padding-top: 112px; padding-bottom: 18px; text-align: left; margin-bottom: 24px; }
.dmvi-hero--slim .dmvi-back { margin: 0; }
.dmvi-listing .dmvi-hero { margin-bottom: 32px; }
@media (max-width: 768px) {
    .dmvi-hero { padding-top: 116px; padding-bottom: 40px; }
    .dmvi-hero--slim { padding-top: 96px; padding-bottom: 14px; }
}

/* The theme sets headings in capitals; the van page title and the month
   headers are sentence case in the design. */
.dmvi-wrap .dmvi-card__heading,
.dmvi-wrap .dmvi-card__heading * { text-transform: none; letter-spacing: normal; }
.dmvi-wrap .dmvi-timing__note { margin-top: 10px; }
/* The van renders are shot on white: a white photo area lets them blend. */
.dmvi-wrap .dmvi-card__media { background: #fff; }

/* Additional information: the old listings' facts table (Ross, 2026-09-27). */
.dmvi-wrap .dmvi-info { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 40px; }
.dmvi-info__row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px dashed var(--dmvi-contrast); font-size: 15px; }
.dmvi-wrap .dmvi-info dt { margin: 0; font-weight: 700; }
.dmvi-wrap .dmvi-info dd { margin: 0; text-align: right; }
@media (min-width: 768px) { .dmvi-wrap .dmvi-info { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.dmvi-wrap .dmvi-fineprint p { margin: 0 0 10px; }
.dmvi-wrap .dmvi-fineprint p:last-child { margin-bottom: 0; }

/* Van page Pickup section: the soonest date, then other months or a note. */
.dmvi-wrap .dmvi-also__lead { margin: 0 0 12px; font-family: Switzer, sans-serif; font-weight: 700; font-size: 20px; }
.dmvi-wrap .dmvi-also__label { margin: 0 0 8px; font-size: 13px; font-weight: 700; text-transform: uppercase; }
.dmvi-wrap .dmvi-also__none { margin: 0; font-size: 15px; line-height: 1.5; }

/* ---------------- Promo callout (Ross, 2026-09-29: El Niño extension) ---------------- */

.dmvi-promo {
    margin-bottom: 36px;
    padding: 24px;
    border-radius: var(--dmvi-radius);
    background: var(--dmvi-contrast);
    color: var(--dmvi-base-2);
}

.dmvi-promo--side {
    margin: 20px 0;
}

.dmvi-wrap .dmvi-promo__title {
    margin: 0 0 10px;
    font-family: Tenso, sans-serif;
    font-weight: 900;
    font-size: 22px;
    line-height: 1.3;
    text-transform: uppercase;
    color: var(--dmvi-base-2);
}

.dmvi-wrap .dmvi-promo__text {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
}

.dmvi-promo__links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 18px;
}

.dmvi-wrap .dmvi-promo .dmvi-btn {
    border-color: var(--dmvi-base-2);
    background: transparent;
    color: var(--dmvi-base-2);
}

.dmvi-wrap .dmvi-promo .dmvi-btn--primary {
    border-color: var(--dmvi-accent);
    background: var(--dmvi-accent);
}

.dmvi-wrap .dmvi-promo__more {
    display: inline-block;
    margin-top: 14px;
    font-weight: 700;
    color: var(--dmvi-accent-2);
}

.dmvi-pill--promo {
    align-self: center;
    margin-top: 6px;
    background: var(--dmvi-accent-2);
    border: 0;
    color: var(--dmvi-contrast);
}

@media (min-width: 600px) {
    .dmvi-wrap .dmvi-promo__links .dmvi-btn {
        width: auto;
    }
}