/* Vehicle details — intentionally scoped so inventory and shared components are unaffected. */
.vehicle-detail-page {
    --vdp-ink: #111820;
    --vdp-muted: #65707c;
    --vdp-line: rgba(17, 24, 32, .12);
    --vdp-surface: var(--bs-body-bg, #fff);
    --vdp-soft: var(--bs-tertiary-bg, #f3f5f6);
    --vdp-theme-gradient: var(--gtx-grad, linear-gradient(180deg, #155a96, #1e73be));
    --vdp-accent: var(--gtx-accent-solid, #1e73be);
    --vdp-accent-soft: rgba(30, 115, 190, .18);
    --vdp-accent-soft: color-mix(in srgb, var(--vdp-accent) 18%, transparent);
    --vdp-accent-bright: #75bff4;
    --vdp-accent-bright: color-mix(in oklab, var(--vdp-accent) 72%, white);
    position: relative;
    width: min(1440px, calc(100% - 2rem));
    margin: 0 auto;
    padding: .5rem 0 3rem;
}

.vehicle-detail-page::before {
    position: fixed;
    inset: 0;
    z-index: -1;
    content: "";
    pointer-events: none;
    background:
        radial-gradient(circle at 12% 3%, var(--vdp-accent-soft), transparent 30rem),
        radial-gradient(circle at 88% 28%, color-mix(in srgb, var(--vdp-accent) 11%, transparent), transparent 32rem);
}

.vdp-record-status {
    --vdp-theme-gradient: var(--gtx-grad, linear-gradient(180deg, #155a96, #1e73be));
    --vdp-accent: var(--gtx-accent-solid, #1e73be);
    --vdp-accent-soft: rgba(30, 115, 190, .18);
    --vdp-accent-soft: color-mix(in srgb, var(--vdp-accent) 18%, transparent);
    --vdp-surface: var(--bs-body-bg, #fff);
    display: inline-flex;
    gap: .6rem;
    align-items: center;
    width: 100%;
    min-height: 2.7rem;
    padding: .35rem .9rem .35rem .4rem;
    color: var(--bs-body-color, var(--vdp-ink));
    border: 1px solid rgba(31, 41, 51, .12);
    border-color: color-mix(in srgb, var(--vdp-accent) 22%, transparent);
    border-radius: 999px;
    background: var(--vdp-surface);
    background: color-mix(in srgb, var(--vdp-accent) 8%, var(--vdp-surface));
    box-shadow: 0 .45rem 1.25rem rgba(20, 29, 38, .09);
    font-size: .78rem;
    letter-spacing: .015em;
}

.vdp-page-title-status-slot {
    z-index: 2;
    width: min(13.5rem, calc(100vw - 9rem));
}

.vdp-record-status-icon {
    display: grid;
    place-items: center;
    width: 1.95rem;
    height: 1.95rem;
    flex: 0 0 auto;
    color: #fff;
    border-radius: 50%;
    background: var(--vdp-theme-gradient);
    box-shadow: 0 .3rem .75rem var(--vdp-accent-soft);
}

html.theme-silver .vdp-record-status-icon {
    color: #20262c;
}

.vdp-record-status-text {
    white-space: nowrap;
}

.vdp-record-status-number {
    color: var(--vdp-accent);
    font-weight: 850;
}

#vdpStatusCurrent {
    display: inline-block;
    min-width: 2.15rem;
    text-align: right;
}

#vdpStatusTotal {
    display: inline-block;
    min-width: 1.35rem;
    color: var(--bs-body-color, var(--vdp-ink));
    font-weight: 750;
    text-align: center;
}

.vdp-identity {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(17rem, 22rem);
    gap: clamp(1.5rem, 4vw, 4rem);
    align-items: end;
    overflow: hidden;
    margin: .5rem 0 1.25rem;
    padding: clamp(1.5rem, 4vw, 0rem);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 1.5rem;
    background: var(--vdp-theme-gradient);
    background:
        radial-gradient(circle at 100% 100%, rgba(255, 255, 255, .22), transparent 38%),
        linear-gradient(108deg, rgba(3, 7, 12, .98), rgba(7, 13, 20, .9) 52%, rgba(9, 15, 22, .68)),
        var(--vdp-theme-gradient);
    box-shadow: 0 1.5rem 4rem rgba(14, 22, 30, .18);
}

.vdp-identity::before {
    position: absolute;
    inset: 0;
    z-index: -1;
    content: "";
    opacity: .46;
    background:
        repeating-linear-gradient(115deg, transparent 0 5rem, rgba(255, 255, 255, .035) 5rem 5.08rem),
        radial-gradient(circle at 78% 18%, var(--vdp-accent), transparent 28%),
        radial-gradient(circle at 88% 125%, transparent 0 8rem, rgba(255, 255, 255, .09) 8.1rem 11rem, transparent 11.1rem);
    pointer-events: none;
}

.vdp-identity::after {
    position: absolute;
    top: -.13em;
    right: -.03em;
    z-index: -1;
    content: "DRIVE";
    color: transparent;
    font-size: clamp(7rem, 16vw, 15rem);
    font-weight: 950;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
    -webkit-text-stroke: 1px rgba(255, 255, 255, .09);
    user-select: none;
    pointer-events: none;
}

.vdp-identity-orbit {
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 50%;
    pointer-events: none;
}

.vdp-identity-orbit-one {
    top: -17rem;
    left: -15rem;
    width: 36rem;
    height: 36rem;
}

.vdp-identity-orbit-two {
    top: -8rem;
    left: -6rem;
    width: 18rem;
    height: 18rem;
}

.vdp-identity-copy {
    display: flex;
    flex-direction: column;
    align-self: stretch;
    min-height: clamp(15rem, 22vw, 15rem);
}

.vdp-eyebrow,
.vdp-facts {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem 1.25rem;
    align-items: center;
}

.vdp-eyebrow {
    margin-bottom: 0;
    color: rgba(255, 255, 255, .65);
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.vdp-availability {
    display: inline-flex;
    gap: .5rem;
    align-items: center;
    color: #dff7e7;
}

.vdp-availability > span {
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background: #41d173;
    box-shadow: 0 0 0 .28rem rgba(65, 209, 115, .15);
}

.vdp-title-row {
    display: flex;
    gap: clamp(.85rem, 2vw, 1.4rem);
    align-items: center;
    margin: auto 0;
    padding: clamp(.65rem, 1.5vw, 1.25rem) 0;
}

.vdp-make-logo {
    flex: 0 0 auto;
    width: clamp(3.5rem, 7vw, 6rem);
    max-height: 4rem;
    padding: .45rem .65rem;
    object-fit: contain;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: .8rem;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 .7rem 1.8rem rgba(0, 0, 0, .18);
}

.vdp-identity h1 {
    position: relative;
    z-index: 0;
    width: fit-content;
    max-width: none;
    margin: 0;
    padding: .08em .12em .14em;
    color: #f4f8fb;
    font-size: clamp(2.4rem, 4vw, 3.7rem);
    font-weight: 700;
    line-height: .94;
    text-wrap: balance;
    background: linear-gradient(180deg, #fff 0%, #fff 34%, #c8d1d8 52%, #f8fbfd 72%, #aab5bd 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, .28);
    paint-order: stroke fill;
    filter: drop-shadow(0 10px 16px rgba(2, 6, 10, .4));
    text-shadow:
        0 -1px 0 rgba(255, 255, 255, .9),
        0 1px 0 rgba(255, 255, 255, .34),
        0 2px 0 color-mix(in srgb, var(--vdp-accent) 18%, #87939c),
        0 3px 0 #6d7881,
        0 4px 0 #4d5760,
        0 7px 9px rgba(0, 0, 0, .42),
        0 0 24px var(--vdp-accent-soft);
}

.vdp-identity h1::after {
    position: absolute;
    right: 8%;
    bottom: -.14em;
    left: 8%;
    z-index: -1;
    height: .11em;
    content: "";
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, var(--vdp-accent-bright), rgba(255, 255, 255, .9), var(--vdp-accent-bright), transparent);
    box-shadow: 0 0 .4em var(--vdp-accent-soft);
    opacity: .72;
}

.vdp-facts {
    color: rgba(255, 255, 255, .78);
    font-size: .92rem;
}

.vdp-facts span {
    display: inline-flex;
    gap: .45rem;
    align-items: center;
}

.vdp-facts i {
    color: var(--vdp-accent-bright);
}

.vdp-price-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-self: center;
    width: min(100%, 18rem);
    padding: 1.4rem;
    text-align: center;
    transform: translateX(1.25rem);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, .08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    backdrop-filter: blur(14px);
}

.vdp-price-label,
.vdp-price-note {
    color: rgba(255, 255, 255, .62);
    font-size: .73rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.vdp-price-card > strong {
    margin: .15rem 0;
    color: #fff;
    font-size: clamp(2rem, 3.5vw, 3rem);
    letter-spacing: -.045em;
    line-height: 1.1;
}

.vehicle-detail-page .details-container.inventory-details-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem);
    gap: clamp(1rem, 2.5vw, 2rem) !important;
    align-items: start;
    width: 100%;
    margin-top: 0 !important;
}

.vehicle-detail-page .inventory-details-main {
    min-width: 0;
    width: 100%;
}

.vdp-tabs {
    position: sticky;
    top: .35rem;
    z-index: 20;
    margin-bottom: .85rem;
    padding: .4rem;
    overflow: hidden;
    border: 1px solid var(--vdp-line);
    border-radius: 1rem;
    background: var(--vdp-surface);
    background: color-mix(in srgb, var(--vdp-surface) 90%, transparent);
    box-shadow: 0 .7rem 2rem rgba(20, 29, 38, .08);
    backdrop-filter: blur(14px);
}

.vdp-tabs .nav-tabs {
    flex-wrap: nowrap;
    gap: .25rem;
    overflow-x: auto;
    border: 0;
    scrollbar-width: none;
}

.vdp-tabs .nav-tabs::-webkit-scrollbar {
    display: none;
}

.vdp-tabs .nav-item {
    flex: 0 0 auto;
    padding: .7rem .9rem;
    color: var(--bs-secondary-color, #626d78) !important;
    border: 0 !important;
    border-radius: .7rem !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: .82rem;
    font-weight: 700;
    text-shadow: none !important;
}

.vdp-tabs .nav-item.active {
    color: var(--bs-body-color, var(--vdp-ink)) !important;
    background: var(--vdp-soft) !important;
    background: color-mix(in srgb, var(--vdp-accent) 12%, var(--vdp-soft)) !important;
}

.vehicle-detail-page .tab-content > .tab-pane {
    outline: none;
}

.vehicle-detail-page .vdp-gallery-card {
    overflow: hidden;
    margin: 0 0 .75rem !important;
    padding: .65rem;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 1.35rem;
    background: var(--vdp-theme-gradient);
    background:
        radial-gradient(circle at 100% 100%, rgba(255, 255, 255, .22), transparent 38%),
        linear-gradient(108deg, rgba(3, 7, 12, .98), rgba(7, 13, 20, .9) 52%, rgba(9, 15, 22, .68)),
        var(--vdp-theme-gradient);
    box-shadow: 0 1.2rem 3rem rgba(11, 17, 22, .16);
}

.vehicle-detail-page .ratio-carousel {
    --bs-aspect-ratio: 59%;
    overflow: hidden;
    border-radius: .95rem;
    background: radial-gradient(circle at center, #28333d, #0c1116 68%);
    background:
        radial-gradient(circle at center, color-mix(in srgb, var(--vdp-accent) 20%, #28333d), #0c1116 68%);
}

.vdp-photo-pending {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: clamp(.8rem, 2vw, 1.35rem);
    align-items: center;
    width: 100%;
    min-height: 7.5rem;
    margin: 0 0 .75rem;
    padding: clamp(1rem, 2vw, 1.35rem);
    color: #27313a;
    border: 1px solid rgba(31, 41, 51, .14);
    border-radius: 1rem;
    background: linear-gradient(110deg, #fff 0%, #f4f5f6 58%, #dfe2e5 100%);
    box-shadow: 0 .65rem 1.8rem rgba(20, 29, 38, .08);
}

.vdp-photo-pending-camera {
    display: grid;
    place-items: center;
    width: 3.4rem;
    height: 3.4rem;
    color: var(--vdp-accent);
    border: 1px solid rgba(31, 41, 51, .12);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 .35rem .9rem rgba(20, 29, 38, .09);
    font-size: 1.3rem;
}

.vdp-photo-pending-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.vdp-photo-pending-kicker {
    margin-bottom: .2rem;
    color: var(--vdp-accent);
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.vdp-photo-pending strong {
    font-size: clamp(1rem, 2vw, 1.25rem);
    letter-spacing: -.025em;
    line-height: 1.2;
}

.vdp-photo-pending small {
    margin-top: .25rem;
    color: #68737d;
    font-size: .78rem;
    line-height: 1.35;
}

.vehicle-detail-page #detailsCarousel,
.vehicle-detail-page #detailsCarousel .carousel-inner,
.vehicle-detail-page #detailsCarousel .carousel-item {
    height: 100% !important;
}

.vehicle-detail-page #detailsCarousel .carousel-inner {
    background: var(--vdp-theme-gradient);
    background:
        radial-gradient(circle at 100% 100%, rgba(255, 255, 255, .22), transparent 38%),
        linear-gradient(108deg, rgba(3, 7, 12, .98), rgba(7, 13, 20, .9) 52%, rgba(9, 15, 22, .68)),
        var(--vdp-theme-gradient);
}

.vehicle-detail-page #detailsCarousel .slide-box {
    height: 100%;
    background: var(--vdp-theme-gradient);
    background:
        radial-gradient(circle at 100% 100%, rgba(255, 255, 255, .22), transparent 38%),
        linear-gradient(108deg, rgba(3, 7, 12, .98), rgba(7, 13, 20, .9) 52%, rgba(9, 15, 22, .68)),
        var(--vdp-theme-gradient);
}

.vehicle-detail-page #detailsCarousel img {
    width: 100%;
    height: 100%;
    padding: .25rem;
    object-fit: contain;
}

.vehicle-detail-page #detailsCarousel .carousel-control-prev,
.vehicle-detail-page #detailsCarousel .carousel-control-next {
    top: 50%;
    width: 2.7rem;
    height: 2.7rem;
    margin: 0 .8rem;
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 50%;
    background: rgba(8, 12, 16, .62);
    transform: translateY(-50%);
    opacity: 1;
    backdrop-filter: blur(8px);
}

.vdp-utility-actions {
    gap: .5rem;
    margin: -.1rem 0 .85rem !important;
}

.vdp-utility-actions .btn {
    display: inline-grid;
    place-items: center;
    width: 2.65rem;
    height: 2.65rem;
    padding: 0;
    color: var(--bs-body-color, var(--vdp-ink));
    border: 1px solid var(--vdp-line) !important;
    border-radius: 50% !important;
    background: var(--vdp-surface) !important;
    box-shadow: 0 .45rem 1.2rem rgba(20, 29, 38, .08) !important;
}

.vehicle-detail-page .well {
    border-color: var(--vdp-line);
}

.vehicle-detail-page #nav-details > .well:not(.vdp-gallery-card),
.vehicle-detail-page #nav-call,
.vehicle-detail-page #nav-payment,
.vehicle-detail-page #nav-pictures,
.vehicle-detail-page #tab-qr-code {
    overflow: hidden;
    border: 1px solid var(--vdp-line);
    border-radius: 1.1rem;
    background: var(--vdp-surface);
    box-shadow: 0 .8rem 2.5rem rgba(20, 29, 38, .06);
}

.vehicle-detail-page #nav-call {
    padding: clamp(.75rem, 2.5vw, 1.5rem);
}

.vdp-contact-card {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(18rem, .92fr);
    gap: clamp(.8rem, 2vw, 1.25rem);
}

.vdp-contact-intro,
.vdp-contact-hours {
    min-width: 0;
    border: 1px solid var(--vdp-line);
    border-radius: 1rem;
}

.vdp-contact-intro {
    display: flex;
    flex-direction: column;
    padding: clamp(1.25rem, 3vw, 2.25rem);
    background:
        radial-gradient(circle at 100% 0, var(--vdp-accent-soft), transparent 18rem),
        var(--vdp-surface);
}

.vdp-contact-kicker,
.vdp-contact-location small,
.vdp-contact-action small,
.vdp-contact-hours-heading small {
    display: block;
    color: var(--bs-secondary-color, var(--vdp-muted));
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.vdp-contact-kicker {
    margin-bottom: .55rem;
    color: var(--vdp-accent);
}

.vdp-contact-intro h2 {
    max-width: 15ch;
    margin: 0;
    color: var(--bs-heading-color, var(--bs-body-color, var(--vdp-ink)));
    font-size: clamp(1.75rem, 4vw, 3rem);
    font-weight: 780;
    letter-spacing: -.045em;
    line-height: 1.02;
    text-wrap: balance;
}

.vdp-contact-intro > p {
    max-width: 46ch;
    margin: .85rem 0 1.5rem;
    color: var(--bs-secondary-color, var(--vdp-muted));
    font-size: .9rem;
    line-height: 1.55;
}

.vdp-contact-location,
.vdp-contact-hours-heading {
    display: flex;
    gap: .8rem;
    align-items: center;
}

.vdp-contact-location {
    margin-top: auto;
    padding: .9rem;
    border: 1px solid var(--vdp-line);
    border-radius: .8rem;
    background: var(--vdp-soft);
    background: color-mix(in srgb, var(--vdp-accent) 6%, var(--vdp-soft));
}

.vdp-contact-location > span:last-child,
.vdp-contact-hours-heading > span:last-child,
.vdp-contact-action > span {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.vdp-contact-location strong,
.vdp-contact-location > span:last-child > span {
    color: var(--bs-body-color, var(--vdp-ink));
    font-size: .87rem;
    line-height: 1.35;
}

.vdp-contact-icon {
    display: grid;
    place-items: center;
    width: 2.7rem;
    height: 2.7rem;
    flex: 0 0 auto;
    color: #fff;
    border-radius: .75rem;
    background: var(--vdp-theme-gradient);
    box-shadow: 0 .45rem 1rem var(--vdp-accent-soft);
}

html.theme-silver .vdp-contact-icon {
    color: #20262c;
}

.vdp-contact-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
    margin-top: .75rem;
}

.vdp-contact-action {
    display: flex;
    gap: .7rem;
    align-items: center;
    min-width: 0;
    min-height: 3.75rem;
    padding: .7rem .85rem;
    border: 1px solid var(--vdp-line);
    border-radius: .8rem;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease;
}

.vdp-contact-action:hover,
.vdp-contact-action:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 .65rem 1.3rem rgba(20, 29, 38, .13);
}

.vdp-contact-action > i {
    flex: 0 0 auto;
    font-size: 1.05rem;
}

.vdp-contact-action strong {
    overflow: hidden;
    font-size: .83rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vdp-contact-action-primary {
    color: #fff;
    border-color: color-mix(in srgb, var(--vdp-accent) 65%, #111) !important;
    background: var(--vdp-theme-gradient);
}

.vdp-contact-action-primary:hover,
.vdp-contact-action-primary:focus-visible {
    color: #fff;
}

.vdp-contact-action-primary small {
    color: rgba(255, 255, 255, .7);
}

html.theme-silver .vdp-contact-action-primary,
html.theme-silver .vdp-contact-action-primary:hover,
html.theme-silver .vdp-contact-action-primary:focus-visible {
    color: #20262c;
}

html.theme-silver .vdp-contact-action-primary small {
    color: rgba(32, 38, 44, .65);
}

.vdp-contact-action-secondary {
    color: var(--bs-body-color, var(--vdp-ink));
    background: var(--vdp-soft);
}

.vdp-contact-action-secondary:hover,
.vdp-contact-action-secondary:focus-visible {
    color: var(--bs-body-color, var(--vdp-ink));
}

.vdp-contact-hours {
    padding: clamp(1rem, 2.5vw, 1.5rem);
    background: var(--vdp-soft);
}

.vdp-contact-hours-heading {
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--vdp-line);
}

.vdp-contact-hours-heading strong {
    color: var(--bs-heading-color, var(--bs-body-color, var(--vdp-ink)));
    font-size: 1rem;
}

.vdp-contact-hours-list {
    padding: .55rem 0;
}

.vdp-contact-hours-row {
    display: grid;
    grid-template-columns: minmax(5rem, .8fr) minmax(0, 1.2fr);
    gap: 1rem;
    align-items: center;
    padding: .64rem .15rem;
    border-bottom: 1px solid var(--vdp-line);
    font-size: .8rem;
}

.vdp-contact-hours-row:last-child {
    border-bottom: 0;
}

.vdp-contact-hours-row > span {
    color: var(--bs-secondary-color, var(--vdp-muted));
}

.vdp-contact-hours-row > strong {
    color: var(--bs-body-color, var(--vdp-ink));
    text-align: right;
}

.vdp-contact-hours-note {
    display: flex;
    gap: .45rem;
    margin: .35rem 0 0;
    padding-top: .8rem;
    color: var(--bs-secondary-color, var(--vdp-muted));
    border-top: 1px solid var(--vdp-line);
    font-size: .7rem;
    line-height: 1.4;
}

.vehicle-detail-page .collapse-toggle:not(.article) {
    min-height: 3.25rem;
    border-radius: .85rem;
}

.vehicle-detail-page .collapse-toggle h5,
.vehicle-detail-page .vdp-action-stack h5 {
    font-size: .78rem;
    letter-spacing: .055em;
}

.vehicle-detail-page #nav-pictures {
    padding: .65rem;
}

.vdp-photo-gallery {
    overflow: hidden;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 1rem;
    background: var(--vdp-theme-gradient);
    background:
        linear-gradient(112deg, rgba(8, 13, 18, .3), rgba(8, 13, 18, .78)),
        linear-gradient(125deg, var(--vdp-accent-soft), transparent 48%),
        var(--vdp-theme-gradient);
}

.vdp-photo-gallery-heading {
    display: flex;
    gap: 2rem;
    align-items: end;
    justify-content: space-between;
    padding: clamp(1.25rem, 3.5vw, 2.5rem);
}

.vdp-photo-gallery-kicker {
    display: block;
    margin-bottom: .45rem;
    color: var(--vdp-accent-bright);
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.vdp-photo-gallery-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.7rem, 4vw, 3.25rem);
    line-height: 1;
    font-weight: 400;
}

.vdp-photo-gallery-heading p {
    margin: .65rem 0 0;
    color: rgba(255, 255, 255, .66);
}

.vdp-photo-gallery-count {
    display: grid;
    place-items: center;
    width: 5.2rem;
    height: 5.2rem;
    flex: 0 0 auto;
    align-content: center;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    backdrop-filter: blur(12px);
}

.vdp-photo-gallery-count strong {
    color: #fff;
    font-size: 1.45rem;
    line-height: 1;
}

.vdp-photo-gallery-count span {
    margin-top: .2rem;
    color: rgba(255, 255, 255, .62);
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.vdp-photo-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-flow: dense;
    grid-auto-rows: clamp(9rem, 13vw, 12rem);
    gap: .55rem;
    max-height: none !important;
    padding: .55rem;
    background: #0c1116;
}

.vdp-photo-grid .elem,
.vdp-photo-grid .elem * {
    box-sizing: border-box;
    margin: 0 !important;
}

.vdp-photo-grid .elem {
    position: relative;
    display: block;
    width: 100% !important;
    height: 100%;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: .75rem;
    background: #19232c;
    outline: none;
}

.vdp-photo-grid .elem:first-child {
    grid-column: span 2;
    grid-row: span 2;
}

.vdp-photo-grid .elem:nth-child(8n + 6) {
    grid-column: span 2;
}

.vdp-photo-grid .elem > .vdp-photo-tile {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    padding-bottom: 0 !important;
    overflow: hidden;
    border-radius: inherit !important;
    background-color: #19232c;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    transform: scale(1.002);
    transition: transform .55s cubic-bezier(.2, .75, .25, 1), filter .35s ease;
}

.vdp-photo-grid .elem > .vdp-photo-tile::after {
    position: absolute;
    inset: 0;
    content: "";
    pointer-events: none;
    background: linear-gradient(180deg, transparent 54%, rgba(5, 9, 13, .55));
    transition: opacity .3s ease;
}

.vdp-photo-grid .elem:hover > .vdp-photo-tile,
.vdp-photo-grid .elem:focus-visible > .vdp-photo-tile {
    filter: saturate(1.08) contrast(1.03);
    transform: scale(1.045);
}

.vdp-photo-grid .elem:focus-visible {
    border-color: var(--vdp-accent-bright);
    box-shadow: 0 0 0 .2rem var(--vdp-accent-soft);
}

.vdp-photo-number,
.vdp-photo-expand {
    position: absolute;
    z-index: 2;
    bottom: .65rem;
    display: grid !important;
    place-items: center;
    min-width: 2rem;
    height: 2rem !important;
    padding: 0 .45rem !important;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 999px !important;
    background: rgba(7, 12, 17, .62);
    font-size: .67rem;
    font-weight: 800;
    backdrop-filter: blur(8px);
}

.vdp-photo-number {
    left: .65rem;
    letter-spacing: .08em;
}

.vdp-photo-expand {
    right: .65rem;
    width: 2rem !important;
    opacity: 0;
    transform: translateY(.35rem);
    transition: opacity .25s ease, transform .25s ease;
}

.vdp-photo-grid .elem:hover .vdp-photo-expand,
.vdp-photo-grid .elem:focus-visible .vdp-photo-expand {
    opacity: 1;
    transform: translateY(0);
}

.vehicle-detail-page .vdp-action-stack {
    position: sticky;
    top: 5.4rem;
    width: 100%;
    padding: 1rem;
    border: 1px solid var(--vdp-line);
    border-radius: 1.25rem;
    background: var(--vdp-surface);
    background: color-mix(in srgb, var(--vdp-surface) 90%, transparent);
    box-shadow: 0 1.2rem 3rem rgba(20, 29, 38, .1);
    backdrop-filter: blur(14px);
}

.vdp-concierge-heading {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    margin-bottom: 1rem;
    padding: .75rem .85rem .9rem;
    border: 1px solid color-mix(in srgb, var(--vdp-accent) 20%, var(--vdp-line));
    border-radius: 1rem;
    background:
        radial-gradient(circle at 100% 0, var(--vdp-accent-soft), transparent 58%),
        color-mix(in srgb, var(--vdp-accent) 5%, var(--vdp-surface));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .34),
        0 .65rem 1.5rem rgba(20, 29, 38, .08);
    text-align: center;
}

.vdp-concierge-heading::before {
    position: absolute;
    top: .75rem;
    right: .8rem;
    z-index: -1;
    width: 2.8rem;
    height: 2.8rem;
    content: "";
    border: 1px solid color-mix(in srgb, var(--vdp-accent) 30%, transparent);
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(255, 255, 255, .86) 0 8%, transparent 10%),
        radial-gradient(circle, var(--vdp-accent-soft), transparent 68%);
    box-shadow: 0 0 1.4rem var(--vdp-accent-soft);
    opacity: .72;
}

.vdp-has-concierge-reveal .vdp-concierge-heading {
    max-height: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    border-color: transparent;
    box-shadow: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-.65rem) scale(.98);
    transition:
        max-height .35s ease,
        margin .35s ease,
        padding .35s ease,
        border-color .35s ease,
        box-shadow .35s ease,
        opacity .24s ease,
        transform .35s ease,
        visibility 0s linear .35s;
}

.vdp-has-concierge-reveal .vdp-concierge-heading.is-visible {
    max-height: 14rem;
    margin-bottom: 1rem;
    padding-top: .75rem;
    padding-bottom: .9rem;
    border-color: color-mix(in srgb, var(--vdp-accent) 24%, var(--vdp-line));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .34),
        0 .75rem 1.7rem rgba(20, 29, 38, .1);
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    transition-delay: 0s;
}

.vdp-concierge-kicker {
    display: inline-flex;
    align-items: center;
    margin-bottom: .35rem;
    padding: .28rem .55rem;
    color: var(--vdp-accent);
    border: 1px solid color-mix(in srgb, var(--vdp-accent) 22%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--vdp-accent) 8%, var(--vdp-surface));
    font-size: .62rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.vdp-concierge-heading strong {
    display: block;
    width: fit-content;
    margin-inline: auto;
    color: var(--bs-body-color, var(--vdp-ink));
    font-size: clamp(1.85rem, 3vw, 2.25rem);
    font-weight: 850;
    line-height: 1;
    text-shadow: 0 .35rem .8rem rgba(20, 29, 38, .12);
}

.vdp-concierge-heading p {
    max-width: 19rem;
    margin: .6rem auto 0;
    color: var(--bs-secondary-color, var(--vdp-muted));
    font-size: .78rem;
    line-height: 1.55;
}

.vehicle-detail-page .vdp-action-stack > .btn,
.vehicle-detail-page .vdp-action-stack > a.btn {
    min-height: 3.45rem;
    margin-bottom: .65rem !important;
    border: 1px solid var(--vdp-line) !important;
    border-radius: .8rem;
    box-shadow: none !important;
    transition: transform .18s ease, box-shadow .18s ease;
}

.vehicle-detail-page .vdp-action-stack > .btn:hover,
.vehicle-detail-page .vdp-action-stack > a.btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 .65rem 1.4rem rgba(20, 29, 38, .12) !important;
}

