/* New home page; shares tokens with the car page (overrides.css): #3d63b7, #23292E, #eef1f9, 12px radius */

/* Hero: quick search + financing */
.home-hero { background: linear-gradient(135deg, #eef1f9 0%, #dfe6f5 100%); padding: 2.5rem 0 3rem; }
.home-hero__grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 1.5rem; align-items: stretch; }
.home-search { background: #fff; border-radius: 16px; padding: 2rem; box-shadow: 0 10px 40px rgba(29, 43, 79, .08); }
.home-search__title { font-size: 1.75rem; font-weight: 600; color: #121212; margin: 0 0 .25rem; }
.home-search__lead { color: #626262; margin: 0 0 1.5rem; }
.home-search__fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.home-field { display: flex; flex-direction: column; gap: .35rem; grid-column: span 2; margin: 0; }
.home-field--half { grid-column: span 1; }
.home-field > span { font-size: .875rem; color: #23292E; font-weight: 500; }
.home-field .form-select, .home-field .form-control { height: 46px; border-radius: 8px; padding: .5rem 2.25rem .5rem .85rem; background-position: right .75rem center; font-size: .9375rem; }
.home-field .form-control { padding-right: .85rem; }
.home-search__actions { display: flex; justify-content: flex-end; align-items: center; gap: 1.5rem; margin-top: 1.5rem; }
.home-search__more { color: #3d63b7; text-decoration: underline; white-space: nowrap; }
.home-search__submit { min-width: 180px; padding: .8rem 1.5rem; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }

.home-finance { display: flex; flex-direction: column; gap: .75rem; background: #23292E; color: #fff; border-radius: 16px; padding: 2rem;
    text-decoration: none; position: relative; overflow: hidden; }
.home-finance::after { content: ''; position: absolute; right: -60px; bottom: -60px; width: 220px; height: 220px; border-radius: 50%;
    background: radial-gradient(circle, rgba(61, 99, 183, .55) 0%, rgba(61, 99, 183, 0) 70%); }
.home-finance:hover { color: #fff; }
.home-finance__label { font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #a9bbe6; }
.home-finance__title { font-size: 1.5rem; font-weight: 600; line-height: 1.25; }
.home-finance__text { color: #cfd6e4; font-size: .9375rem; }
.home-finance__list { display: flex; flex-direction: column; gap: .35rem; font-size: .9375rem; }
.home-finance__cta { margin-top: auto; align-self: flex-start; position: relative; z-index: 1; font-weight: 600; }

/* Services */
.home-services { padding: 3rem 0 1rem; }
.home-services__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.home-service { display: flex; gap: 1rem; background: #fff; border: 1px solid #e4e8f0; border-radius: 12px; padding: 1.5rem; color: inherit;
    text-decoration: none; transition: border-color .2s ease, box-shadow .2s ease; }
.home-service:hover { color: inherit; border-color: var(--accent); box-shadow: 0 10px 30px rgba(15, 23, 42, .08); }
.home-service__icon { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--accent); }
.home-service__icon svg { width: 20px; height: 20px; }
.home-service__body { display: flex; flex-direction: column; gap: .4rem; min-width: 0; }
.home-service__title { font-size: 1.125rem; font-weight: 600; color: #121212; }
.home-service__text { color: #626262; font-size: .9375rem; }
.home-service__features { display: flex; flex-wrap: wrap; gap: .35rem; margin: .25rem 0; }
.home-service__features span { background: #f5f7fc; color: #23292E; border-radius: 6px; padding: .15rem .5rem; font-size: .8125rem; }
.home-service__link { color: #3d63b7; font-weight: 600; font-size: .9375rem; margin-top: auto; padding-top: .25rem; }

/* Categories */
.home-bodies { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 1rem; }
.home-body { display: flex; flex-direction: column; gap: .25rem; background: #fff; border-radius: 12px; padding: 1.1rem 1.25rem; color: inherit;
    text-decoration: none; border: 1px solid transparent; transition: border-color .2s ease; }
.home-body:hover { color: inherit; border-color: #3d63b7; }
.home-body__icon { width: 64px; height: 30px; color: #3d63b7; margin-bottom: .5rem; }
.home-body:hover .home-body__icon { color: #23292E; }
.home-body__name { font-weight: 600; color: #121212; }
.home-body__count { color: #626262; font-size: .875rem; }
.home-makes { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; }
.home-make { display: flex; align-items: center; gap: .75rem; background: #fff; border-radius: 12px; padding: .85rem 1rem; color: inherit;
    text-decoration: none; border: 1px solid transparent; transition: border-color .2s ease; }
.home-make:hover { color: inherit; border-color: #3d63b7; }
.home-make img { width: 44px; height: 36px; object-fit: contain; }
.home-make.is-extra { display: none; }
.home-makes.is-open .home-make.is-extra { display: flex; }
.home-make__initial { width: 36px; height: 36px; border-radius: 50%; background: #eef1f9; color: #3d63b7; display: grid; place-items: center; font-weight: 700; }
.home-make__name { font-weight: 600; font-size: .9375rem; color: #121212; flex: 1; min-width: 0; line-height: 1.2; }
.home-make__count { color: #626262; font-size: .875rem; }

/* Carousels */
.home-carousel__controls { display: flex; align-items: center; gap: .5rem; }
.home-carousel__arrow { width: 42px; height: 42px; border-radius: 50%; border: 1px solid #d5dbe8; background: #fff; color: #23292E; display: grid; place-items: center; }
.home-carousel__arrow:disabled { opacity: .35; }
.home-carousel__track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 4.5rem) / 4); gap: 1.5rem; overflow-x: auto;
    scroll-snap-type: x mandatory; scrollbar-width: none;
    /* Room inside the scroll box for the card shadow and hover lift, which overflow clipped */
    padding: 10px 12px 28px; margin: -10px -12px -28px; scroll-padding: 0 12px; }
.home-carousel__track::-webkit-scrollbar { display: none; }
.home-carousel__track > * { scroll-snap-align: start; }

/* Buyback */
.home-buyback__box { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 2rem; align-items: center; background: #fff;
    border-radius: 16px; padding: 2.25rem; box-shadow: 0 1px 2px rgba(15, 23, 42, .04); }
.home-buyback__label, .home-order__label { font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #3d63b7; }
.home-buyback__title { font-size: 1.75rem; font-weight: 600; color: #121212; margin: .5rem 0; }
.home-buyback__text { color: #626262; margin: 0; }
.home-buyback__form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; align-items: end; }
.home-buyback__submit { grid-column: span 4; padding: .85rem 1.5rem; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }

/* Order banner */
.home-order__box { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #fff; border-radius: 16px; overflow: hidden;
    color: inherit; text-decoration: none; transition: box-shadow .2s ease; }
.home-order__box:hover { color: inherit; box-shadow: 0 10px 30px rgba(15, 23, 42, .10); }
.home-order__box img { width: 100%; height: 100%; object-fit: cover; min-height: 260px; }
.home-order__content { display: flex; flex-direction: column; gap: .75rem; padding: 2.25rem; justify-content: center; }
.home-order__title { font-size: 1.75rem; font-weight: 600; color: #121212; line-height: 1.25; }
.home-order__text { color: #626262; }
.home-order__cta { align-self: flex-start; font-weight: 600; }

@media (max-width: 1199.98px) {
    .home-carousel__track { grid-auto-columns: calc((100% - 3rem) / 3); }
    .home-services__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    .home-hero__grid, .home-buyback__box, .home-order__box { grid-template-columns: 1fr; }
    .home-carousel__track { grid-auto-columns: calc((100% - 1.5rem) / 2); }
}
@media (max-width: 767.98px) {
    .home-hero { padding: 1.25rem 0 2rem; }
    .home-search, .home-finance, .home-buyback__box, .home-order__content { padding: 1.25rem; }
    .home-search__title, .home-buyback__title, .home-order__title { font-size: 1.375rem; }
    .home-services__grid { grid-template-columns: 1fr; }
    .home-search__fields, .home-buyback__form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-buyback__submit { grid-column: span 2; }
    .home-search__actions { justify-content: space-between; }
    .home-carousel__track { grid-auto-columns: 80%; gap: 1rem; }
    .home-carousel__arrow { display: none; }
    .home-makes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .home-bodies { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Make/model comboboxes */
.home-combo { position: relative; }
.home-combo > label { font-size: .875rem; color: #23292E; font-weight: 500; margin: 0; }
.home-combo__input { padding-right: 2.25rem !important; background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") no-repeat right .75rem center / 14px 10px; }
.home-combo__input:disabled { background-color: #e9ecef; }
.home-combo__list { position: absolute; z-index: 20; top: 100%; left: 0; right: 0; margin: 4px 0 0; padding: 4px 0; list-style: none; background: #fff;
    border: 1px solid #d5dbe8; border-radius: 8px; box-shadow: 0 12px 30px rgba(15, 23, 42, .12); max-height: 280px; overflow-y: auto; }
.home-combo__list li { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem .85rem; cursor: pointer; font-size: .9375rem; color: #23292E; }
.home-combo__list li span { color: #8a8a8a; font-size: .875rem; }
.home-combo__list li:hover, .home-combo__list li.is-active { background: #eef1f9; }
.home-combo__list li.is-empty { color: #8a8a8a; cursor: default; background: none; }