:root {
  --ink: #171c24;
  --muted: #707783;
  --surface: #fff;
  --canvas: #f4f4f2;
  --line: #e6e5e2;
  --accent: #c82535;
  --accent-dark: #a51929;
  --dark: #10151d;
  font-family: "Segoe UI", Arial, sans-serif;
}

html, body { max-width: 100%; overflow-x: hidden; overflow-x: clip; overscroll-behavior-x: none; }
body { background: var(--canvas); color: var(--ink); }
button, input, select, textarea { font-family: inherit; }
button { transition: background .2s, border-color .2s, color .2s, transform .2s, box-shadow .2s; }
.primary { background: var(--accent); border-color: var(--accent); box-shadow: none; }
.primary:hover { background: var(--accent-dark); border-color: var(--accent-dark); box-shadow: 0 8px 22px #a519292b; }

header {
  min-height: 72px;
  padding: 9px max(4vw, 20px);
  background: #10151df7;
  border-bottom: 1px solid #ffffff17;
  box-shadow: 0 8px 30px #0e15201c;
}
.logo { flex: 0 0 auto; }
.header-logo-image { display: block; width: auto; height: 52px; }
.logo-mark { width: 42px; height: 42px; border-radius: 11px; background: var(--accent); box-shadow: none; }
.logo-mark svg { width: 32px; height: 32px; }
.logo-type > span, .offer-brand span { color: #e84552; }
.nav { margin-left: 8px; color: #9ca5b4; font-size: 12px; letter-spacing: 2px; }
.account-actions { gap: 10px; }
.account-actions button { min-height: 40px; padding-inline: 15px; }
#favorites { display: flex; align-items: center; gap: 7px; background: transparent; border-color: #586170; color: #f5f6f8; }
#favorites > span { color: #f28b94; font-size: 20px; line-height: 1; }
#favorites strong { display: grid; place-items: center; min-width: 21px; height: 21px; padding: 0 6px; border-radius: 20px; background: #2c3440; color: #fff; font-size: 11px; }
#favorites:hover, #favorites.active { background: #ffffff12; border-color: #b9c0cc; }
#favorites.has-favorites > span { color: #f05260; }
#favorites.has-favorites strong { background: var(--accent); }
#account { background: transparent; border-color: #586170; color: #f5f6f8; }
#account:hover { background: #ffffff12; border-color: #b9c0cc; }
#headerLogout { display: none !important; background: transparent; border-color: transparent; color: #b8c0cc; padding-inline: 10px; }
#headerLogout:hover { background: #ffffff0d; border-color: #586170; color: #fff; }

main { width: 100%; max-width: 1600px; padding: 16px max(3.5vw, 18px) 0; }
.intro {
  min-height: clamp(350px, 29vw, 440px);
  display: flex;
  align-items: center;
  padding: clamp(34px, 5vw, 76px);
  isolation: isolate;
  border-radius: 20px;
  background: linear-gradient(90deg, #111923ed 0%, #111923c8 36%, #11192338 72%, #11192322 100%), url('/hero-drive.png') center 54% / cover no-repeat;
  box-shadow: 0 24px 60px #0e152022;
}
.intro::before, .intro::after { display: none; }
.intro-copy { width: min(640px, 62%); }
.intro .eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 26px; color: #f1a3aa; font-size: 11px; letter-spacing: 2.5px; }
.eyebrow-line { display: inline-block; width: 26px; height: 2px; background: #ea4856; }
.intro h1 { max-width: 640px; margin: 0; color: #fff; font-size: clamp(36px, 4.2vw, 58px); line-height: 1.04; letter-spacing: -.045em; font-weight: 760; }
.intro h1 em { display: block; margin-top: 8px; color: #ec5260; font-style: normal; }
.intro p:not(.eyebrow) { max-width: 460px; margin: 26px 0 0; color: #d0d5dc; font-size: clamp(15px, 1.25vw, 18px); line-height: 1.65; }

.search {
  width: min(1080px, calc(100% - 44px));
  grid-template-columns: repeat(5, minmax(130px, 1fr));
  grid-template-areas: "keyword keyword brand model fuel" "year year price actions actions" "advanced advanced advanced advanced advanced";
  gap: 12px;
  margin: -44px auto 0;
  padding: 19px;
  border: 1px solid #e7e7e5;
  border-radius: 15px;
  box-shadow: 0 20px 44px #10151d1e;
}
.search-keyword { grid-area: keyword; }
.search-brand { position: relative; grid-area: brand; min-width: 0; }
.search-model { position: relative; grid-area: model; }
.search-model select optgroup { color: #b91d2b; font-weight: 850; }
.search-model select option { color: #293342; font-weight: 650; }
.search-fuel { position: relative; grid-area: fuel; min-width: 0; }
.brand-dropdown { position: relative; font-size: 14px; font-weight: 550; letter-spacing: 0; text-transform: none; }
.search .brand-dropdown input { width: 100%; padding-right: 40px; }
.brand-dropdown.has-value::before,.search-model.has-value::before,.fuel-multi.has-value::before,.year-picker.has-value::before,.search-price.has-value::before { position: absolute; z-index: 2; top: 6px; left: 14px; color: #8a929e; font-size: 9px; font-weight: 700; letter-spacing: .2px; line-height: 1; pointer-events: none; }
.brand-dropdown.has-value::before { content: "Marka pojazdu:"; }
.search-model.has-value::before { content: "Model pojazdu:"; }
.fuel-multi.has-value::before { content: "Rodzaj paliwa:"; }
.year-picker:has(input[name="yearFrom"]).has-value::before { content: "Rocznik od:"; }
.year-picker:has(input[name="yearTo"]).has-value::before { content: "Rocznik do:"; }
.search-price.has-value::before { content: "Cena do:"; }
.search-price.has-value::after { content: "PLN"; position: absolute; z-index: 2; top: 28px; right: 45px; color: #5f6875; font-size: 11px; font-weight: 700; line-height: 1; pointer-events: none; }
.search .brand-dropdown.has-value input,.search .search-model.has-value select,.search .search-model.has-value #searchModelInput,.search .fuel-multi.has-value summary,.search .year-picker.has-value input,.search .search-price.has-value input { padding-top: 20px; padding-bottom: 5px; }
.search .brand-clear { position: absolute; z-index: 2; top: 50%; right: 7px; display: grid; place-items: center; width: 34px; min-width: 34px; height: 34px; padding: 0; transform: translateY(-50%); border: 0; border-radius: 7px; background: transparent; color: #717986; font-size: 22px; font-weight: 500; line-height: 1; }
.search .brand-clear:hover { background: #eceff3; color: #b91d2b; }
.search .brand-clear[hidden] { display: none; }
.search .model-clear { position: absolute; z-index: 2; top: 50%; right: 7px; display: grid; place-items: center; width: 34px; min-width: 34px; height: 34px; padding: 0; transform: translateY(-50%); border: 0; border-radius: 7px; background: transparent; color: #717986; font-size: 22px; font-weight: 500; line-height: 1; }
.search .model-clear:hover { background: #eceff3; color: #b91d2b; }
.search .model-clear[hidden] { display: none; }
.search .filter-clear { position: absolute; z-index: 33; top: 50%; right: 7px; display: grid; place-items: center; width: 34px; min-width: 34px; height: 34px; padding: 0; transform: translateY(-50%); border: 0; border-radius: 7px; background: transparent; color: #717986; font-size: 22px; font-weight: 500; line-height: 1; }
.search .filter-clear:hover { background: #eceff3; color: #b91d2b; }
.search .filter-clear[hidden] { display: none; }
.search .fuel-multi summary { padding-right: 44px; }
.search .search-year .search-range-controls input[name="yearFrom"],.search .search-year .search-range-controls input[name="yearTo"] { padding-right: 42px; }
.search .search-price input { padding-right: 78px; }
.brand-dropdown summary { display: flex; align-items: center; justify-content: space-between; height: 49px; padding: 12px 14px; border: 1px solid #e2e4e7; border-radius: 8px; background: #f8f9fa; color: #1a2230; cursor: pointer; list-style: none; white-space: nowrap; }
.brand-dropdown summary::-webkit-details-marker { display: none; }
.brand-dropdown summary::after { display: none; }
.brand-dropdown[open] summary { border-color: #e12636; box-shadow: 0 0 0 3px #e1263618; }
.brand-options { position: absolute; z-index: 32; top: calc(100% + 7px); left: 0; width: max(100%, 260px); max-height: 350px; overflow-y: auto; padding: 8px; border: 1px solid #dfe2e7; border-radius: 10px; background: #fff; box-shadow: 0 16px 36px #11182724; }
.brand-options[hidden] { display: none; }
.brand-options section { padding: 0; }
.brand-options p { margin: 8px 4px 6px; padding: 7px 9px; border-left: 3px solid #e12636; border-radius: 5px; background: #fff0f1; color: #b91d2b; font-size: 11px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; }
.brand-options button { display: block; width: 100%; padding: 9px 10px; border: 0; border-radius: 7px; background: transparent; color: #293342; font-size: 13px; font-weight: 650; text-align: left; }
.brand-options button:hover { background: #f5f6f8; }
.brand-options .brand-check-option { display: flex; flex-direction: row; align-items: center; gap: 9px; padding: 9px 10px; border-radius: 7px; color: #293342; font-size: 13px; font-weight: 650; letter-spacing: 0; text-transform: none; cursor: pointer; }
.brand-options .brand-check-option:hover { background: #f5f6f8; }
.brand-options .brand-check-option:has(input:checked) { background: #fff0f1; color: #b91d2b; }
.brand-options .brand-check-option input { flex: 0 0 16px; width: 16px; min-width: 16px; height: 16px; margin: 0; padding: 0; accent-color: #e12636; }
.brand-empty { display: block; padding: 12px 10px; color: #7a818b; font-size: 13px; }
.fuel-multi { position: relative; font-size: 14px; font-weight: 550; letter-spacing: 0; text-transform: none; }
.fuel-multi summary { display: flex; align-items: center; justify-content: space-between; height: 49px; padding: 12px 14px; border: 1px solid #e2e4e7; border-radius: 8px; background: #f8f9fa; color: #1a2230; cursor: pointer; list-style: none; white-space: nowrap; }
.fuel-multi summary span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fuel-multi summary::-webkit-details-marker { display: none; }
.fuel-multi summary::after { display: none; }
.fuel-multi[open] summary { border-color: #e12636; box-shadow: 0 0 0 3px #e1263618; }
.search-model select { appearance: none; -webkit-appearance: none; padding-right: 40px; background-image: none; }
.search .search-model-dropdown > #searchModelInput { width: 100%; padding-right: 40px; }
.search .search-model-dropdown > .search-model-options { width: max(100%, 280px); }
.fuel-options { position: absolute; z-index: 30; top: calc(100% + 7px); right: 0; display: grid; gap: 4px; width: max(100%, 220px); padding: 9px; border: 1px solid #dfe2e7; border-radius: 10px; background: #fff; box-shadow: 0 16px 36px #11182724; }
.search .fuel-options .fuel-select-all { width: 100%; margin: 0 0 5px; padding: 10px; border: 1px solid #efb6bb; border-radius: 7px; background: #fff0f1; color: #b91d2b; font-size: 13px; font-weight: 800; text-align: left; }
.search .fuel-options .fuel-select-all:hover { border-color: #e12636; background: #ffe4e6; }
.search .fuel-options .fuel-select-all:has(input:checked) { border-color: #e12636; background: #e12636; color: #fff; }
.search .fuel-options label { display: flex; flex-direction: row; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 7px; color: #293342; font-size: 13px; font-weight: 650; letter-spacing: 0; text-transform: none; cursor: pointer; }
.search .fuel-options label:hover { background: #f5f6f8; }
.search .fuel-options input { width: 18px; min-width: 18px; height: 18px; margin: 0; padding: 0; accent-color: #e12636; }
.search-year { position: relative; grid-area: year; }
.search-year .search-range-controls { width: 100%; height: 49px; overflow: visible; }
.search .search-year .search-range-controls input { height: 47px; padding: 9px 10px; appearance: textfield; -moz-appearance: textfield; font-size: 14px; font-weight: 550; text-align: center; }
.search .search-year input[type="number"]::-webkit-inner-spin-button,
.search .search-year input[type="number"]::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; appearance: none; }
.search .search-range-controls .year-picker { position: relative; }
.year-options { position: absolute; z-index: 31; top: calc(100% + 7px); left: 0; display: grid; grid-template-columns: 1fr; gap: 2px; width: 100%; min-width: 118px; max-height: 250px; overflow-y: auto; padding: 7px; border: 1px solid #dfe2e7; border-radius: 10px; background: #fff; box-shadow: 0 16px 36px #11182724; }
.year-options[hidden] { display: none; }
.year-options button { min-width: 0; padding: 9px 6px; border: 0; border-radius: 6px; background: transparent; color: #293342; font-size: 17px; font-weight: 700; text-align: center; }
.year-options button:hover,.year-options button.is-selected { background: #fff0f1; color: #bd1d2c; }
.search-price { position: relative; grid-area: price; }
.price-options { position: absolute; z-index: 31; top: calc(100% + 7px); left: 0; display: grid; grid-template-columns: 1fr; gap: 2px; width: 100%; max-height: 280px; overflow-y: auto; padding: 7px; border: 1px solid #dfe2e7; border-radius: 10px; background: #fff; box-shadow: 0 16px 36px #11182724; }
.price-options[hidden] { display: none; }
.price-options button { width: 100%; min-width: 0; padding: 9px 10px; border: 0; border-radius: 6px; background: transparent; color: #293342; font-size: 14px; font-weight: 700; text-align: left; }
.price-options button:hover { background: #fff0f1; color: #bd1d2c; }
.search-actions { grid-area: actions; display: flex; align-items: end; gap: 10px; }
.search-actions > button { flex: 1; min-height: 49px; }
.advanced-search-toggle { border-color: #cfd3d9; background: #fff; color: #222b38; font-weight: 750; white-space: nowrap; }
.advanced-search-toggle:hover, .advanced-search-toggle[aria-expanded="true"] { border-color: #e12636; color: #c91f2f; box-shadow: 0 0 0 3px #e1263612; }
.advanced-search-toggle[aria-expanded="true"]::after { content: " ×"; }
.advanced-search { grid-area: advanced; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) 2fr; gap: 12px; margin-top: 3px; padding: 18px; border: 1px solid #e0e3e7; border-radius: 11px; background: linear-gradient(135deg, #fafafa, #f4f5f7); }
.advanced-search[hidden] { display: none; }
.advanced-filter-group { grid-column: 1 / -1; padding: 18px; border: 1px solid #e2e4e8; border-top: 3px solid var(--accent); border-radius: 12px; background: #fff; box-shadow: 0 7px 20px #141b2509; }
.advanced-filter-group h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; color: #202834; font-size: 15px; font-weight: 800; letter-spacing: -.01em; }
.advanced-filter-group h3 span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--accent); color: #fff; font-size: 10px; font-weight: 850; letter-spacing: .6px; }
.advanced-filter-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; align-items: end; }
.advanced-mileage { min-width: 0; }
.advanced-filter-fields label { position: relative; }
.advanced-filter-fields label.has-selected-value::before { content: attr(data-selected-label); position: absolute; z-index: 2; top: 6px; left: 14px; color: #8a929e; font-size: 9px; font-weight: 700; letter-spacing: .2px; line-height: 1; text-transform: none; pointer-events: none; }
.search .advanced-filter-fields label.has-selected-value > input,.search .advanced-filter-fields label.has-selected-value > select { padding-top: 20px; padding-bottom: 5px; }
.search .advanced-filter-fields label:has(>.advanced-field-clear:not([hidden]))>input,.search .advanced-filter-fields label:has(>.advanced-field-clear:not([hidden]))>select { padding-right: 42px; }
.search .search-range-controls label:has(>.advanced-field-clear:not([hidden]))>input { padding-right: 36px; }
.search .advanced-field-clear { z-index: 4; }
.search .advanced-mileage input::placeholder,.search .advanced-power input::placeholder,.search .advanced-capacity input::placeholder { font-size: 11px; font-weight: 700; }
.city-combobox { position: relative; width: 100%; }
#searchCityInput { width: 100%; }
.advanced-filter-fields label.has-selected-value > #searchCityInput { padding-top: 20px; padding-bottom: 5px; }
.city-options { position: absolute; z-index: 34; top: calc(100% + 7px); left: 0; display: grid; gap: 2px; width: max(100%, 260px); max-height: 300px; overflow-y: auto; padding: 7px; border: 1px solid #dfe2e7; border-radius: 10px; background: #fff; box-shadow: 0 16px 36px #11182724; }
.city-options[hidden] { display: none; }
.city-options button { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 7px; background: transparent; color: #293342; font-size: 13px; font-weight: 650; text-align: left; }
.city-options button:hover { background: #f5f6f8; }
.city-options small { color: #8a929e; font-size: 10px; font-weight: 600; white-space: nowrap; }
.city-empty { display: block; padding: 12px 10px; color: #7a818b; font-size: 13px; }
.search label { gap: 7px; color: #555d69; font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.search > label, .advanced-filter-fields > label { gap: 0; font-size: 0; }
.search input, .search select { height: 49px; padding: 12px 14px; border: 1px solid #e2e4e7; border-radius: 8px; background: #f8f9fa; color: #1a2230; font-size: 14px; font-weight: 550; letter-spacing: 0; text-transform: none; }
.search input::placeholder { color: #9da4af; }
.search #searchBrandInput::placeholder,.search .search-year input::placeholder,.search .search-price input::placeholder { color: #1a2230; opacity: 1; }
.search #searchModelInput:disabled { color: #9da4af; -webkit-text-fill-color: #9da4af; opacity: 1; }
.search #searchModelInput:disabled::placeholder { color: #9da4af; opacity: 1; }
.search #searchModelInput:not(:disabled) { color: #1a2230; -webkit-text-fill-color: #1a2230; }
.search #searchModelInput:not(:disabled)::placeholder { color: #1a2230; opacity: 1; }
.search-range { min-width: 0; margin: 0; padding: 0; border: 0; }
.search-range legend { margin: 0 0 7px; padding: 0; color: #555d69; font-size: 11px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.search-range legend { display: none; }
.search-range-controls { display: flex; align-items: center; height: 49px; overflow: hidden; border: 1px solid #e2e4e7; border-radius: 8px; background: #f8f9fa; transition: border-color .18s, box-shadow .18s; }
.search-range-controls:focus-within { border-color: #e12636; box-shadow: 0 0 0 3px #e1263618; }
.search .search-range-controls label { display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; flex: 1; min-width: 0; gap: 7px; padding-left: 13px; color: #8a929e; font-size: 10px; letter-spacing: .7px; text-transform: uppercase; }
.search .search-range-controls label { grid-template-columns: minmax(0,1fr); gap: 0; }
.search .search-range-controls label > span { display: none; }
.search .search-range-controls input { height: 47px; min-width: 0; padding: 9px 10px 9px 0; border: 0; border-radius: 0; outline: 0; background: transparent; color: #1a2230; font-size: 14px; font-weight: 650; }
.search-range-separator { flex: 0 0 auto; color: #b4bac3; font-size: 16px; }
.search .primary { min-height: 49px; border-radius: 8px; white-space: nowrap; }

.inventory { padding-top: clamp(66px, 6vw, 96px); scroll-margin-top: 24px; }
.favorites-view .intro, .favorites-view .search { display: none; }
.favorites-view .inventory { padding-top: 34px; }
.results { margin-bottom: 30px; align-items: end; }
.section-kicker { margin: 0 0 9px; color: var(--accent); font-size: 11px; font-weight: 850; letter-spacing: 2.2px; }
.results h2 { margin: 0; font-size: clamp(26px, 2.3vw, 35px); font-weight: 760; letter-spacing: -.045em; }
.results #count { display: inline-block; margin: 0 0 4px 14px; padding: 6px 10px; border: 1px solid #dcdfe4; border-radius: 100px; color: #56606e; font-size: 12px; font-weight: 700; letter-spacing: 0; vertical-align: middle; white-space: nowrap; }
.results-subtitle { margin: 8px 0 0; color: #7a818b; font-size: 14px; }
.results-sort { min-width: 220px; gap: 7px; color: #6f7782; font-size: 10px; font-weight: 800; letter-spacing: 1px; text-transform: uppercase; }
.results-sort[hidden] { display: none; }
.results-sort select { height: 45px; padding: 10px 38px 10px 13px; border: 1px solid #dfe2e6; border-radius: 9px; background-color: #fff; color: #1a2230; font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.results-sort select:focus { border-color: #e12636; outline: 0; box-shadow: 0 0 0 3px #e1263618; }
.results-decoration { padding-bottom: 8px; color: #9ca2a9; font-size: 11px; font-weight: 750; letter-spacing: 2px; white-space: nowrap; }

.cards { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.card { position: relative; min-width: 0; border: 1px solid #e9e9e7; border-radius: 14px; background: #fff; box-shadow: 0 6px 22px #141b250a; }
.card:hover { transform: translateY(-5px); border-color: #d9dce1; box-shadow: 0 19px 40px #141b2519; }
.card .photo-button { height: clamp(150px, 12vw, 190px); background: #d9dde2; }
.card .photo-button .photo, .card .photo-button .no-photo { width: 100%; height: 100%; object-fit: cover; }
.card .photo-button .no-photo { background: linear-gradient(135deg, #d8dde3, #edf0f2); color: #626d78; }
.photo-overlay { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg, #07111b76, transparent 42%); }
.card .photo-count { right: 10px; bottom: 10px; padding: 5px 7px; background: #10151dc9; border: 1px solid #ffffff48; border-radius: 6px; font-size: 9px; }
.card-favorite, .offer-favorite { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid #e3e5e9; border-radius: 50%; background: #fffffff2; color: #4b5563; box-shadow: 0 5px 18px #11172220; }
.card-favorite { position: absolute; z-index: 3; top: 10px; right: 10px; width: 34px; height: 34px; }
.card-favorite span, .offer-favorite span { font-size: 20px; line-height: 1; transform: translateY(-1px); }
.card-favorite:hover, .offer-favorite:hover { border-color: #e8aeb3; background: #fff; color: var(--accent); }
.card-favorite.is-favorite, .offer-favorite.is-favorite { border-color: #f0c5c9; background: #fff5f6; color: var(--accent); }
.card-body { padding: 15px 14px 14px; }
.card-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.card .tag { margin: 0; padding: 0; overflow: hidden; background: transparent; color: var(--accent); font-size: 8px; letter-spacing: .85px; text-overflow: ellipsis; white-space: nowrap; }
.card h3 { margin: 9px 0 11px; font-size: clamp(16px, 1.25vw, 19px); line-height: 1.2; letter-spacing: -.025em; }
.card-specs { display: flex; flex-wrap: wrap; gap: 4px; min-height: 25px; }
.card-specs span { padding: 5px 6px; border: 1px solid #e9eaed; border-radius: 5px; background: #f7f8f9; color: #576170; font-size: 9px; font-weight: 700; }
.card-bottom { align-items: end; margin-top: 13px; padding-top: 11px; border-top: 1px solid #ebecef; }
.card-bottom-details { min-width: 0; }
.card .city { display: block; overflow: hidden; color: #7b8491; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.card .price { margin: 4px 0 0; color: #141b24; font-size: 18px; font-weight: 760; letter-spacing: -.035em; line-height: 1.15; white-space: nowrap; }
.card .price small { font-size: 11px; font-weight: 650; letter-spacing: 0; }
.card a.view { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; padding: 0; border: 1px solid #e3e5e9; border-radius: 8px; background: #fff; color: #202833; font-size: 18px; font-weight: 400; }
.card a.view:hover { border-color: var(--accent); background: var(--accent); color: #fff; }

#empty { max-width: 850px; margin: 10px auto 0; padding: 48px 28px; border: 1px dashed #d7dbe0; border-radius: 16px; background: #fff; box-shadow: none; }
.empty-icon { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #f3f4f6; color: var(--accent); font-size: 36px; line-height: 1; }
#empty h2 { margin: 15px 0 4px; }
#empty p { margin-top: 0; }

.site-footer { display: block; width: 100%; margin-top: 55px; padding: 19px clamp(18px, 3vw, 36px) 12px; border: 0; border-radius: 16px 16px 0 0; background: #10151d; color: #fff; }
.footer-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.footer-identity { display: grid; gap: 6px; flex: 0 0 auto; }
.footer-wordmark { color: #fff; font-size: 20px; font-weight: 850; letter-spacing: -1px; text-decoration: none; }
.footer-wordmark span { color: #e84552; }
.footer-identity strong { color: #d8dde5; font-size: 11px; letter-spacing: .2px; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px 18px; max-width: 850px; }
.footer-links a { color: #c4cbd5; font-size: 11px; font-weight: 650; text-decoration: none; }
.footer-links a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.footer-bottom { display: flex; justify-content: space-between; gap: 14px; margin-top: 14px; padding-top: 9px; border-top: 1px solid #ffffff17; color: #7f8998; font-size: 9px; letter-spacing: .7px; text-transform: uppercase; }
.offer-footer { width: min(1500px, calc(100% - max(40px, 10vw))); margin: 0 auto; border-radius: 16px 16px 0 0; }
.editor-footer { margin-top: 40px; }

#legalPage { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; overflow: auto; border: 0; border-radius: 0 !important; background: #f4f4f2; box-shadow: none; color: var(--ink); }
#legalPage::backdrop { background: #f4f4f2; backdrop-filter: none; }
.legal-topbar { position: sticky; z-index: 5; top: 0; display: flex; align-items: center; justify-content: space-between; min-height: 72px; padding: 9px max(4vw, 20px); border-radius: 0; background: #10151df7; border-bottom: 1px solid #ffffff17; box-shadow: 0 8px 30px #0e15201c; backdrop-filter: blur(14px); }
.legal-logo { display: flex; align-items: center; flex: 0 0 auto; width: auto; height: 52px; padding: 0; border: 0; background: transparent; }
.legal-logo:hover { filter: none; transform: none; }
.legal-logo img { display: block; width: auto; height: 52px; }
.legal-account-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-left: auto; min-width: 0; }
.legal-account-actions button { min-height: 40px; padding-inline: 15px; border-color: #586170; background: transparent; color: #f5f6f8; white-space: nowrap; }
.legal-account-actions button:hover { border-color: #b9c0cc; background: #ffffff12; filter: none; }
#legalAdd { background: var(--accent); border-color: var(--accent); color: #fff; }
#legalAdd:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
#legalFavorites { display: flex; align-items: center; gap: 7px; }
#legalFavorites > span { color: #f28b94; font-size: 20px; line-height: 1; }
#legalFavorites strong { display: grid; place-items: center; min-width: 21px; height: 21px; padding: 0 6px; border-radius: 20px; background: #2c3440; color: #fff; font-size: 11px; }
#legalFavorites.has-favorites > span { color: #f05260; }
#legalFavorites.has-favorites strong { background: var(--accent); }
#legalAccount { max-width: min(340px, 34vw); overflow: hidden; text-overflow: ellipsis; }
.legal-content { width: min(1040px, calc(100% - 36px)); margin: 0 auto; padding: clamp(35px, 6vw, 84px) 0 20px; }
.legal-heading { position: static; z-index: auto; top: auto; display: block; min-height: 0; padding: clamp(28px, 5vw, 58px); overflow: hidden; border: 0; border-radius: 18px; background: linear-gradient(125deg, #111821, #222b36); color: #fff; box-shadow: 0 18px 44px #10151d16; backdrop-filter: none; }
.legal-heading .eyebrow { margin: 0 0 14px; color: #ef7c86; }
.legal-heading h1 { margin: 0; font-size: clamp(32px, 4.4vw, 50px); line-height: 1.05; letter-spacing: -.045em; }
.legal-heading > p { max-width: 720px; margin: 21px 0 18px; color: #d0d5dc; font-size: 17px; }
.legal-heading small { color: #939dab; font-size: 11px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; }
.legal-body { display: grid; gap: 16px; margin-top: 24px; }
.legal-body section { padding: clamp(24px, 4vw, 42px); border: 1px solid #e4e5e4; border-radius: 14px; background: #fff; box-shadow: 0 6px 22px #141b2508; }
.legal-body h2 { margin: 0 0 14px; color: #171e28; font-size: 22px; letter-spacing: -.45px; }
.legal-body p { margin: 10px 0 0; color: #545d69; line-height: 1.75; }
.legal-body p:first-of-type { margin-top: 0; }
.legal-body ul { display: grid; gap: 9px; margin: 8px 0 0; padding-left: 21px; color: #545d69; line-height: 1.65; }
.legal-body a:not(.legal-action):not(.contact-email) { color: var(--accent); font-weight: 700; text-underline-offset: 3px; }
.legal-table { display: grid; gap: 12px; }
.legal-table > div { display: grid; grid-template-columns: minmax(150px, .7fr) auto minmax(260px, 1.8fr); align-items: center; gap: 18px; padding: 18px; border: 1px solid #e8e9eb; border-radius: 10px; background: #f8f9fa; }
.legal-table strong { overflow-wrap: anywhere; }
.legal-table span, .cookie-always, .cookie-off { justify-self: start; padding: 6px 9px; border-radius: 100px; background: #eaf5ed; color: #26703c; font-size: 10px; font-weight: 850; letter-spacing: .5px; text-transform: uppercase; }
.legal-table p { margin: 0; font-size: 14px; }
.cookie-setting { display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.cookie-setting h2 { margin-bottom: 5px; }
.cookie-setting p { margin: 0; }
.cookie-always, .cookie-off { flex: 0 0 auto; }
.cookie-off { background: #eef0f3; color: #68717e; }
.cookie-save { border: 0; cursor: pointer; }
.cookie-save:disabled { cursor: default; opacity: .72; }
.cookie-save-status { min-height: 24px; color: #26703c !important; font-size: 13px; font-weight: 750; }
.cookie-banner {
  position: fixed;
  z-index: 1000;
  right: 22px;
  bottom: 22px;
  left: 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  width: min(1120px, calc(100% - 44px));
  margin: 0 auto;
  padding: 20px 22px;
  border: 1px solid #ffffff1f;
  border-radius: 14px;
  background: #111821f7;
  color: #fff;
  box-shadow: 0 22px 60px #0b10194d;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .22s ease, transform .22s ease;
  backdrop-filter: blur(16px);
}
.cookie-banner.is-visible { opacity: 1; transform: translateY(0); }
.cookie-banner-copy { display: flex; align-items: flex-start; gap: 15px; max-width: 760px; }
.cookie-banner-icon { flex: 0 0 auto; color: #e84552; font-size: 23px; line-height: 1; }
.cookie-banner-copy strong { display: block; margin-bottom: 5px; font-size: 16px; }
.cookie-banner-copy p { margin: 0; color: #c8ced7; font-size: 13px; line-height: 1.55; }
.cookie-banner a { color: #fff; font-weight: 750; text-underline-offset: 3px; }
.cookie-banner-actions { display: flex; align-items: center; gap: 17px; flex: 0 0 auto; }
.cookie-banner-actions > a { font-size: 12px; white-space: nowrap; }
.cookie-banner-actions .primary { min-height: 43px; padding: 11px 19px; border-radius: 8px; white-space: nowrap; }
.legal-action { display: inline-flex; align-items: center; justify-content: center; margin-top: 21px; padding: 14px 18px; border-radius: 9px; background: var(--accent); color: #fff; font-weight: 800; text-decoration: none; }
.legal-action:hover { background: var(--accent-dark); }
.contact-panel { display: flex; align-items: center; justify-content: space-between; gap: 42px; }
.contact-panel .section-kicker { margin-bottom: 9px; }
.contact-email { display: inline-block; margin-top: 4px; color: #171e28; font-size: clamp(18px, 3vw, 28px); font-weight: 800; text-decoration: none; overflow-wrap: anywhere; }
.contact-email:hover { color: var(--accent); }
.contact-note { max-width: 680px; font-size: 13px; }
.legal-register-notice,.listing-public-notice{font-size:13px;line-height:1.5;color:#5f6877}
.legal-register-notice a{color:#b71929}
.offer-report-trigger{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:8px 0;border:0;background:transparent;color:#a51f2d;font-size:13px;font-weight:750;text-align:left;box-shadow:none}
.offer-report-trigger:hover{background:transparent;color:#d12436;transform:none;text-decoration:underline;text-underline-offset:4px}
.offer-report-trigger span{font-size:18px;line-height:1}
#offerReportDialog{position:fixed;inset:0;width:min(680px,calc(100vw - 28px));max-width:none;max-height:min(90dvh,820px);margin:auto;padding:clamp(24px,3.5vw,38px);overflow-y:auto;border:1px solid #ead9dc;border-radius:18px;background:#fff;box-shadow:0 30px 90px #0e14204d;color:#171e28}
#offerReportDialog::backdrop{background:#101722b8;backdrop-filter:blur(5px)}
.offer-report-fields[hidden]{display:none}
.offer-report-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.offer-report-heading h2{margin:0 0 10px;color:#171e28;font-size:clamp(24px,2.6vw,32px);letter-spacing:-.6px}
.offer-report-heading p{margin:0;color:#68717d;font-size:14px;line-height:1.55}
.offer-report-close{flex:0 0 auto;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:#f2f3f5;color:#525c6b;font-size:28px;line-height:1}
.offer-report-close:hover{background:#e9ebef;transform:none}
.offer-report-form{margin-top:24px}
.offer-report-fields{display:grid;gap:18px}
.offer-report-fields>label:not(.offer-report-confirm),.offer-report-contact label{display:grid;gap:8px;color:#303747;font-size:14px;font-weight:750}
.offer-report-fields select,.offer-report-fields textarea,.offer-report-fields input[type="email"],.offer-report-fields input[type="text"]{width:100%;min-width:0;background:#f7f8fa}
.offer-report-fields textarea{resize:vertical;min-height:110px}
.offer-report-contact{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.offer-report-contact small{color:#7b8390;font-size:12px;font-weight:500}
.offer-report-confirm{display:flex;align-items:flex-start;gap:10px;color:#596271;font-size:12px;font-weight:500;line-height:1.5}
.offer-report-confirm input{flex:0 0 auto;margin-top:2px}
.offer-report-submit{justify-self:start;padding:12px 20px}
.offer-report-status{min-height:1.5em;margin:14px 0 0;color:#b42318;font-size:14px;font-weight:650;overflow-wrap:anywhere}
.offer-report-status.is-success{padding:14px 16px;border:1px solid #c9e6d4;border-radius:10px;background:#eff9f2;color:#236842}
@media(max-width:600px){#offerReportDialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);padding:22px 18px}.offer-report-contact{grid-template-columns:1fr}.offer-report-submit{width:100%}}
#legalPage > .site-footer { width: min(1040px, calc(100% - 36px)); margin: 45px auto 0; }

/* Oferta korzysta z tej samej palety i rytmu co karty na stronie głównej. */
#details { background: #f4f4f2; color: var(--ink); }
#details::backdrop { background: #f4f4f2; }
.offer-topbar { background: #10151df7; }
.offer-shell { width: min(1500px, 100%); }
.offer-gallery-card, .offer-summary, .offer-section { border-color: #e7e8e8; border-radius: 16px; box-shadow: 0 10px 34px #141b250d; }
.offer-section { border-top-color: var(--accent); }
#galleryMain { background: #151b24; }
.offer-summary .tag { padding: 0; background: transparent; color: var(--accent); letter-spacing: 1.3px; }
.offer-summary-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
.offer-summary-head .tag { margin: 0; }
.offer-favorite { flex: 0 0 42px; box-shadow: none; }
.offer-summary h1 { color: #151b24; font-size: clamp(27px, 2.35vw, 35px); line-height: 1.13; letter-spacing: -.9px; font-weight: 760; }
.offer-price { margin: 16px 0 22px; color: #151b24; font-size: clamp(27px, 2.5vw, 34px); line-height: 1.1; letter-spacing: -.65px; font-weight: 780; }
.offer-price small { font-size: 14px; font-weight: 600; }
.offer-section h2 { font-size: clamp(21px, 2vw, 27px); letter-spacing: -.4px; }
.seller-card { background: transparent; }
.offer-description .eyebrow { color: var(--accent); }
.offer-description .description { color: #4c5663; }

dialog:not(#lightbox):not(#editor):not(#details):not(#legalPage):not(#adminPanel):not(#offerReportDialog) { border: 1px solid #e5e7eb; }
#panel, #auth, #register, #listingPreview { background: #fff; }
#editor { background: #f4f4f2; }
#editor .fields { border: 1px solid #e8e9e8; box-shadow: 0 12px 38px #141b250d; }
.editor-heading .eyebrow { color: var(--accent); }
.editor-heading h2 { font-size: clamp(25px, 3vw, 34px); }

@media (max-width: 1350px) {
  .cards { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1100px) {
  .search { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .search { grid-template-areas: "keyword keyword brand" "model fuel fuel" "year year price" "actions actions actions" "advanced advanced advanced"; }
  .advanced-search { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .advanced-filter-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .card .photo-button { height: 210px; }
}
@media (max-width: 850px) {
  .intro { min-height: 390px; background-position: 56% center; }
  .intro-copy { width: min(600px, 75%); }
  .search { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "keyword keyword" "brand model" "fuel fuel" "year year" "price price" "actions actions" "advanced advanced"; }
  .search .primary { align-self: end; }
  .results-decoration { display: none; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card .photo-button { height: 220px; }
}
@media (max-width: 600px) {
  header { min-height: 62px; padding: 8px 16px; }
  .logo { font-size: 23px; }
  .header-logo-image { height: 40px; }
  .logo-mark { width: 37px; height: 37px; }
  .account-actions button { min-height: 36px; padding: 8px 9px; font-size: 12px; }
  .account-actions #account { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #headerLogout { flex: 0 0 auto; }
  #favorites { flex: 0 0 auto; gap: 4px; min-height: 38px; padding: 9px 8px; font-size: 12px; }
  #favorites > span { font-size: 14px; }
  #favorites strong { min-width: 16px; height: 16px; padding-inline: 4px; font-size: 9px; }
  main { padding: 0 0 0; }
  .intro { min-height: 395px; padding: 28px 24px 88px; align-items: start; border-radius: 0 0 18px 18px; background: linear-gradient(180deg, #111923ee 0%, #111923c7 48%, #11192349 100%), url('/hero-drive.png') 58% center / cover no-repeat; }
  .intro-copy { width: 100%; }
  .intro .eyebrow { margin-bottom: 22px; font-size: 10px; letter-spacing: 1.6px; }
  .intro h1 { max-width: 470px; font-size: clamp(36px, 9vw, 46px); }
  .intro p:not(.eyebrow) { max-width: 370px; margin-top: 20px; font-size: 15px; }
  .search { width: auto; grid-template-columns: 1fr; grid-template-areas: "keyword" "brand" "model" "fuel" "year" "price" "actions" "advanced"; gap: 11px; margin: -65px 16px 0; padding: 16px; border-radius: 13px; }
  .search-year .search-range-controls { width: 100%; }
  .search-actions { align-items: stretch; flex-direction: column; }
  .advanced-search { grid-template-columns: 1fr; padding: 15px; }
  .advanced-filter-group { padding: 14px; }
  .advanced-filter-fields { grid-template-columns: 1fr; }
  .search .primary { width: 100%; }
  .inventory { padding: 64px 16px 0; }
  .favorites-view .inventory { padding-top: 28px; }
  .results { margin-bottom: 20px; }
  .results h2 { font-size: 27px; line-height: 1.18; }
  .results #count { margin: 9px 0 0; }
  .results-subtitle { font-size: 13px; }
  .results-sort { width: 100%; min-width: 0; }
  .cards { grid-template-columns: 1fr; gap: 19px; }
  .card .photo-button { height: 260px; }
  .card-body { padding: 21px; }
  .site-footer { margin: 44px 0 0; padding: 17px 14px 12px; border-radius: 0; }
  .footer-top, .footer-bottom { flex-direction: column; }
  .footer-top { gap: 14px; }
  .footer-links { justify-content: flex-start; gap: 8px 14px; }
  .footer-links a { flex: 1 1 calc(50% - 20px); }
  .footer-bottom { gap: 4px; margin-top: 13px; padding-top: 9px; }
  .offer-footer { width: 100%; }
  .legal-topbar { gap: 12px; min-height: 62px; padding: 8px 16px; }
  .legal-logo, .legal-logo img { height: 40px; }
  .legal-account-actions { gap: 5px; }
  .legal-account-actions button { min-height: 36px; padding: 8px 9px; font-size: 12px; }
  #legalAdd { flex: 0 0 38px; width: 38px; padding: 0; font-size: 0; }
  #legalAdd::before { content: "+"; font-size: 20px; }
  #legalFavorites { gap: 4px; min-height: 38px; padding: 9px 8px; font-size: 12px; }
  #legalFavorites > span { font-size: 14px; }
  #legalFavorites strong { min-width: 16px; height: 16px; padding-inline: 4px; font-size: 9px; }
  #legalAccount { width: 60px; max-width: none; font-size: 0; }
  #legalAccount::before { content: "Konto"; font-size: 12px; }
  .legal-content { width: calc(100% - 24px); padding-top: 18px; }
  .legal-heading { padding: 28px 22px; border-radius: 14px; }
  .legal-heading h1 { font-size: 34px; }
  .legal-heading > p { font-size: 15px; }
  .legal-body section { padding: 24px 20px; }
  .legal-table > div { grid-template-columns: 1fr; gap: 9px; }
  .cookie-setting, .contact-panel { align-items: flex-start; flex-direction: column; gap: 18px; }
  .cookie-banner { right: 12px; bottom: 12px; left: 12px; align-items: stretch; flex-direction: column; gap: 17px; width: calc(100% - 24px); padding: 18px; }
  .cookie-banner-copy { gap: 11px; }
  .cookie-banner-icon { font-size: 18px; }
  .cookie-banner-actions { justify-content: space-between; }
  .cookie-banner-actions .primary { padding-inline: 17px; }
  .offer-summary h1 { font-size: 27px; }
  .offer-price { font-size: 29px; }
  .offer-description-card h2 { font-size: 23px; }
  #legalPage > .site-footer { width: 100%; margin-top: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .card, button, .photo-button .photo, .cookie-banner { transition: none; }
}