/* Home (Homepage A Part: Hero B, body styles, featured Card C slider, Makes C, Finance B, promos, reviews, popular searches). Container widths: <768 phone, 768–1023 tablet, ≥1024 desktop. */
.dbh{container:dbh / inline-size;--sp:84px;--sv:64px;background:var(--color-d);color:var(--color-c)}
.dbh *{box-sizing:border-box}
.dbh-in{max-width:calc(var(--db-maxw,99999px) - 168px);margin:0 auto;display:flex;flex-direction:column;gap:20px}
.dbh-sec{padding:var(--sv) var(--sp)}
.dbh-h2{margin:0;font-size:28px;font-weight:700;letter-spacing:-.02em;color:var(--color-c)}
.dbh-eye{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--color-a)}
.dbh-muted{font-size:13px;color:var(--gray-600)}
.dbh-strip{display:flex;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth}.dbh-strip::-webkit-scrollbar{display:none}
.dbh-ulink{flex:none;display:flex;align-items:center;gap:6px;min-height:44px;font:700 15px var(--font);color:var(--color-c)!important;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--color-a);text-decoration-thickness:2px;white-space:nowrap}.dbh-ulink:hover{color:var(--color-a)!important}.dbh-ulink svg{color:var(--color-a)}
.dbh-btn{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border-radius:calc(var(--radius) * 1.3);background:var(--color-a);color:var(--color-d)!important;font:700 15px var(--font);text-decoration:none;white-space:nowrap}.dbh-btn:hover{background:var(--color-b)}
.dbh-arrows{display:flex;gap:8px}
.dbh-arw{flex:none;width:44px;height:44px;border:1px solid var(--gray-300);border-radius:50%;background:var(--color-d);color:var(--color-c);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}.dbh-arw:hover{border-color:var(--color-c)}




/* Hero B */














.dbh-f{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;min-height:56px;padding:4px 16px;text-align:left;cursor:pointer}
.dbh-f-sel{border-left:1px solid var(--gray-200)}


.dbh-f input,.dbh-f select{width:100%;min-width:0;height:44px;padding:0;border:0;background:transparent;font:600 16px var(--font);color:var(--color-c);outline-offset:4px}
.dbh-f select{padding-right:26px;-webkit-appearance:none;appearance:none;cursor:pointer}
.dbh-chev{position:absolute;right:16px;bottom:12px;color:var(--color-a);pointer-events:none}


/* Body styles */
.dbh-body{padding-bottom:0;padding-top:40px}.dbh-body .dbh-in{gap:16px}
.dbh-body .dbh-strip{gap:12px;padding:2px 0 6px}
.dbh-bodyt{flex:none;width:150px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 10px 14px;border:1px solid var(--gray-200);border-radius:calc(var(--radius) * 2);background:var(--color-d);color:var(--color-c)!important;text-decoration:none}
.dbh-bodyt:hover{border-color:var(--color-c)}
.dbh-bodyt img{display:block;width:100%;height:auto;aspect-ratio:5 / 2;object-fit:contain}
.dbh-bodyt span{font-size:15px;font-weight:600}

/* Featured */
.dbh-headrow{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.dbh-headact{display:flex;align-items:center;gap:14px}
.dbh-cars{gap:24px;padding:0 0 6px;scroll-snap-type:x mandatory}
.dbh-car{flex:0 0 calc((100% - 72px) / 4);min-width:0;display:flex;scroll-snap-align:start}.dbh-car > *{width:100%}

/* Makes C */
.dbh-makes{background:var(--gray-50)}
.dbh-makes-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:56px;align-items:center}
.dbh-makes-txt{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.dbh-makes-txt h2{margin:0;font-size:28px;font-weight:700;letter-spacing:-.025em;line-height:1.1;text-wrap:balance}
.dbh-makes-txt p{margin:0;max-width:340px;font-size:16px;line-height:1.55;text-wrap:pretty}
.dbh-makes-btn1{margin-top:4px}.dbh-makes-btn2{display:none}
.dbh-makes-grid{border-radius:calc(var(--radius) * 2.4);background:var(--color-d);box-shadow:0 1px 0 var(--gray-200),0 12px 30px -22px rgba(0,0,0,.4);overflow:hidden}
.dbh-makes-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 -1px -1px 0}
.dbh-make{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:120px;padding:12px 6px;border-right:1px solid var(--gray-200);border-bottom:1px solid var(--gray-200);text-decoration:none;color:var(--color-c)!important}
.dbh-make:hover{background:var(--gray-50)}
.dbh-make img{display:block;width:52px;height:52px;object-fit:contain}
.dbh-make-l{width:52px;height:52px;border-radius:50%;background:var(--gray-100);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700}
.dbh-make span:last-child{font-size:13px;font-weight:600}

/* Finance B */



