.vehicle-detail-page .vdp-action-stack #btnTestDriveForm {
    color: #fff !important;
    border-color: #8f101c !important;
    background: linear-gradient(180deg, #ef5360 0%, #d8202f 48%, #a80f1d 100%) !important;
    text-shadow: 0 1px 1px rgba(79, 0, 8, .5) !important;
    box-shadow: 0 .65rem 1.45rem rgba(168, 15, 29, .24) !important;
}

.vehicle-detail-page .vdp-action-stack #btnTestDriveForm:hover,
.vehicle-detail-page .vdp-action-stack #btnTestDriveForm:focus-visible {
    color: #fff !important;
    border-color: #780b15 !important;
    background: linear-gradient(0deg, #ef5360 0%, #d8202f 48%, #970b18 100%) !important;
    box-shadow: 0 .85rem 1.8rem rgba(151, 11, 24, .34) !important;
}

.vdp-suggestions {
    overflow: hidden;
    margin-top: 1.25rem;
    border: 1px solid var(--vdp-line);
    border-radius: 1.1rem;
    background: var(--vdp-surface);
    box-shadow: 0 .8rem 2.5rem rgba(20, 29, 38, .06);
}

.vdp-suggestions > .collapse-toggle {
    border-radius: 0;
}

.vdp-suggestions .scroll-container {
    border: 0;
    box-shadow: none !important;
}

.vdp-mobile-dock {
    display: none;
}

@media (max-width: 991.98px) {
    .vehicle-detail-page {
        width: min(100% - 1rem, 860px);
        padding-bottom: 6rem;
    }

    .vdp-identity {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1.5rem;
        border-radius: 1.15rem;
    }

    .vdp-identity-copy {
        min-height: 14rem;
    }

    .vdp-price-card {
        max-width: 18rem;
        transform: none;
    }

    .vehicle-detail-page .details-container.inventory-details-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .vehicle-detail-page .vdp-action-stack {
        position: static;
    }

    .vdp-mobile-dock {
        position: fixed;
        right: .65rem;
        bottom: calc(.65rem + env(safe-area-inset-bottom));
        left: .65rem;
        z-index: 1035;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        padding: .45rem;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: 1rem;
        background: rgba(15, 22, 29, .94);
        box-shadow: 0 1rem 3rem rgba(0, 0, 0, .3);
        backdrop-filter: blur(16px);
    }

    .vdp-mobile-dock a,
    .vdp-mobile-dock button {
        display: flex;
        gap: .35rem;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 3.35rem;
        padding: .3rem;
        color: rgba(255, 255, 255, .82);
        border: 0;
        border-radius: .7rem;
        background: transparent;
        font-size: .68rem;
        font-weight: 700;
        text-decoration: none;
    }

    .vdp-mobile-dock button:nth-child(2) {
        color: #fff;
        background: var(--vdp-accent);
    }
}