/* Trade-in + sell */
.dbh-trade{padding:0 var(--sp) var(--sv);margin-top:24px}
.dbh-promos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.dbh-promo{position:relative;display:grid;grid-template-columns:minmax(0,1fr);min-height:340px;border-radius:calc(var(--radius) * 2.4);overflow:hidden;background:var(--gray-300)}
.dbh-promo > img,.dbh-promo-ov{grid-area:1 / 1;display:block;width:100%;height:100%}
.dbh-promo > img{object-fit:cover;object-position:center}.dbh-promo-sell > img{object-position:center 30%}
.dbh-promo-ov{background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.45) 50%,rgba(0,0,0,0) 85%)}
.dbh-promo-txt{grid-area:1 / 1;position:relative;align-self:center;display:flex;flex-direction:column;align-items:flex-start;gap:12px;max-width:360px;padding:32px;color:#fff}
.dbh-promo-txt > span{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.dbh-promo-txt h2{margin:0;font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.15;color:#fff;text-wrap:balance}
.dbh-promo-txt p{margin:0;font-size:15px;line-height:1.55;text-wrap:pretty}
.dbh-promo-btn{margin-top:4px;display:flex;align-items:center;gap:8px;min-height:48px;padding:0 20px;border-radius:calc(var(--radius) * 1.3);background:#fff;color:var(--color-c)!important;font:700 15px var(--font);text-decoration:none}
.dbh-promo-btn:hover{background:var(--color-a);color:var(--color-d)!important}

/* Reviews */
.dbh-rev{background:var(--gray-50)}.dbh-rvwrap.is-white .dbh-rev{background:var(--color-d)}
.dbh-rev-in{display:grid;grid-template-columns:300px minmax(0,1fr);gap:48px;align-items:start}
.dbh-rev-sum{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:24px}
.dbh-rev-title{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.dbh-rev-title h2{margin:0;font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.15;text-wrap:balance}
.dbh-rating{display:flex;align-items:center;gap:12px;margin-top:6px}
.dbh-score{font-size:48px;font-weight:700;letter-spacing:-.03em;line-height:1}
.dbh-rating-r{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.dbh-stars{display:flex;gap:2px;color:var(--color-a)}
.dbh-rev-act{display:flex;flex-direction:column;gap:8px}.dbh-rev-act .dbh-btn{min-height:46px;font-size:15px}
.dbh-rev-col{display:flex;flex-direction:column;gap:14px;min-width:0}
.dbh-revs{gap:16px;padding:4px 2px 10px;scroll-snap-type:x mandatory}
.dbh-revc{flex:none;width:calc((100% - 32px) / 2.15);margin:0;scroll-snap-align:start;display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:calc(var(--radius) * 2.4);background:var(--color-d);box-shadow:0 1px 2px rgba(0,0,0,.05),0 6px 18px -12px rgba(0,0,0,.18)}
.dbh-revc-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.dbh-quote{color:var(--gray-200)}
.dbh-revc blockquote{margin:0;flex:1;font-size:15px;line-height:1.6;text-wrap:pretty}
.dbh-revc figcaption{display:flex;align-items:center;gap:12px}
.dbh-av{flex:none;width:40px;height:40px;border-radius:50%;background:var(--color-c);color:var(--color-d);font:700 14px var(--font);display:flex;align-items:center;justify-content:center}
.dbh-revc-who{display:flex;flex-direction:column;gap:1px;min-width:0}.dbh-revc-who b{font-size:15px}.dbh-revc-who span{font-size:13px;color:var(--gray-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dbh-revc-who .dbh-revc-src{font-size:12px}
.dbh-rev-arrows{display:flex;justify-content:flex-end}

/* Popular searches */
.dbh-pop .dbh-in{gap:18px}
.dbh-pop-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:10px 20px}
.dbh-pop-t{display:flex;flex-direction:column;gap:4px}.dbh-pop-t p{margin:0;font-size:14px;color:var(--gray-600)}
.dbh-pop-tabs{display:flex;gap:4px;padding:3px;max-width:100%;overflow-x:auto;scrollbar-width:none;border-radius:calc(var(--radius) * 1.6);background:var(--gray-100)}
.dbh-pop-tabs button{flex:none;min-height:36px;padding:0 14px;border:0;border-radius:calc(var(--radius) * 1.2);background:transparent;color:var(--gray-600);font:700 13px var(--font);white-space:nowrap;cursor:pointer}
.dbh-pop-tabs button[aria-selected="true"]{background:var(--color-c);color:var(--color-d)}
.dbh-pop-panel{display:flex;flex-direction:column;gap:18px}
.dbh-pop-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:28px;border-top:1px solid var(--gray-200)}
.dbh-pop-list li{border-bottom:1px solid var(--gray-200);min-width:0}
.dbh-pop-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:46px;padding:0 4px;color:var(--color-c)!important;font:400 15px var(--font);text-decoration:none}
.dbh-pop-list a:hover{color:var(--color-a)!important;text-decoration:underline;text-underline-offset:3px}
.dbh-pop-list a span:first-child{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dbh-pop-n{flex:none;font-size:13px;font-weight:600;color:var(--gray-600)}
.dbh-pop-more{display:none;white-space:nowrap;align-self:center;height:48px;padding:0 20px;border:1.5px solid var(--color-c);border-radius:calc(var(--radius) * 1.3);background:transparent;color:var(--color-c);font:700 15px var(--font);cursor:pointer}

@container dbh (max-width:1279px){.dbh > *{--sp:32px}}
@container dbh (max-width:1023px){
	.dbh > *{--sp:40px;--sv:52px}
	.dbh-h2,.dbh-rev-title h2{font-size:24px}
	
	
	
	
	
	.dbh-f-sel:nth-of-type(2){border-left:0}
	
	.dbh-body{padding-top:32px}
	.dbh-cars{gap:16px}.dbh-car{flex-basis:calc((100% - 16px) / 2)}
	.dbh-makes-in{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:32px}
	.dbh-makes-txt h2{font-size:24px}.dbh-makes-g{grid-template-columns:repeat(3,minmax(0,1fr))}.dbh-make{min-height:104px}.dbh-make img,.dbh-make-l{width:44px;height:44px}
	
	
	
	
	
	.dbh-trade{margin-top:20px}.dbh-promos{gap:16px}.dbh-promo{min-height:300px}.dbh-promo-txt{max-width:100%;padding:22px}.dbh-promo-txt h2{font-size:24px}
	.dbh-rev-in{grid-template-columns:minmax(0,1fr);gap:24px}
	.dbh-rev-sum{flex-direction:row;align-items:flex-end;gap:16px}.dbh-rev-act{flex-direction:row;align-items:center}
	.dbh-score{font-size:40px}.dbh-revc{width:calc((100% - 16px) / 2)}
	.dbh-pop-tabs button{min-height:44px}.dbh-pop-list{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px}
}
@container dbh (max-width:767px){
	.dbh > *{--sp:16px;--sv:40px}
	.dbh-h2,.dbh-rev-title h2{font-size:22px}
	.dbh-arrows{display:none}
	
	
	
	
	
	
	
	
	
	
	
	.dbh-f{min-height:0;padding:0;border:0}
	
	
	
	.dbh-f-sel select{height:48px;padding:0 32px 0 12px;border:1.5px solid var(--gray-300);border-radius:calc(var(--radius) * 1.3);background:var(--color-d);font:400 15px var(--font)}
	.dbh-chev{right:10px;top:15px;bottom:auto}
	
	.dbh-body .dbh-strip,.dbh-cars,.dbh-revs{margin:0 -16px;padding-left:16px;padding-right:16px;scroll-padding:0 16px}
	.dbh-bodyt{width:132px}
	.dbh-car{flex-basis:300px}
	.dbh-makes-in{grid-template-columns:minmax(0,1fr);gap:24px}
	.dbh-makes-txt{align-items:center;text-align:center}.dbh-makes-txt h2{font-size:22px}.dbh-makes-txt p{font-size:15px}
	.dbh-makes-btn1{display:none}.dbh-makes-btn2{display:flex;justify-self:center}
	
	
	
	
	
	.dbh-trade{margin-top:16px}.dbh-promos{grid-template-columns:minmax(0,1fr)}.dbh-promo{min-height:320px}.dbh-promo-txt h2{font-size:22px}
	.dbh-promo-trade > img{object-position:70% center}.dbh-promo-sell > img{object-position:68% center}
	.dbh-rev-sum{flex-direction:column;align-items:center;text-align:center}.dbh-rev-title{align-items:center}
	.dbh-rev-act{width:100%;flex-direction:column;align-items:stretch}
	.dbh-revs{gap:12px}.dbh-revc{width:84%;padding:20px}.dbh-revc blockquote{font-size:15px}.dbh-rev-arrows{display:none}
	.dbh-pop-list{grid-template-columns:minmax(0,1fr)}
	.dbh-pop-panel:not(.is-all) .dbh-pop-x{display:none}.dbh-pop-more{display:block}
}

/* Oct 24 fixes */
/* 5: hero ~30% shorter */

/* 6: tighter search area */

/* 8: Financing heading lines up with "Monthly payment" (card padding 20 + left padding 6) */

/* 9: Popular searches – only the picked tab's list shows */
.dbh-pop-panel[hidden]{display:none}



.dbh{overflow-x:clip}

/* Oct 25: hero search – soft focus instead of the thick red outline */


.dbh-f-sel .dbl-dd-btn:focus-visible{border-color:var(--gray-600);box-shadow:0 0 0 3px var(--gray-100)}
.dbh-f input:focus{outline:none}

/* Oct 25: dropdown chevrons + small icons follow Look & style "Icons" */
.dbh-chev,.dbh-ulink svg,.dbh-f-sel > svg{color:var(--icon-color,var(--color-a))}
/* Oct 25 proof #3: Shop Vehicles lines up with the Make / Model boxes (same 48px height, same bottom edge) */



/* Oct 25 proof #17: "Read all reviews" on tablet + phone = quiet outline button (white, dark border, dark text + arrow), auto width, centered – no big red full-width bar. Desktop unchanged. Rating shows one decimal (4.0). */
.dbh-rev-arr{display:none}
@container dbh (max-width:1023px){
	.dbh-rev-act{display:flex;justify-content:center}
	.dbh-rev-btn{width:auto!important;flex:none!important;height:44px;padding:0 20px;gap:8px;border:1.5px solid var(--color-c)!important;background:var(--color-d)!important;color:var(--color-c)!important;font-size:15px}
	.dbh-rev-btn:hover{background:var(--color-c)!important;color:var(--color-d)!important}
	.dbh-rev-arr{display:block;color:var(--icon-color,var(--color-a))}.dbh-rev-btn:hover .dbh-rev-arr{color:inherit}
}
@container dbh (max-width:1023px){.dbh-rev-act{align-items:center!important;flex-direction:column!important}.dbh-rev-act .dbh-rev-btn{align-self:center!important;width:auto!important;min-height:44px}}
/* Oct 25: hero shorter on 1024–1279 (iPad landscape / small laptops) */

/* Oct 25: desktop + laptop hero 20% shorter: 512px ≥1280 (was 640), 400px 1024–1279 (was 500) */


/* Oct 25: hero search dropdowns – no small ring around the text when a list is open (seen on many devices); open field = underline in Color A, list at least 240px wide */




/* Oct 25 approved 1b: phone + tablet hero (<1024) – photo, centered text, 4 see-through dropdowns, red centered Shop button. Desktop unchanged. */



/* Oct 25: make names 1px larger on every device */
.dbh-make span:last-child{font-size:14px}
@container dbh (max-width:767px){
	/* Finance photo above "Shop by payment / price" taller */
	
	/* Trade-in + Sell to us blocks: text sits at the bottom, tighter spacing, less bottom padding, bottom fade */
	.dbh-promo-ov{background:linear-gradient(180deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.45) 50%,rgba(0,0,0,.8) 100%)}
	.dbh-promo-txt{align-self:end;gap:6px;padding:18px 18px 16px}
	.dbh-promo-txt p{line-height:1.45}
	.dbh-promo-btn{margin-top:8px}
}
/* Oct 25: Finance block – phone: Loan length (dropdown) + Credit side by side; Get pre-qualified under the Shop button. Tablet/desktop unchanged. */



/* Oct 25: phone body styles = 3-column grid (no side scroll); a last row with 1 style fills the row, with 2 styles they share it */
@container dbh (max-width:767px){
	.dbh-body .dbh-strip{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;overflow:visible;margin:0;padding:2px 0 6px}
	.dbh-body .dbh-strip > *{grid-column:span 2;width:auto!important;min-width:0}
	.dbh-body .dbh-strip > :last-child:nth-child(3n+1){grid-column:span 6}
	.dbh-body .dbh-strip > :nth-last-child(2):nth-child(3n+1),.dbh-body .dbh-strip > :last-child:nth-child(3n+2){grid-column:span 3}
	.dbh-body .dbh-arrows{display:none}
}
/* Oct 25: Finance result box on phones – switcher stays on top (smaller, bordered); below it: label + APR on the left, budget value on the right */


/* Oct 25: phone – budget card has no box (border/shadow/padding removed) so fields use the full width */

/* Oct 25: Popular searches tabs = separate pills; picked tab = Color A (red) with white text */
.dbh-pop-tabs{gap:8px;padding:2px 0;background:transparent;border-radius:0}
.dbh-pop-tabs button{padding:0 16px;border:1px solid var(--gray-300);border-radius:999px;background:var(--color-d);color:var(--color-c)}
.dbh-pop-tabs button:hover{border-color:var(--color-c)}
.dbh-pop-tabs button[aria-selected="true"]{border-color:var(--pop-tab-on,var(--color-a));background:var(--pop-tab-on,var(--color-a));color:var(--pop-tab-on-text,#FFFFFF)}
/* Oct 25: budget heading (Search by payment or price / Find cars… / See what…) sits inside the top of the budget card on every device */



/* 1024–1279 (iPad landscape, small laptops): stacked like tablet – the side-by-side layout was too cramped */

/* Oct 25: budget card has no box on any device (no border, shadow, padding) – more room for the fields */



/* Oct 25: tablets + 1024–1279 too – Loan length dropdown before Credit, 2 on a row (desktop ≥1280 keeps the buttons) */

/* Oct 25 tablets (768–1279): Get pre-qualified at the top right of the budget heading; fields + result box centered vertically; result = label + APR left, value right */




/* Oct 25 approved 2b – tablets 768–1279: 4 fields on one row; result bar = underline tabs (By payment / By price), red budget value + label/APR, Shop button on the right */

/* Oct 25: Trade-in + Sell to us blocks on every device – text sits in the bottom-left corner, tight spacing */
.dbh-promo-txt{align-self:end;gap:6px;padding:28px 28px 24px}
.dbh-promo-txt p{line-height:1.45}
.dbh-promo-btn{margin-top:8px}
.dbh-promo-ov{background:linear-gradient(90deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,.25) 55%,rgba(0,0,0,0) 85%),linear-gradient(0deg,rgba(0,0,0,.6) 0%,rgba(0,0,0,0) 60%)}
@container dbh (max-width:1023px){.dbh-promo-txt{padding:22px 22px 18px}}
@container dbh (max-width:767px){.dbh-promo-txt{padding:18px 18px 16px}.dbh-promo-ov{background:linear-gradient(180deg,rgba(0,0,0,0) 20%,rgba(0,0,0,.45) 50%,rgba(0,0,0,.8) 100%)}}

/* Oct 25: Featured vehicles + Cars on Sale – light gray divider on top, tighter vertical spacing */
.dbh-feat{padding-top:40px;padding-bottom:40px}
@container dbh (max-width:1023px){.dbh-feat{padding-top:32px;padding-bottom:32px}}
@container dbh (max-width:767px){.dbh-feat{padding-top:28px;padding-bottom:28px}}
/* Featured + Cars on Sale sit close together (16px desktop / 12px tablet+phone between them) */
.dbh-feat:not(.dbh-sale):has(+ .dbh-sale){padding-bottom:16px}.dbh-feat + .dbh-sale{padding-top:16px}
@container dbh (max-width:1023px){.dbh-feat:not(.dbh-sale):has(+ .dbh-sale){padding-bottom:12px}.dbh-feat + .dbh-sale{padding-top:12px}}
/* Oct 25: From our blog – 3 post cards after the reviews */
.dbh-blog-h{display:flex;flex-direction:column;gap:6px}
.dbh-blog-g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.dbh-bpost{display:flex;flex-direction:column;gap:12px;min-width:0;color:var(--color-c);text-decoration:none}.dbh-bpost:hover{color:var(--color-c)}.dbh-bpost:hover strong{text-decoration:underline}
.dbh-bpost-img{display:block;aspect-ratio:16 / 10;border-radius:calc(var(--radius) * 2);overflow:hidden;background:var(--gray-200)}.dbh-bpost-img img{display:block;width:100%;height:100%;object-fit:cover}
.dbh-bpost-t{display:flex;flex-direction:column;gap:6px;min-width:0}
.dbh-bpost-cat{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow,var(--color-a))}
.dbh-bpost strong{font-size:17px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dbh-bpost-m{font-size:13px;color:var(--gray-600)}
@container dbh (max-width:1023px){.dbh-blog-g{gap:16px}.dbh-bpost strong{font-size:15px}}
@container dbh (max-width:767px){.dbh-blog-g{grid-template-columns:minmax(0,1fr)}.dbh-bpost{display:grid;grid-template-columns:120px minmax(0,1fr);gap:14px;align-items:start}.dbh-bpost-img{aspect-ratio:4 / 3}}
.dbh-blog{padding-top:40px;padding-bottom:40px}.dbh-blog-h{gap:4px}
@container dbh (max-width:1023px){.dbh-blog{padding-top:32px;padding-bottom:32px}}
@container dbh (max-width:767px){.dbh-blog{padding-top:28px;padding-bottom:28px}}
/* Popular searches on vehicle pages: same width/sides as the vehicle page (no 1272 max), less top space */
body.single-db_vehicle .dbh-popwrap > *{--sp:84px}
body.single-db_vehicle .dbh-popwrap .dbh-in{max-width:none}
body.single-db_vehicle .dbh-popwrap .dbh-sec{padding-top:8px;padding-bottom:56px}
@container dbh (max-width:1279px){body.single-db_vehicle .dbh-popwrap > *{--sp:32px}}
@container dbh (max-width:767px){body.single-db_vehicle .dbh-popwrap > *{--sp:16px}body.single-db_vehicle .dbh-popwrap .dbh-sec{padding-top:4px;padding-bottom:40px}}

/* ---------- Oct 25 HERO (Homepage Hero Part): desktop left layout ≥1024 · tablet 1c 768–1023 · phone 2d <768 ---------- */
.dbhx{position:relative;z-index:3;color:var(--color-d)}
.dbhx-top{position:relative;display:flex;align-items:center;min-height:512px;background:#2A2A2A}
.dbhx-photo{position:absolute;inset:0;overflow:hidden;background:var(--gray-300)}
.dbhx-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% center;display:block}
.dbhx-ov{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.5) 38%,rgba(0,0,0,.12) 62%,rgba(0,0,0,0) 80%)}
.dbhx-in{position:relative;z-index:1;width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:40px max(86px,calc((100% - var(--db-maxw,99999px)) / 2 + 86px))}
.dbhx-head{display:flex;flex-direction:column;gap:4px;max-width:760px}
.dbhx-eye{font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--on-photo-text,var(--color-d))}
.dbhx h1{margin:0;font-size:48px;font-weight:700;letter-spacing:-.03em;line-height:1.05;color:var(--hp-hero-text,var(--color-d));text-wrap:balance}
.dbhx-sub{margin:0;font-size:17px;line-height:1.5;color:var(--hp-hero-text,var(--color-d));text-wrap:pretty}
.dbhx-msub{display:none;font-size:15px;line-height:1.45;color:rgba(255,255,255,.92)}
.dbhx-dform{width:100%;max-width:480px;display:flex;flex-direction:column;align-items:stretch}
.dbhx-tabs{align-self:flex-start;display:flex;gap:2px;padding:3px;max-width:100%;border-radius:calc(var(--radius) * 2.4) calc(var(--radius) * 2.4) 0 0;background:rgba(20,18,19,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.dbhx-tabs button{flex:none;min-width:72px;min-height:32px;padding:0 14px;border:0;border-radius:calc(var(--radius) * 1.6);background:transparent;color:var(--hero-pills-text,var(--color-d));font:600 13px var(--font);white-space:nowrap;cursor:pointer;transition:background .15s}
.dbhx-tabs button:hover{background:rgba(255,255,255,.16)}
.dbhx-tabs button[aria-checked="true"]{background:var(--hero-pills-picked,var(--color-a));color:var(--hero-pills-picked-text,var(--color-d));font-weight:700;box-shadow:0 4px 12px -4px rgba(0,0,0,.45)}
.dbhx-bar{position:relative;z-index:3;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) auto;align-items:center;padding:8px;border-radius:0 calc(var(--radius) * 2.4) calc(var(--radius) * 2.4) calc(var(--radius) * 2.4);background:rgba(20,18,19,.62);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18),0 20px 44px -20px rgba(0,0,0,.6)}
.dbhx-dform > .dbhx-bar:first-child{border-radius:calc(var(--radius) * 2.4)}
.dbhx .dbhx-f{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:2px;min-width:0;min-height:46px;padding:2px 14px;border:0;cursor:pointer}
.dbhx .dbhx-f + .dbhx-f{border-left:1px solid rgba(255,255,255,.22)}
.dbhx-f > span{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.dbhx-f select{width:100%;height:32px;padding:0 26px 0 0;border:0;background:transparent;font:600 15px var(--font);color:#FFFFFF;-webkit-appearance:none;appearance:none;cursor:pointer}
.dbhx-f select option{color:var(--color-c)}
.dbhx-f > svg{position:absolute;right:14px;bottom:12px;pointer-events:none;color:var(--icon-color,var(--color-a))}
.dbhx .dbhx-f .dbl-dd-btn,.dbhx .dbhx-f .dbl-dd-btn.is-empty{width:100%;height:32px;padding:0 26px 0 0;border:0!important;border-radius:0;background:transparent;font:600 15px var(--font);color:#FFFFFF;box-shadow:none!important}
.dbhx .dbhx-f .dbl-dd-btn:focus-visible{outline:2px solid #FFFFFF;outline-offset:3px;border-radius:4px}
.dbhx .dbhx-f.is-open .dbl-dd-btn > span{text-decoration:underline;text-decoration-color:var(--color-a);text-decoration-thickness:2px;text-underline-offset:4px}
.dbhx .dbhx-f .dbl-dd-menu{left:0;min-width:240px;top:calc(100% + 8px)}
.dbhx-go{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-left:6px;padding:0 22px;border:0;border-radius:calc(var(--radius) * 1.6);background:var(--btn-primary,var(--color-a));color:var(--btn-primary-text,var(--color-d));font:700 16px var(--font);white-space:nowrap;cursor:pointer}
.dbhx-go:hover{background:var(--btn-primary-hover,var(--color-b))}
.dbhx-kw{position:relative;z-index:1;width:100%;max-width:340px;margin-top:12px;display:flex;align-items:center;gap:10px;height:42px;padding:0 16px;border:1px solid rgba(255,255,255,.35);border-radius:calc(var(--radius) * 2.4);background:rgba(20,18,19,.45);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#FFFFFF}
.dbhx-kw svg{flex:none}
.dbhx-kw input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;font:500 15px var(--font);color:#FFFFFF}
.dbhx-kw input::placeholder{color:rgba(255,255,255,.78)}
.dbhx-kw:focus-within{border-color:#FFFFFF}
.dbhx-find,.dbhx-tform{display:none}
.dbhx-sheet[hidden]{display:none}
@container dbh (min-width:1024px) and (max-width:1279px){
	.dbhx-top{min-height:400px}.dbhx-in{padding-left:max(62px,calc((100% - var(--db-maxw,99999px)) / 2 + 62px));padding-right:62px}
	.dbhx-eye{font-size:12px}.dbhx h1{font-size:40px}.dbhx-sub{font-size:16px}
}
@container dbh (max-width:1023px){
	.dbhx-top{display:block;height:300px;min-height:0;overflow:hidden}
	.dbhx-photo img{object-position:62% center}
	.dbhx-ov{background:linear-gradient(90deg,rgba(0,0,0,.7) 0%,rgba(0,0,0,.35) 50%,rgba(0,0,0,0) 85%)}
	.dbhx-in{position:absolute;inset:0;justify-content:center;padding:0 32px}
	.dbhx-head{max-width:460px}.dbhx-eye{font-size:12px}.dbhx h1{font-size:38px}
	.dbhx-sub,.dbhx-dform{display:none}.dbhx-msub{display:block}
	.dbhx-tform{display:flex;align-items:flex-end;gap:10px;padding:16px 32px 20px;background:var(--hp-panel,var(--color-d));border-bottom:1px solid var(--gray-200)}
	.dbhx-tform .dbhx-tf{flex:1}
	.dbhx-tgo{flex:none;height:46px;padding:0 18px;border:0;border-radius:calc(var(--radius) * 1.3);background:var(--btn-primary,var(--color-a));color:var(--btn-primary-text,var(--color-d));font:700 15px var(--font);white-space:nowrap;cursor:pointer}
	.dbhx-tgo:hover{background:var(--btn-primary-hover,var(--color-b))}
}
@container dbh (max-width:767px){
	.dbhx-top{height:420px}
	.dbhx-photo img{object-position:64% center}
	.dbhx-ov{background:linear-gradient(180deg,rgba(0,0,0,.2) 0%,rgba(0,0,0,.5) 100%)}
	.dbhx-in{inset:0 16px 80px;padding:0}
	.dbhx-eye{font-size:11px}.dbhx h1{font-size:32px}.dbhx-msub{font-size:14px}
	.dbhx-tform{display:none}
	.dbhx-find{position:absolute;left:12px;right:12px;bottom:14px;z-index:2;display:flex;align-items:center;gap:12px;height:60px;padding:0 8px 0 18px;border:0;border-radius:calc(var(--radius) * 2.4);background:var(--hp-panel,var(--color-d));box-shadow:0 12px 28px -12px rgba(0,0,0,.6);text-align:left;font-family:var(--font);cursor:pointer}
}
/* Shared field (tablet strip + phone sheet) */
.dbhx-tf{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0;font:700 12px var(--font);letter-spacing:.04em;text-transform:uppercase;color:var(--hp-muted,var(--gray-600))}
.dbhx-tf select{width:100%;height:46px;padding:0 30px 0 12px;box-sizing:border-box;border:1.5px solid var(--gray-300);border-radius:calc(var(--radius) * 1.3);background:var(--color-d);font:500 15px var(--font);color:var(--color-c);text-transform:none;letter-spacing:0;-webkit-appearance:none;appearance:none;cursor:pointer}
.dbhx-tf select:focus{border-color:var(--gray-600);outline:none;box-shadow:0 0 0 3px var(--gray-100)}
.dbhx-tf select:disabled{opacity:.6;cursor:default}
.dbhx-tf > svg{position:absolute;right:10px;bottom:14px;width:16px;height:16px;pointer-events:none;color:var(--icon-color,var(--color-a))}
.dbhx-find-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.dbhx-find-t strong{font-size:16px;line-height:1.2;color:var(--color-c)}
.dbhx-find-t span{font-size:12.5px;line-height:1.3;color:var(--gray-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dbhx-find-b{flex:none;display:flex;align-items:center;gap:6px;height:44px;padding:0 14px;border-radius:calc(var(--radius) * 1.3);background:var(--btn-primary,var(--color-a));color:var(--btn-primary-text,var(--color-d));font:700 14px var(--font)}
.dbhx-find-b svg{width:16px;height:16px}
/* Phone bottom sheet (moved to <body> by home.js so it covers the whole screen) */
.dbhx-sheet{position:fixed;inset:0;z-index:1100;font-family:var(--font)}
.dbhx-sheet-ov{position:absolute;inset:0;background:rgba(35,31,32,.5)}
.dbhx-sheet-p{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:10px;max-height:90vh;box-sizing:border-box;overflow:auto;padding:10px 16px calc(20px + env(safe-area-inset-bottom));border-radius:18px 18px 0 0;background:var(--hp-panel,var(--color-d));color:var(--color-c);box-shadow:0 -14px 30px -10px rgba(0,0,0,.35)}
.dbhx-sheet-p *{box-sizing:border-box}
.dbhx-grab{align-self:center;width:40px;height:4px;border-radius:2px;background:var(--gray-300)}
.dbhx-sheet-h{display:flex;align-items:center;justify-content:space-between}.dbhx-sheet-h strong{font-size:18px}
.dbhx-x{width:44px;height:44px;margin-right:-8px;border:0;border-radius:50%;background:none;color:var(--color-c);font:400 26px/1 var(--font);cursor:pointer}
.dbhx-sheet-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dbhx-sheet .dbhx-tf{gap:4px;font-size:11px}.dbhx-sheet .dbhx-tf select{height:48px}.dbhx-sheet .dbhx-tf > svg{bottom:16px}
.dbhx-skw{display:flex;align-items:center;gap:8px;height:48px;padding:0 12px;border:1.5px solid var(--gray-300);border-radius:calc(var(--radius) * 1.3);background:var(--color-d)}
.dbhx-skw svg{flex:none;width:16px;height:16px;color:var(--icon-color,var(--color-a))}
.dbhx-skw input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;font:400 16px var(--font);color:var(--color-c)}
.dbhx-skw:focus-within{border-color:var(--gray-600)}
.dbhx-sgo{height:52px;border:0;border-radius:calc(var(--radius) * 1.3);background:var(--btn-primary,var(--color-a));color:var(--btn-primary-text,var(--color-d));font:700 16px var(--font);cursor:pointer}
.dbhx-sgo:hover{background:var(--btn-primary-hover,var(--color-b))}

/* ---------- Oct 25 BUDGET SECTION = concept 1a (Homepage Finance Part, variant b) ---------- */
.dbbx{background:var(--hp-fin-bg,var(--color-d));padding:56px var(--sp)}
.dbbx-in{max-width:min(1272px,calc(var(--db-maxw,99999px) - 168px));margin:0 auto;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:56px;align-items:center}
.dbbx-photo{order:2;height:520px;border-radius:calc(var(--radius) * 3);overflow:hidden;background:var(--gray-300)}
.dbbx-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:62% center}
.dbbx-txt{order:1;display:flex;flex-direction:column;gap:20px;min-width:0}
.dbbx-head{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px}
.dbbx-ht{display:flex;flex-direction:column;gap:6px;min-width:0}
.dbbx-ht h2{margin:0;font-size:34px;font-weight:700;letter-spacing:-.03em;line-height:1.08;color:var(--color-c);text-wrap:balance}
.dbbx-ht p{margin:0;font-size:15px;line-height:1.5;color:var(--gray-700)}
.dbbx-pq{flex:none;align-self:flex-start;display:flex;align-items:center;min-height:44px;font:700 14px var(--font);color:var(--color-c)!important;text-decoration:underline;text-decoration-color:var(--color-a);text-decoration-thickness:2px;text-underline-offset:4px}
.dbbx-pq:hover{color:var(--color-a)!important}
.dbbx-pq-top{display:none}.dbbx-pq-bot{margin-top:-6px}
.dbbx-tabs{display:flex;gap:24px;border-bottom:1px solid var(--gray-300)}
.dbbx-tabs button{flex:none;min-height:44px;padding:0 2px;margin-bottom:-1px;border:0;border-bottom:3px solid transparent;background:none;color:var(--gray-600);font:600 14px var(--font);white-space:nowrap;cursor:pointer}
.dbbx-tabs button[aria-checked="true"]{border-bottom-color:var(--color-a);color:var(--color-c);font-weight:700}
.dbbx-f{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 10px}
.dbbx-fld{position:relative;display:flex;flex-direction:column;gap:5px;min-width:0;font-size:13px;font-weight:600;color:var(--color-c)}
.dbbx-in-w{display:flex;align-items:center;gap:4px;height:48px;padding:0 12px;border:1.5px solid var(--gray-300);border-radius:calc(var(--radius) * 1.3);background:var(--color-d)}
.dbbx-in-w i{font-style:normal;font-weight:600;color:var(--gray-600)}
.dbbx-in-w input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;font:500 16px var(--font);color:var(--color-c)}
.dbbx-in-w:focus-within{border-color:var(--color-a)}
.dbbx-sel select{width:100%;height:48px;padding:0 30px 0 12px;border:1.5px solid var(--gray-300);border-radius:calc(var(--radius) * 1.3);background:var(--color-d);font:500 15px var(--font);color:var(--color-c);-webkit-appearance:none;appearance:none;cursor:pointer}
.dbbx-sel select:focus{border-color:var(--color-a);outline:none}
.dbbx-sel > svg{position:absolute;right:10px;bottom:15px;width:16px;height:16px;pointer-events:none;color:var(--icon-color,var(--color-a))}
.dbbx-res{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 18px;border:1px solid var(--gray-200);border-radius:calc(var(--radius) * 2);background:var(--hp-alt,var(--gray-50))}
.dbbx-val{display:flex;align-items:center;gap:14px;min-width:0}
.dbbx-big{font-size:38px;font-weight:700;letter-spacing:-.03em;line-height:1;white-space:nowrap;color:var(--price,var(--color-a))}
.dbbx-vt{display:flex;flex-direction:column;gap:2px;min-width:0}
.dbbx-lbl{font-size:13px;font-weight:600;color:var(--gray-700)}
.dbbx-apr{font-size:12.5px;color:var(--gray-600)}
.dbbx-shop{flex:none;display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:calc(var(--radius) * 1.3);background:var(--btn-primary,var(--color-a));color:var(--btn-primary-text,var(--color-d))!important;font:700 15px var(--font);text-decoration:none;white-space:nowrap}
.dbbx-shop:hover{background:var(--btn-primary-hover,var(--color-b))}
@container dbh (max-width:1279px){
	.dbbx{padding:40px 40px 44px}
	.dbbx-in{grid-template-columns:minmax(0,1fr);gap:24px}
	.dbbx-photo{order:0;height:260px}
	.dbbx-txt{gap:18px}
	.dbbx-head{flex-direction:row;align-items:flex-end}
	.dbbx-ht h2{font-size:28px}
	.dbbx-pq-top{display:flex}.dbbx-pq-bot{display:none}
	.dbbx-f{grid-template-columns:repeat(4,minmax(0,1fr))}
	.dbbx-big{font-size:34px}
}
@container dbh (max-width:767px){
	.dbbx{padding:0 0 28px}
	.dbbx-photo{height:220px;border-radius:0}
	.dbbx-txt{padding:0 16px}
	.dbbx-head{flex-direction:column;align-items:flex-start}
	.dbbx-ht h2{font-size:24px}.dbbx-ht p{font-size:14.5px}
	.dbbx-pq-top{display:none}.dbbx-pq-bot{display:flex;align-self:center}
	.dbbx-f{grid-template-columns:repeat(2,minmax(0,1fr))}
	.dbbx-res{flex-direction:column;align-items:stretch}
	.dbbx-big{font-size:32px}
}

/* Oct 26 APPROVED 4a: phone/tablet hero sheet pick list */
.dbhx-pk-main,.dbhx-pk-list{display:flex;flex-direction:column;gap:10px;min-height:0}
.dbhx-pk-main[hidden],.dbhx-pk-list[hidden],.dbhx-pk-src[hidden],.dbhx-pk-q[hidden]{display:none!important}
.dbhx-sheet-h{min-height:52px;border-bottom:1px solid var(--gray-200)}.dbhx-sheet-h strong{outline:none}
.dbhx-pk-rows{display:flex;flex-direction:column}
.dbhx-pk-row{display:flex;align-items:center;gap:8px;min-height:56px;padding:0 2px;border:0;border-bottom:1px solid var(--gray-100);background:none;font:400 16px var(--font);color:var(--color-c);text-align:left;cursor:pointer}
.dbhx-pk-row > span{flex:1;font-weight:600}
.dbhx-pk-row em{max-width:170px;font-style:normal;font-size:15px;font-weight:500;color:var(--gray-600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dbhx-pk-row em.is-on{font-weight:700;color:var(--color-c)}
.dbhx-pk-row svg{flex:none;color:var(--gray-500,#8A8A8A)}
.dbhx-pk-row:disabled{color:var(--gray-500,#8A8A8A);cursor:default}.dbhx-pk-row:disabled em{color:var(--gray-500,#8A8A8A)}
.dbhx-pk-h{display:flex;align-items:center;gap:4px;min-height:52px;border-bottom:1px solid var(--gray-200)}.dbhx-pk-h strong{flex:1;font-size:18px;outline:none}
.dbhx-pk-back{width:44px;height:44px;margin-left:-10px;border:0;background:none;color:var(--color-c);display:flex;align-items:center;justify-content:center;cursor:pointer}
.dbhx-pk-q{display:flex;align-items:center;gap:8px;height:46px;padding:0 12px;border-radius:calc(var(--radius) * 1.3);background:var(--gray-100);color:var(--gray-600)}.dbhx-pk-q input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:400 16px var(--font);color:var(--color-c)}
.dbhx-pk-opts{display:flex;flex-direction:column;max-height:60vh;overflow:auto}
.dbhx-pk-g{padding:14px 4px 4px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-600)}
.dbhx-pk-o{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 4px;border:0;border-bottom:1px solid var(--gray-100);background:none;font:500 16px var(--font);color:var(--color-c);text-align:left;cursor:pointer}
.dbhx-pk-o.is-on{font-weight:700}.dbhx-pk-o small{font-size:13px;color:var(--gray-600)}
.dbhx-pk-o i{flex:none;margin-left:auto;width:20px;height:20px;box-sizing:border-box;border-radius:50%;border:2px solid var(--gray-300)}.dbhx-pk-o.is-on i{border:6px solid var(--icon-color,var(--color-a))}

/* Cars on Sale – same container/side padding as Featured Vehicles; tight gap after Featured */
.dbh-sale.is-after-feat{padding-top:0!important}
.dbh-feat:has(+ .dbh-sale.is-after-feat){padding-bottom:16px!important}
@container dbh (max-width:767px){.dbh-feat:has(+ .dbh-sale.is-after-feat){padding-bottom:12px!important}}

/* ===== Live style editor – Step 0b (Oct 28): HOMEPAGE → settings. Fallbacks = today's colors. ===== */
.dbh-btn{background:var(--btn-primary,var(--color-a));color:var(--btn-primary-text,var(--color-d))}
.dbh-ulink svg,.dbh-chev{color:var(--icon-color,var(--color-a))}
.dbh-stars{color:var(--star,var(--color-a))}.dbh-pop-tabs button[aria-selected="true"]{background:var(--pill-active-background,var(--color-c));color:var(--pill-active-text,var(--color-d))}
.dbh-rev-btn,.dbh-pop-more{border-color:var(--btn-outline-border,var(--color-c))!important;background:var(--btn-outline-bg,transparent)!important;color:var(--btn-outline-text,var(--color-c))!important}

/* 0b Homepage (Oct 28): slider arrows – Background / Border / Icon (+ hover border). Fallback = today. */
.dbh-arrows button{background:var(--slider-arrow-bg,var(--color-d));border-color:var(--slider-arrow-border,var(--gray-300));color:var(--slider-arrow-icon,var(--hp-head,var(--color-c)))}
.dbh-arrows button:hover{border-color:var(--slider-arrow-border-hover,var(--hp-head,var(--color-c)))}
/* 0b Homepage (Oct 28): photo-block buttons (Trade-in / Sell your car) – own setting, one for both blocks */
.dbh-promo-btn{background:var(--hp-promo-btn,#fff);color:var(--hp-promo-btn-text,var(--color-c))!important}
.dbh-promo-btn:hover{background:var(--hp-promo-btn-hover,var(--btn-primary,var(--color-a)));color:var(--hp-promo-btn-hover-text,var(--btn-primary-text,var(--color-d)))!important}
/* 0b Homepage hero (Oct 28): dropdown chevrons + condition pills (New/Used/All) – own settings, fallbacks = today */
.dbhx .dbh-chev,.dbhx .dbh-f-sel > svg,.dbhx .dbbx-sel > svg{color:var(--hero-field-icons,var(--icon-color,var(--color-a)))}
/* 0b Homepage (Oct 28): small titles – on light (follow Main) + on dark/photo (follow Light) – and Popular searches picked tab */
.dbh-eye{color:var(--eyebrow,var(--color-a))}

.dbh-pop-tabs button[aria-selected="true"]{border-color:var(--pop-tab-on,var(--pill-active-background,var(--color-c)));background:var(--pop-tab-on,var(--pill-active-background,var(--color-c)));color:var(--pop-tab-on-text,var(--pill-active-text,var(--color-d)))}
/* 0b Homepage (Oct 28, approved): ONE setting "Text on photos" (--on-photo-text, follows Light) for all text on the hero + photo blocks. Faded text keeps its fade. */
.dbhx,.dbhx h1,.dbhx-eye,.dbh-promo-txt,.dbh-promo-txt h2,.dbh-promo-txt > span,.dbhx-f select,.dbhx .dbhx-f .dbl-dd-btn,.dbhx .dbhx-f .dbl-dd-btn.is-empty,.dbhx-kw input{color:var(--on-photo-text,var(--color-d))}
.dbh-promo-txt p{color:color-mix(in srgb,var(--on-photo-text,#fff) 92%,transparent)}
.dbhx-msub{color:color-mix(in srgb,var(--on-photo-text,#fff) 92%,transparent)}
.dbhx-f > span{color:color-mix(in srgb,var(--on-photo-text,#fff) 72%,transparent)}
.dbhx-kw input::placeholder{color:color-mix(in srgb,var(--on-photo-text,#fff) 78%,transparent)}
/* 0b Homepage hero (Oct 28): New / Used / All pills – Background, Picked, Text (fallbacks = today) */
.dbhx-tabs{background:var(--hero-pills-track,rgba(20,18,19,.62))}
.dbhx-tabs button[aria-checked="false"]{color:var(--hero-pills-text,var(--color-d))}
.dbhx-tabs button[aria-checked="true"]{background:var(--hero-pills-picked,var(--color-a));color:var(--hero-pills-picked-text,var(--color-d))}

/* ---------- Step 3 (Oct 31): HERO B + HERO C (picker: Customizer › Layout › Homepage hero). Shared light-card pieces = .dbhy-*. Breakpoints from the .dbh container width. ---------- */
.dbhy{position:relative;z-index:3;color:var(--color-c);background:var(--hp-bg,var(--color-d))}
.dbhy-eye{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--eyebrow,var(--color-a))}
.dbhy .dbhy-onphoto[data-role="headings"]{color:var(--on-photo-text,#FFFFFF)}
.dbhy-kw{position:relative;display:block;flex:1;min-width:0}
.dbhy-kw > svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--gray-600);pointer-events:none}
.dbhy-kw input{width:100%;height:48px;padding:0 12px 0 40px;border:1px solid var(--gray-300);border-radius:10px;font:400 15px var(--font);color:var(--color-c);background:var(--color-d)}
.dbhy-kw input::placeholder{color:var(--gray-600)}
.dbhy-kw input:focus,.dbhy select:focus{outline:none;border-color:var(--field-focus,var(--color-a));box-shadow:0 0 0 3px color-mix(in srgb,var(--field-focus,var(--color-a)) 18%,transparent)}
.dbhy-go{flex:none;display:flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border:0;border-radius:10px;background:var(--hp-btn,var(--btn-primary,var(--color-a)));color:var(--hp-btn-text,var(--btn-primary-text,var(--color-d)));font:700 15px var(--font);white-space:nowrap;cursor:pointer}
.dbhy-go:hover{background:var(--hp-btn-hover,var(--btn-primary-hover,var(--color-b)))}
.dbhy .dbh-f-sel{border-left:0}
.dbhy select{width:100%;height:44px;padding:0 32px 0 12px;border:1px solid var(--gray-300);border-radius:10px;font:400 15px var(--font);color:var(--color-c);background:var(--color-d);-webkit-appearance:none;appearance:none;cursor:pointer}
.dbhy .dbh-f-sel .dbl-dd-btn{height:44px;border-width:1px;border-radius:10px}
.dbhy-chev{position:absolute;right:10px;bottom:13px;display:flex;color:var(--hero-card-icons,var(--color-c));pointer-events:none;transition:transform .15s}
.dbhy .dbh-f-sel.is-open .dbhy-chev{transform:rotate(180deg)}
.dbhy-pills{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;padding:4px;border-radius:12px;background:var(--gray-100)}
.dbhy-pills button{min-height:44px;padding:0 12px;border:0;border-radius:9px;background:transparent;color:var(--color-c);font:700 14px var(--font);white-space:nowrap;cursor:pointer}
.dbhy-pills button[aria-checked="false"]:hover{background:var(--color-d)}
.dbhy-pills button[aria-checked="true"]{background:var(--hero-pills-picked,var(--color-a));color:var(--hero-pills-picked-text,var(--color-d))}
.dbhy-ff{position:relative;display:block;min-width:0}
.dbhy-ff > span:first-child{position:absolute;left:10px;top:-8px;z-index:2;padding:0 4px;background:var(--color-d);font-size:11.5px;line-height:16px;color:var(--gray-600);pointer-events:none}
.dbhy .dbhy-ff select,.dbhy .dbhy-ff .dbl-dd-btn{height:48px;border-radius:12px}
.dbhy-ff .dbhy-chev{top:15px;bottom:auto}
.dbhy-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
/* Hero B */
.dbhb{padding:16px 32px}
.dbhb-wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr);max-width:var(--db-maxw,none);margin:0 auto}
.dbhb-photo{grid-area:1 / 1;position:relative;min-height:480px;border-radius:24px;overflow:hidden;background:var(--gray-300)}
.dbhb-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:75% center;display:block}
.dbhb-ov,.dbhb-ptxt,.dbhb-pform{display:none}
.dbhb-cardw{grid-area:1 / 1;align-self:center;position:relative;z-index:2;display:flex;padding:32px 0 32px 40px}
.dbhb-card{width:100%;max-width:500px;display:flex;flex-direction:column;gap:16px;padding:24px;border-radius:20px;background:var(--hb-card-glass,rgba(255,255,255,.9));-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 18px 48px -18px rgba(0,0,0,.35)}
.dbhb-head{display:flex;flex-direction:column;gap:6px}
.dbhb-card h1{margin:0;font-size:40px;font-weight:700;letter-spacing:-.03em;line-height:1.05;text-wrap:balance}
.dbhb-sub{margin:0;font-size:15px;line-height:1.5;color:var(--gray-700)}
.dbhb-kwrow{display:flex;gap:8px}
.dbhb-sels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.dbhb-sels.is-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.dbhb-fld{position:relative;display:flex;flex-direction:column;gap:4px;min-width:0}
.dbhb-fld > span:first-child{font-size:12px;font-weight:700;color:var(--color-c)}
.dbhb-fld.has-dd select{top:auto;height:44px}
/* Hero C */
.dbhc{padding:16px 32px 32px}
.dbhc-wrap{display:flex;flex-direction:column;max-width:var(--db-maxw,none);margin:0 auto}
.dbhc-media{position:relative;container-type:size;height:560px;border-radius:24px;overflow:hidden;background:var(--gray-300)}
.dbhc-media img,.dbhc-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center;display:block}
.dbhc-media iframe{position:absolute;left:50%;top:50%;width:max(100%,177.78cqh);height:max(100%,56.25cqw);transform:translate(-50%,-50%);border:0;pointer-events:none}
.dbhc-ov{position:absolute;inset:0;background:linear-gradient(20deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.25) 55%,rgba(0,0,0,0) 80%);pointer-events:none}
.dbhc-play{position:absolute;top:14px;right:14px;z-index:2;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:50%;background:rgba(0,0,0,.5);color:#FFFFFF;cursor:pointer}
.dbhc-play:hover{background:rgba(0,0,0,.7)}
.dbhc-play [hidden]{display:none}
.dbhc-play > span{display:flex}
.dbhc-txt{position:absolute;left:48px;right:48px;bottom:84px;z-index:1;display:flex;flex-direction:column;gap:8px;max-width:640px;color:var(--on-photo-text,#FFFFFF)}
.dbhc-txt .dbhy-eye,.dbhb-ptxt .dbhy-eye{font-size:13px;color:inherit}
.dbhc-txt h1{margin:0;font-size:48px;font-weight:700;letter-spacing:-.03em;line-height:1.05;text-wrap:balance}
.dbhc-sub{font-size:17px;line-height:1.45}
.dbhc-form{position:relative;z-index:2;margin:-52px 48px 0;display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1fr) minmax(0,1.05fr) auto;gap:12px;align-items:end;padding:14px;border-radius:18px;background:var(--color-d);box-shadow:0 16px 36px -16px rgba(0,0,0,.4),0 0 0 1px var(--gray-200)}
.dbhc-form.no-cond{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.6fr) auto}
.dbhc .dbhy-pills{grid-auto-columns:auto;padding:2px}
.dbhc .dbhy-pills button{padding:0 20px}
.dbhc .dbhy-kw input{border-radius:12px}
.dbhc-go{height:48px;padding:0 22px;border-radius:12px;font-size:16px}
@container dbh (min-width:1024px) and (max-width:1279px){
	.dbhc-txt h1{font-size:40px}.dbhc-sub{font-size:16px}.dbhc-txt .dbhy-eye{font-size:12px}
}
@container dbh (max-width:1023px){
	.dbhb{padding:16px 24px}
	.dbhb-photo{min-height:440px}
	.dbhb-cardw{padding:24px 0 24px 24px}
	.dbhb-card{max-width:440px}
	.dbhb-card h1{font-size:32px}
	.dbhc{padding:16px 24px 24px}
	.dbhc-media{height:440px}
	.dbhc-txt{left:32px;right:32px;bottom:76px}
	.dbhc-txt h1{font-size:40px}.dbhc-sub{font-size:16px}
	.dbhc-form,.dbhc-form.no-cond{margin:-48px 24px 0;padding:16px;gap:14px 12px;grid-template-columns:repeat(3,minmax(0,1fr))}
	.dbhc .dbhy-pills{grid-column:1 / -1;grid-auto-columns:minmax(0,1fr);padding:4px}
	.dbhc .dbhy-pills button{padding:0 12px}
	.dbhc-kw{grid-column:1 / -1;grid-row:3}.dbhc-go{grid-column:3;grid-row:2}
	.dbhc-form.no-cond .dbhc-kw{grid-row:2}.dbhc-form.no-cond .dbhc-go{grid-row:1}
}
@container dbh (max-width:767px){
	.dbhb{padding:12px 12px 20px}
	.dbhb-wrap{display:flex;flex-direction:column}
	.dbhb-photo{min-height:0;height:300px;border-radius:20px}
	.dbhb-photo img{object-position:70% center}
	.dbhb-cardw{display:none}
	.dbhb-ov{display:block;position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.72) 100%)}
	.dbhb-ptxt{display:flex;position:absolute;left:18px;right:18px;bottom:66px;z-index:1;flex-direction:column;gap:4px;font-size:14px;color:var(--on-photo-text,#FFFFFF)}
	.dbhb-ptxt .dbhy-eye{font-size:11px}
	.dbhb-ptxt h1{margin:0;font-size:32px;font-weight:700;letter-spacing:-.03em;line-height:1.05}
	.dbhb-pform{display:flex;position:relative;z-index:2;margin:-48px 10px 0;flex-direction:column;gap:14px;padding:16px;border-radius:18px;background:var(--color-d);box-shadow:0 16px 36px -16px rgba(0,0,0,.4),0 0 0 1px var(--gray-200)}
	.dbhb-pform .dbhy-go{width:100%;height:50px;border-radius:12px;font-size:16px}
	.dbhb-pform .dbhy-kw input{border-radius:12px}
	.dbhy-kw input,.dbhy select{font-size:16px}
	.dbhc{padding:12px 12px 20px}
	.dbhc-media{height:320px;border-radius:20px}
	.dbhc-ov{background:linear-gradient(0deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.25) 55%,rgba(0,0,0,0) 80%)}
	.dbhc-txt{left:18px;right:18px;bottom:64px;gap:4px}
	.dbhc-txt .dbhy-eye{font-size:11px}.dbhc-txt h1{font-size:32px}.dbhc-sub{font-size:14px}
	.dbhc-form,.dbhc-form.no-cond{margin:-48px 10px 0;gap:14px 10px;grid-template-columns:repeat(2,minmax(0,1fr))}
	.dbhc-kw,.dbhc-go,.dbhc-form.no-cond .dbhc-kw,.dbhc-form.no-cond .dbhc-go{grid-column:1 / -1;grid-row:auto}
	.dbhc-go{height:50px}
}

/* Oct 31 (user): Hero B search card – left edge lines up with the sections below ("Shop by body style" etc.). Photo stays wider. */
.dbhb{--hbp:32px}
.dbhb-cardw{padding-left:calc(max(var(--sp,84px), (100cqw - var(--db-maxw,99999px)) / 2 + 84px) - max(var(--hbp), (100cqw - var(--db-maxw,99999px)) / 2))!important}
@container dbh (max-width:1023px){.dbhb{--hbp:24px}}
/* Oct 31 (user): Hero C – search bar + text line up with the page sections below (photo/video stays wider) */
.dbhc{--hbp:32px;--hcx:calc(max(var(--sp,84px), (100cqw - var(--db-maxw,99999px)) / 2 + 84px) - max(var(--hbp), (100cqw - var(--db-maxw,99999px)) / 2))}
@container dbh (min-width:1024px){.dbhc-form,.dbhc-form.no-cond{margin-left:var(--hcx)!important;margin-right:var(--hcx)!important}.dbhc-txt{left:var(--hcx)!important;right:var(--hcx)!important}}
@container dbh (max-width:1023px){.dbhc{--hbp:24px}}
/* Oct 31 (user): Hero C – search bar sits BELOW the photo/video (no overlap) on tablet + desktop; phone unchanged */
@container dbh (min-width:768px){.dbhc-form,.dbhc-form.no-cond{margin-top:20px!important}.dbhc-txt{bottom:48px!important}}
@container dbh (min-width:768px) and (max-width:1023px){.dbhc-form,.dbhc-form.no-cond{margin:16px 0 0!important}.dbhc-txt{bottom:40px!important}}
/* Oct 31 (user): Hero C condition pills – equal widths (All no longer narrow), unselected = white with thin gray outline on the gray track, 48px total like the fields */
.dbhc .dbhy-pills{padding:4px!important;gap:4px}
.dbhc .dbhy-pills button{min-height:40px;height:40px}
.dbhc .dbhy-pills button[aria-checked="false"]{background:var(--color-d);box-shadow:inset 0 0 0 1px var(--gray-200)}
.dbhc .dbhy-pills button[aria-checked="false"]:hover{box-shadow:inset 0 0 0 1px var(--gray-400,#B5B5B5)}
@container dbh (min-width:1024px){.dbhc .dbhy-pills{grid-auto-columns:minmax(76px,1fr)}.dbhc .dbhy-pills button{padding:0 14px}}
/* Oct 31 (user): Hero C desktop – photo/video contained to the page content width (same as the sections + search bar); text 48px inside the photo */
@container dbh (min-width:1024px){
	.dbhc{padding-left:var(--sp,84px)!important;padding-right:var(--sp,84px)!important}
	.dbhc-wrap{max-width:calc(var(--db-maxw,99999px) - 168px)!important}
	.dbhc-form,.dbhc-form.no-cond{margin-left:0!important;margin-right:0!important}
	.dbhc-txt{left:48px!important;right:48px!important}
}
/* Oct 31 (user): Hero C search bar – lighter shadow; less space under the bar before "Shop by body style" */
.dbhc-form,.dbhc-form.no-cond{box-shadow:0 6px 16px -10px rgba(0,0,0,.18),0 0 0 1px var(--gray-200)!important}
@container dbh (min-width:768px){.dbhc{padding-bottom:0!important}}

/* Nov 2 (user): Hero B + C phones – same "Find your car" bar + bottom sheet as Hero A (native dropdown forms hidden on phones) */
.dbhy .dbhy-find{display:none}
@media (max-width:767px){
.dbhy .dbhb-pform,.dbhy .dbhc-form{display:none!important}
.dbhy .dbhy-find{display:flex!important;position:relative;left:auto;right:auto;bottom:auto;z-index:3;width:calc(100% - 24px);margin:-34px 12px 0;box-sizing:border-box}
}

/* Nov 2: Customizer "Homepage hero" – Shop Vehicles button, keyword box, tabs, arrows */
.dbhx-go{background:var(--hero-btn,var(--btn-primary,var(--color-a)));color:var(--hero-btn-text,var(--btn-primary-text,var(--color-d)))}
.dbhx-go:hover{background:var(--hero-btn,var(--btn-primary-hover,var(--color-b)));filter:brightness(.92)}
.dbhx-kw{background:color-mix(in srgb,var(--hero-kw-bg,#141213) 45%,transparent);color:var(--hero-kw-text,#FFFFFF)}
.dbhx-kw input{color:var(--hero-kw-text,#FFFFFF)}
.dbhx-kw input::placeholder{color:var(--hero-kw-text,#FFFFFF);opacity:.78}
.dbhx-tabs,.dbhx-bar{background:var(--hero-box-bg,rgba(20,18,19,.62))}
.dbhx-f > svg{color:var(--hero-field-icons,var(--icon-color,var(--color-a)))}

/* Nov 4 (user): search icon sat on top of the placeholder in the keyword box (Trade-in "Find the car you want" + heroes B/C) */
html body .dbhy-kw{position:relative!important;display:block}
html body .dbhy-kw > svg{position:absolute!important;left:14px!important;top:50%!important;transform:translateY(-50%)!important;width:18px;height:18px;z-index:1;margin:0!important}
html body .dbhy-kw input{padding-left:42px!important}