@media (max-width: 575.98px) {
    .vehicle-detail-page {
        width: calc(100% - .5rem);
    }

    .vdp-identity {
        padding: 1.25rem;
    }

    .vdp-identity-copy {
        min-height: 12.5rem;
    }

    .vdp-identity h1 {
        font-size: clamp(2rem, 11vw, 3rem);
    }

    .vdp-facts {
        gap: .55rem 1rem;
        font-size: .8rem;
    }

    .vdp-price-card {
        display: flex;
    }

    .vehicle-detail-page #nav-call {
        padding: .45rem;
    }

    .vdp-contact-actions {
        grid-template-columns: 1fr;
    }

    .vdp-contact-intro,
    .vdp-contact-hours {
        border-radius: .8rem;
    }

    .vdp-tabs {
        border-radius: .8rem;
    }

    .vdp-tabs .nav-item {
        padding: .65rem .72rem;
        font-size: .74rem;
    }

    .vehicle-detail-page .vdp-gallery-card {
        padding: .35rem;
        border-radius: .95rem;
    }

    .vehicle-detail-page .ratio-carousel {
        --bs-aspect-ratio: 72%;
        border-radius: .7rem;
    }

    .vehicle-detail-page #detailsCarousel .carousel-control-prev,
    .vehicle-detail-page #detailsCarousel .carousel-control-next {
        width: 2.3rem;
        height: 2.3rem;
        margin: 0 .4rem;
    }

    .vdp-photo-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 8rem;
        gap: .4rem;
        padding: .4rem;
    }

    .vehicle-detail-page #nav-pictures {
        padding: .3rem;
    }

    .vdp-photo-gallery-heading {
        gap: 1rem;
        padding: 1.15rem;
    }

    .vdp-photo-gallery-count {
        width: 4.25rem;
        height: 4.25rem;
    }

    .vehicle-detail-page .vdp-action-stack {
        padding: .8rem;
        border-radius: 1rem;
    }

    .vdp-suggestions .scroll-button {
        width: 2.25rem;
        min-width: 2.25rem;
    }
}

@media (max-width: 767.98px) {
    .vdp-contact-card {
        grid-template-columns: 1fr;
    }

    .vdp-photo-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: clamp(8rem, 25vw, 10rem);
    }

    .vdp-photo-expand {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .vehicle-detail-page *,
    .vehicle-detail-page *::before,
    .vehicle-detail-page *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}
