:root {
  --font-accent:'DM Mikhako Tsereteli','Noto Georgian',sans-serif;
  --font-body:'Inter','Noto Georgian','Segoe UI',sans-serif;
  --font-heading:'Inter','Noto Georgian','Segoe UI',sans-serif;
  --color-primary:#ffcc00;
  --color-ink:#0a0a0a;
  --color-text:#20242c;
  --color-muted:#687080;
  --color-background:#f5f6f8;
  --color-surface:#fff;
  --color-border:#e6e9ef;
  --color-success:#169b62
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:24px
}
body {
  margin:0;
  background:var(--color-background);
  color:var(--color-text);
  font-family:var(--font-body);
  font-optical-sizing:auto;
  font-size:14px;
  line-height:1.55
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,summary {
  -webkit-tap-highlight-color:transparent
}
button,a {
  touch-action:manipulation
}
button {
  cursor:pointer
}
a {
  color:inherit;
  text-decoration:none
}
button {
  color:inherit
}
img {
  max-width:100%;
  display:block
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  font-family:var(--font-heading);
  color:var(--color-ink);
  line-height:1.35
}
h2 {
  font-size:25px;
  font-weight:800
}
h3 {
  font-size:17px;
  font-weight:750
}
button {
  border:0;
  background:none
}
button:disabled {
  cursor:not-allowed;
  opacity:.5
}
[hidden] {
  display:none!important
}
:focus-visible {
  outline:3px solid #215cf4;
  outline-offset:4px
}
.container {
  width:calc(100% - 64px);
  max-width:1280px;
  margin-inline:auto
}
.icon {
  width:22px;
  font-size:20px;
  height:22px;
  display:inline-grid;
  place-items:center;
  flex-shrink:0;
  vertical-align:middle
}
.yellow {
  color:#fbc000
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:44px;
  padding:11px 20px;
  border:1px solid transparent;
  border-radius:10px;
  font-size:13px;
  font-weight:750;
  line-height:1.4;
  transition:background .16s,box-shadow .16s;
  white-space:nowrap
}
.button:hover {
  box-shadow:0 3px 12px #15243814
}
.primary {
  background:var(--color-primary);
  color:#101010;
  border-color:#ffc600
}
.primary:hover {
  background:#f2bf00
}
.outline {
  border-color:#8c96a6;
  background:#ffffffdc
}
.outline:hover {
  background:#fff
}
.soft {
  background:#edf0f5
}
.large {
  min-height:53px;
  padding:13px 27px;
  font-size:15px;
  border-radius:18px
}
.icon-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  font-size:40px;
  height:42px;
  border-radius:9px;
  position:relative
}
.icon-button:hover {
  background:#e9edf2
}
.text-link {
  color:#1550eb;
  font-size:13px;
  font-weight:650;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 0
}
.text-link .icon {
  width:18px
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  clip:rect(0,0,0,0);
  overflow:hidden;
  white-space:nowrap;
  border:0
}
.skip-link {
  position:fixed;
  top:-80px;
  left:20px;
  z-index:20;
  padding:10px;
  background:#fff
}
.skip-link:focus {
  top:10px
}
.section {
  margin-top:26px
}
.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  margin-bottom:16px
}
/* Header and layered hero */
.site-header {
  background:#ffffffed;
  position:relative;
  z-index:5
}
.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  min-height:70px
}
.logo {
  display:inline-flex;
  align-items:center;
  gap:9px;
  flex-shrink:0;
  color:#0b0d10;
  font-family:var(--font-heading);
  font-size:29px;
  font-weight:850;
  letter-spacing:-1.2px
}
.logo img {
  width:56px;
  height:56px;
  object-fit:contain
}
.main-nav {
  display:flex;
  align-items:center;
  gap:23px;
  font-size:12px;
  font-weight:700;
  white-space:nowrap
}
.main-nav a {
  position:relative;
  padding:23px 0
}
.main-nav a:hover:after,.main-nav .active:after {
  content:'';
  position:absolute;
  bottom:12px;
  height:2px;
  background:var(--color-primary);
  left:0;
  right:0
}
.header-actions {
  display:flex;
  align-items:center;
  gap:9px
}
.header-actions .button {
  font-size:11px;
  padding:10px 12px;
  min-height:42px
}
.header-actions .icon {
  width:19px
}
.favorite-count {
  position:absolute;
  right:0;
  top:0;
  font-size:10px;
  min-width:17px;
  height:17px;
  border-radius:50%;
  background:var(--color-primary);
  color:#111;
  font-weight:800
}
.menu-toggle {
  display:none
}
.hero {
  background-image:linear-gradient(90deg,#f7f9fcfa 0%,#f7f9fce6 28%,#f7f9fc68 52%,#fff0 75%),linear-gradient(0deg,#f5f6f8 0%,#f5f6f800 28%),url('../images/hero-city.opt.webp');
  background-position:center;
  background-size:cover
}
.hero-inner {
  height:435px;
  position:relative
}
.hero-copy {
  position:relative;
  z-index:2;
  padding:44px 0 0 38px;
  width:58%
}
.hero h1 {
  font-size:49px;
  line-height:1.18;
  font-weight:850;
  letter-spacing:-1.4px
}
.hero-copy>p {
  font-size:18px;
  font-weight:600;
  line-height:1.5;
  margin-top:18px
}
.hero-actions {
  display:flex;
  gap:16px;
  margin-top:22px
}
.hero-car {
  position:absolute;
  right:25px;
  bottom:-30px;
  width:46%;
  height:auto;
  z-index:1
}
.hero-note {
  font-family:var(--font-accent);
  font-synthesis:none;
  position:absolute;
  right:17px;
  top:16px;
  width:190px;
  font-size:18px;
  font-weight:400;
  line-height:1.15;
  text-shadow:0 1px 4px #fff,0 0 10px #ffffffa8;
  transform:rotate(-8deg);
  border-bottom:3px solid var(--color-primary);
  padding-bottom:9px;
  z-index:2
}
.hero-badge {
  position:absolute;
  right:0;
  bottom:28px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:13px;
  background:#ffffffee;
  padding:14px 20px;
  border-radius:14px;
  font-size:12px;
  font-weight:700;
  box-shadow:0 6px 28px #16202f12
}
.hero-badge .icon {
  width:30px;
  font-size:28px;
  height:30px
}
/* Filters and inventory */
.search-panel {
  position:relative;
  z-index:3;
  background:#fff;
  border-radius:18px;
  box-shadow:0 6px 24px #26354e04;
  padding:19px 17px;
  display:grid;
  grid-template-columns:1fr 1.08fr 1fr 1.2fr 1.25fr .9fr;
  align-items:center;
  gap:18px;
  min-height:106px;
  margin-top:-1px
}
.field label,.price-field legend {
  display:block;
  font-size:11px;
  font-weight:650;
  margin-bottom:6px
}
.field select,.field input,.field textarea,.price-inputs input {
  width:100%;
  border:1px solid #e0e5ed;
  border-radius:8px;
  background:#fff;
  padding:10px 12px;
  color:#303845;
  min-height:42px;
  font-size:12px
}
.field select {
  padding-right:25px
}
.price-field {
  border:0;
  padding:0;
  margin:0;
  min-width:0
}
.price-field legend {
  padding:0
}
.price-inputs {
  display:flex;
  align-items:center;
  gap:5px
}
.price-inputs input {
  min-width:0;
  padding:6px 8px;
  font-weight:750;
  min-height:35px;
  width:42%
}
.switch-label {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:12px;
  cursor:pointer;
  white-space:nowrap
}
.switch-label input {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0
}
.switch {
  display:block;
  width:37px;
  height:22px;
  background:#98a2b2;
  border-radius:20px;
  position:relative;
  flex-shrink:0
}
.switch:before {
  content:'';
  width:18px;
  height:18px;
  position:absolute;
  left:2px;
  top:2px;
  border-radius:50%;
  background:#fff;
  box-shadow:0 1px 3px #0002;
  transition:transform .15s
}
.switch-label input:checked+.switch {
  background:#d8ad00
}
.switch-label input:checked+.switch:before {
  transform:translateX(15px)
}
.switch-label input:focus-visible+.switch {
  outline:3px solid #215cf4;
  outline-offset:3px
}
.search-submit {
  min-height:50px;
  font-size:15px
}
.form-error {
  color:#b32121;
  font-size:12px;
  grid-column:1/-1
}
.car-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px
}
.car-card {
  background:#fff;
  border:1px solid var(--color-border);
  border-radius:11px;
  overflow:hidden;
  box-shadow:0 4px 8px #32496803;
  display:flex;
  flex-direction:column
}
.car-photo {
  position:relative;
  aspect-ratio:1.83
}
.car-photo>img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover
}
.favorite-button {
  position:absolute;
  right:9px;
  top:9px;
  color:white;
  width:33px;
  height:33px;
  background:#1115;
  border-radius:50%;
  display:grid;
  place-items:center
}
.favorite-button .icon {
  width:23px;
  font-size:21px;
  height:23px;
}
.favorite-button[aria-pressed=true] {
  color:#ffce00;
  background:#1118
}
.favorite-button[aria-pressed=true] .icon {
  color:#ffce00
}
.availability {
  position:absolute;
  left:10px;
  bottom:9px;
  background:#ffffffeb;
  color:#13794c;
  font-size:9px;
  font-weight:750;
  padding:3px 7px;
  border-radius:5px
}
.availability:before {
  content:'';
  display:inline-block;
  background:var(--color-success);
  width:5px;
  height:5px;
  border-radius:50%;
  margin-right:5px
}
.car-body {
  padding:12px 14px 14px;
  display:flex;
  flex-direction:column;
  flex:1
}
.car-body h3 {
  font-family:var(--font-heading);
  font-size:20px;
  font-weight:750;
  line-height:1.3
}
.car-meta {
  color:var(--color-muted);
  font-size:11px;
  margin-top:3px
}
.car-price {
  font-size:24px;
  font-weight:850;
  color:#0a0a0a;
  margin-top:11px;
  line-height:1.3
}
.car-price small {
  font-size:17px
}
.car-tags {
  display:flex;
  gap:6px;
  margin-top:9px;
  flex-wrap:wrap
}
.car-tags span {
  font-size:10px;
  background:#f2f4f7;
  border-radius:5px;
  padding:4px 6px;
  white-space:nowrap
}
.car-tags .icon {
  width:12px;
  font-size:10px;
  height:12px;
  margin-right:3px
}
.car-conditions {
  list-style:none;
  margin:12px 0 16px;
  padding:0;
  font-size:11px;
  line-height:1.85
}
.car-conditions li {
  display:flex;
  align-items:baseline;
  gap:7px
}
.car-conditions .icon {
  width:12px;
  font-size:10px;
  height:12px;
  flex-shrink:0
}
.car-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:auto
}
.car-actions .button {
  padding:8px 7px;
  min-height:41px;
  font-size:11px;
  border-radius:8px
}
.car-actions .icon {
  width:18px;
  font-size:16px;
  height:18px
}
.results-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin:-5px 0 13px;
  font-size:12px;
  color:var(--color-muted)
}
.empty-state {
  text-align:center;
  padding:44px 20px;
  background:#fff;
  border:1px dashed #cbd3df;
  border-radius:12px
}
.empty-state>.icon {
  height:36px;
  width:36px;
  font-size:34px;
  margin-bottom:10px
}
.empty-state p {
  margin:10px 0 18px
}
/* Supporting sections */
.benefits {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  background:linear-gradient(110deg,#edf1f6,#f4f6f9);
  border:1px solid #edf0f4;
  border-radius:13px;
  padding:22px 14px 25px;
  text-align:center;
  gap:20px
}
.circle-icon {
  display:flex;
  align-items:center;
  justify-content:center;
  width:66px;
  height:66px;
  border-radius:50%;
  background:#ffe9a4;
  box-shadow:inset 0 0 0 7px #fff2cb;
  margin:0 auto 12px;
  color:#111c2a
}
.circle-icon .icon {
  width:35px;
  font-size:33px;
  height:35px;
}
.benefits h3 {
  font-size:18px;
  line-height:1.35;
  min-height:49px;
  display:flex;
  align-items:center;
  justify-content:center
}
.benefits p {
  color:#5f6878;
  font-size:13px;
  line-height:1.6;
  margin-top:5px
}
.partner-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}
.partner-banner {
  min-height:266px;
  border-radius:12px;
  background-size:cover;
  background-position:center;
  position:relative;
  overflow:hidden;
  color:white;
  padding:35px 30px 25px;
  display:flex;
  align-items:center
}
.partner-banner h2 {
  font-family:var(--font-accent);
  font-weight:400;
  font-synthesis:none;
  color:white;
  font-size:28px;
  line-height:1.3
}
.partner-banner p {
  margin:20px 0 18px;
  font-size:15px;
  font-weight:550
}
.partner-banner.owner {
  background-image:linear-gradient(90deg,#08101705 12%,#07121cac 49%,#081017db 100%),url('../images/owner-banner.opt.webp')
}
.partner-banner.owner>div {
  margin-left:44%
}
.partner-banner.fleet {
  background-image:linear-gradient(90deg,#081017e8 0%,#0810178a 55%,#08101726 100%),url('../images/fleet-banner.opt.webp')
}
.partner-banner .button {
  font-size:13px;
  padding:12px 20px
}
.steps-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px
}
.steps-grid article {
  display:flex;
  gap:18px;
  border:1px solid #f0f2f5;
  background:#ffffffbc;
  border-radius:12px;
  padding:18px 15px;
  align-items:flex-start
}
.step-icon {
  width:54px;
  height:54px;
  border-radius:50%;
  background:#e8edf5;
  flex-shrink:0;
  display:grid;
  place-items:center;
  color:#142031
}
.step-icon .icon {
  width:31px;
  font-size:29px;
  height:31px
}
.steps-grid b {
  font-size:22px;
  line-height:1.1;
  color:#0a0a0a
}
.steps-grid h3 {
  font-size:16px;
  margin:4px 0
}
.steps-grid p {
  color:#5d6676;
  font-size:13px
}
.brand-grid {
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:12px
}
.brand-tile {
  border:1px solid #edf0f5;
  border-radius:12px;
  background:#ffffffd9;
  min-height:87px;
  padding:15px 5px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-family:var(--font-heading)
}
.brand-tile:hover {
  border-color:#e8b800;
  background:#fff9e0
}
.brand-tile strong {
  font-size:19px;
  letter-spacing:-.7px
}
.brand-tile span {
  font-size:11px;
  color:#525d70
}
.brand-tile:nth-child(2) strong,.brand-tile:nth-child(6) strong {
  font-size:15px
}
.brand-tile:nth-child(4) strong,.brand-tile:nth-child(8) strong {
  font-size:16px
}
.review-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px
}
.review-grid article {
  background:#ffffffd9;
  border:1px solid #eff1f5;
  border-radius:13px;
  padding:20px 24px;
  display:flex;
  gap:18px
}
.avatar {
  width:49px;
  height:49px;
  flex-shrink:0;
  border-radius:50%;
  background:#e8edf0;
  color:#455d60;
  display:grid;
  place-items:center;
  font-size:23px;
  font-weight:700;
  border:3px solid #fff
}
.review-grid h3 {
  font-size:15px
}
.stars {
  letter-spacing:2px;
  color:#f6b900;
  font-family:Arial,sans-serif;
  font-size:21px
}
.review-grid p {
  font-size:13px;
  line-height:1.6;
  color:#5a6372;
  margin-top:9px
}
.demo-label {
  font-size:10px;
  color:#687080
}
.faq-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:9px 24px;
  align-items:start
}
.faq details {
  background:#ffffffd9;
  border:1px solid #edf0f4;
  border-radius:8px;
  font-size:13px
}
.faq summary {
  cursor:pointer;
  font-weight:600;
  list-style:none;
  padding:12px 17px;
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center
}
.faq summary::-webkit-details-marker {
  display:none
}
.faq summary .icon {
  width:12px;
  height:12px;
  font-size:12px;
}
.faq details[open] summary .icon {
  transform:rotate(180deg);
}
.faq details p {
  padding:0 17px 15px;
  color:#596576;
  line-height:1.8
}
.closing-banner {
  margin-top:26px;
  background:linear-gradient(#07131a7d,#07131a99),url('../images/city-night.opt.webp') center 60%/cover;
  text-align:center;
  padding:22px 0 25px;
  color:#fff
}
.closing-banner h2 {
  font-family:var(--font-accent);
  font-weight:400;
  font-synthesis:none;
  color:#fff;
  font-size:30px
}
.closing-banner p {
  font-size:15px;
  margin:7px 0 16px
}
.closing-banner .container>div {
  display:flex;
  justify-content:center;
  gap:18px
}
.light {
  background:#10182040;
  border-color:white;
  color:white
}
.light:hover {
  background:#10182088
}
/* Footer */
footer {
  background:#f6f7f9;
  padding:23px 0 18px
}
.footer-grid {
  display:grid;
  grid-template-columns:1.6fr 1fr 1.2fr 1fr;
  gap:25px
}
.footer-brand .logo {
  font-size:27px
}
.footer-brand p {
  font-size:12px;
  color:var(--color-muted);
  margin:4px 0 13px
}
.footer-grid h3 {
  font-size:13px;
  margin-bottom:7px
}
.footer-grid>div>a:not(.logo),.footer-link {
  display:block;
  font-size:12px;
  color:#5c6575;
  line-height:1.85;
  padding:0;
  text-align:left
}
.footer-link:hover,.footer-grid>div>a:not(.logo):hover {
  text-decoration:underline
}
.contact-info p {
  display:flex;
  align-items:center;
  gap:19px;
  font-size:12px;
  margin-bottom:9px
}
.contact-info .icon {
  width:16px;
  font-size:14px;
  height:16px;
  color:#111c2c
}
.copyright {
  grid-column:1/-1;
  text-align:right;
  font-size:11px;
  color:var(--color-muted)
}
/* Dialogs and form states */
dialog {
  width:650px;
  max-width:calc(100% - 28px);
  max-height:calc(100dvh - 40px);
  padding:24px;
  border:1px solid var(--color-border);
  border-radius:18px;
  box-shadow:0 20px 90px #0003;
  color:var(--color-text);
  background:white
}
dialog::backdrop {
  background:#101925aa;
  backdrop-filter:blur(4px)
}
body.modal-open {
  overflow:hidden
}
.modal-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:15px;
  margin-bottom:16px
}
.modal-header h2 {
  font-size:23px
}
.modal-header .icon-button {
  flex-shrink:0
}
#modal-body {
  font-size:14px
}
.detail-image {
  width:100%;
  height:auto;
  aspect-ratio:1.75;
  object-fit:cover;
  border-radius:10px
}
.detail-price {
  font-size:28px;
  font-weight:850;
  margin:15px 0
}
.detail-specs {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:16px 0
}
.detail-specs div {
  padding:11px;
  background:#f5f6f8;
  border-radius:7px
}
.detail-specs dt {
  font-size:11px;
  color:var(--color-muted)
}
.detail-specs dd {
  margin:3px 0 0;
  font-weight:650
}
.notice {
  background:#fff8dc;
  border:1px solid #f2e4a7;
  border-radius:8px;
  padding:12px 14px;
  font-size:12px;
  line-height:1.7;
  margin:14px 0;
  color:#64551d
}
.dialog-form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:15px
}
.dialog-form .full {
  grid-column:1/-1
}
.dialog-form .field label {
  font-size:12px
}
.dialog-form textarea {
  min-height:80px;
  resize:vertical
}
.dialog-form input,.dialog-form select {
  font-size:14px
}
.upload-preview {
  width:100%;
  max-height:200px;
  object-fit:contain;
  background:#f2f4f7;
  border-radius:8px;
  margin-top:10px
}
.form-actions {
  display:flex;
  gap:12px;
  flex-wrap:wrap
}
.form-success {
  color:#17653f;
  background:#e9f7ef;
  border-radius:8px;
  padding:12px;
  font-size:13px
}
.auth-tabs {
  display:flex;
  gap:7px;
  margin-bottom:18px;
  background:#f1f3f6;
  border-radius:9px;
  padding:4px
}
.auth-tabs button {
  flex:1;
  border-radius:7px;
  padding:10px;
  font-weight:650
}
.auth-tabs button[aria-pressed=true] {
  background:#ffcf00
}
.preview-box {
  padding:18px;
  background:#f6f7f9;
  border:1px solid #e2e7ee;
  border-radius:11px;
  margin-top:15px
}
.preview-box h3 {
  margin-bottom:8px
}
.preview-box p {
  white-space:pre-wrap;
  overflow-wrap:anywhere
}
.preview-box .upload-preview {
  margin-bottom:12px
}
.toast {
  position:fixed;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  z-index:30;
  background:#152030;
  color:#fff;
  box-shadow:0 6px 35px #0003;
  border-radius:10px;
  padding:15px 23px;
  width:max-content;
  max-width:calc(100% - 32px);
  font-size:13px
}
/* Responsive layouts */
@media(min-width:1450px) {
  .container {
    max-width:1320px
  }
  .hero-inner {
    height:455px
  }
  .hero-copy {
    padding-top:49px
  }
  .hero h1 {
    font-size:52px
  }
  .car-photo {
    aspect-ratio:1.8
  }
}
@media(max-width:1250px) {
  .header-inner {
    gap:14px
  }
  .main-nav {
    gap:14px;
    font-size:10px
  }
  .logo {
    font-size:25px;
    gap:6px
  }
  .logo img {
    width:56px
  }
  .header-actions {
    gap:4px
  }
  .header-actions .button {
    font-size:10px;
    padding:9px
  }
  .hero-copy {
    padding-left:16px
  }
  .hero h1 {
    font-size:43px
  }
  .hero-inner {
    height:400px
  }
  .hero-copy>p {
    font-size:16px
  }
  .hero-actions {
    gap:10px
  }
  .hero-actions .large {
    font-size:13px;
    padding:13px 19px
  }
  .search-panel {
    gap:12px;
    grid-template-columns:1fr 1fr 1fr 1.2fr 1.2fr .9fr
  }
  .switch-label {
    font-size:10px;
    gap:7px
  }
  .car-body {
    padding:11px
  }
  .car-grid {
    gap:14px
  }
  .car-tags span {
    font-size:9px
  }
  .car-conditions {
    font-size:10px
  }
  .partner-banner {
    padding:27px 22px;
    min-height:250px
  }
  .partner-banner h2 {
    font-size:24px
  }
  .partner-banner p {
    font-size:13px
  }
  .partner-banner .button {
    font-size:11px;
    padding:11px 15px
  }
  .steps-grid article {
    gap:11px;
    padding:16px 12px
  }
  .step-icon {
    width:43px;
    height:43px
  }
  .steps-grid h3 {
    font-size:14px
  }
  .steps-grid p {
    font-size:11px
  }
  .benefits h3 {
    font-size:16px
  }
  .review-grid article {
    padding:18px 16px;
    gap:12px
  }
}
@media(max-width:1050px) {
  .container {
    width:calc(100% - 40px)
  }
  .main-nav {
    display:none;
    position:absolute;
    top:70px;
    left:20px;
    right:20px;
    background:#fff;
    border:1px solid var(--color-border);
    box-shadow:0 12px 28px #0002;
    border-radius:10px;
    padding:12px;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    font-size:14px
  }
  .main-nav.open {
    display:flex
  }
  .main-nav a {
    padding:12px
  }
  .main-nav a:after {
    display:none
  }
  .menu-toggle {
    display:inline-flex
  }
  .header-actions .button {
    font-size:11px;
    padding:10px 15px
  }
  .hero h1 {
    font-size:37px
  }
  .hero-copy {
    padding-top:37px;
    width:60%;
    padding-left:10px
  }
  .hero-inner {
    height:370px
  }
  .hero-copy>p {
    font-size:14px
  }
  .hero-actions .large {
    font-size:12px;
    padding:11px 14px
  }
  .hero-note {
    font-size:18px
  }
  .hero-car {
    width:47%;
    bottom:-12px;
    right:0
  }
  .hero-badge {
    font-size:10px;
    padding:11px 14px;
    bottom:22px
  }
  .search-panel {
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px 18px
  }
  .search-submit {
    min-height:43px
  }
  .switch-label {
    font-size:12px
  }
  .car-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px
  }
  .car-photo {
    aspect-ratio:1.85
  }
  .car-body {
    padding:17px
  }
  .car-body h3 {
    font-size:23px
  }
  .car-meta,.car-conditions {
    font-size:13px
  }
  .car-tags span {
    font-size:11px
  }
  .car-actions .button {
    font-size:13px
  }
  .partner-banner.owner>div {
    margin-left:34%
  }
  .partner-banner {
    min-height:255px
  }
  .partner-banner h2 {
    font-size:22px
  }
  .partner-banner p {
    font-size:12px
  }
  .partner-banner .button {
    white-space:normal;
    text-align:left;
    font-size:11px
  }
  .steps-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .steps-grid article {
    gap:20px;
    padding:20px
  }
  .steps-grid p {
    font-size:13px
  }
  .steps-grid h3 {
    font-size:17px
  }
  .brand-grid {
    grid-template-columns:repeat(4,minmax(0,1fr))
  }
  .review-grid {
    gap:12px
  }
  .review-grid article {
    display:block
  }
  .avatar {
    margin-bottom:8px
  }
  .footer-grid {
    grid-template-columns:1.5fr 1fr 1fr
  }
  .contact-info {
    grid-column:1/-1;
    display:flex;
    gap:30px
  }
  .copyright {
    margin-top:-10px
  }
  .benefits p {
    font-size:11px
  }
  .benefits {
    gap:10px
  }
  .benefits h3 {
    font-size:14px
  }
  .circle-icon {
    width:56px;
    height:56px
  }
}
@media(max-width:650px) {
  .container {
    width:calc(100% - 28px)
  }
  .header-inner {
    min-height:64px;
    gap:6px
  }
  .logo {
    font-size:23px
  }
  .logo img {
    width:44px;
    height:44px
  }
  .header-actions {
    gap:1px
  }
  .header-actions .header-add {
    display:none
  }
  .header-actions .login-button {
    padding:9px;
    background:none;
    min-height:40px
  }
  .login-button>span:not([data-icon]) {
    display:none
  }
  .header-actions .icon-button {
    width:35px;
  font-size:33px;
    height:40px
  }
  .header-actions .icon {
    width:21px
  }
  .main-nav {
    top:64px;
    left:14px;
    right:14px
  }
  .hero {
    background-image:linear-gradient(180deg,#f7f9fcfa 0%,#f7f9fce6 36%,#f7f9fc10 68%,#f5f6f8 100%),url('../images/hero-city.opt.webp');
    background-position:center,bottom right;
    background-size:cover,auto 70%;
    background-repeat:no-repeat
  }
  .hero-inner {
    height:615px
  }
  .hero-copy {
    padding:28px 8px 0;
    width:100%
  }
  .hero h1 {
    font-size:36px;
    letter-spacing:-1px;
    line-height:1.25
  }
  .hero-copy>p {
    font-size:13px;
    margin-top:15px
  }
  .hero-actions {
    gap:9px;
    margin-top:19px
  }
  .hero-actions .large {
    font-size:11px;
    min-height:46px;
    border-radius:13px;
    padding:10px 12px;
    gap:6px;
    flex:1
  }
  .hero-actions .icon {
    width:18px;
  font-size:16px;
    height:18px
  }
  .hero-car {
    width:100%;
    right:-2px;
    bottom:-2px
  }
  .hero-note {
    top:350px;
    right:8px;
    width:140px;
    font-size:15px
  }
  .hero-badge {
    bottom:13px;
    right:5px;
    padding:9px 13px;
    border-radius:9px;
    font-size:9px
  }
  .hero-badge .icon {
    width:22px;
  font-size:20px;
    height:22px
  }
  .search-panel {
    grid-template-columns:1fr 1fr;
    padding:16px;
    gap:15px 12px;
    border-radius:14px
  }
  .search-panel .field:nth-child(3) {
    grid-column:1
  }
  .search-submit {
    font-size:13px
  }
  .switch-label {
    font-size:10px;
    gap:7px
  }
  .switch {
    width:33px;
    height:20px
  }
  .switch:before {
    width:16px;
    height:16px
  }
  .switch-label input:checked+.switch:before {
    transform:translateX(13px)
  }
  .field label,.price-field legend {
    font-size:10px
  }
  .price-inputs input {
    font-size:11px
  }
  .section {
    margin-top:26px
  }
  h2 {
    font-size:20px
  }
  .section-heading {
    gap:12px;
    align-items:flex-start;
    margin-bottom:13px
  }
  .listings .section-heading {
    flex-wrap:wrap;
    gap:5px
  }
  .text-link {
    font-size:11px
  }
  .car-grid {
    grid-template-columns:1fr;
    gap:17px
  }
  .car-photo {
    aspect-ratio:1.7
  }
  .car-body {
    padding:16px
  }
  .car-body h3 {
    font-size:23px
  }
  .car-price {
    font-size:27px
  }
  .car-conditions {
    font-size:12px;
    margin:14px 0 17px
  }
  .car-tags span {
    font-size:11px
  }
  .car-actions .button {
    min-height:44px
  }
  .benefits {
    grid-template-columns:1fr 1fr;
    padding:22px 13px;
    gap:26px 13px
  }
  .benefits h3 {
    font-size:15px;
    min-height:41px
  }
  .benefits p {
    font-size:10px
  }
  .partner-grid {
    grid-template-columns:1fr;
    gap:15px
  }
  .partner-banner {
    min-height:230px;
    padding:26px 20px
  }
  .partner-banner.owner>div {
    margin-left:39%
  }
  .partner-banner h2 {
    font-size:22px
  }
  .partner-banner p {
    font-size:11px
  }
  .partner-banner .button {
    font-size:10px;
    padding:11px 12px;
    gap:5px
  }
  .steps-grid {
    gap:11px
  }
  .steps-grid article {
    padding:14px 12px;
    gap:10px;
    display:block
  }
  .step-icon {
    width:42px;
    height:42px;
    margin-bottom:12px
  }
  .step-icon .icon {
    width:26px;
  font-size:24px;
    height:26px
  }
  .steps-grid h3 {
    font-size:14px
  }
  .steps-grid p {
    font-size:11px
  }
  .steps-grid b {
    font-size:18px
  }
  .brand-grid {
    gap:8px
  }
  .brand-tile {
    min-height:75px;
    padding:13px 3px;
    gap:5px
  }
  .brand-tile strong {
    font-size:14px
  }
  .brand-tile:nth-child(2) strong,.brand-tile:nth-child(4) strong,.brand-tile:nth-child(6) strong,.brand-tile:nth-child(8) strong {
    font-size:10px;
    letter-spacing:-.4px
  }
  .brand-tile span {
    font-size:8px
  }
  .testimonials .section-heading {
    display:block
  }
  .testimonials .demo-label {
    display:block;
    margin-top:6px
  }
  .review-grid {
    grid-template-columns:1fr
  }
  .review-grid article {
    display:flex;
    padding:19px;
    gap:15px
  }
  .review-grid p {
    font-size:12px
  }
  .faq-grid {
    grid-template-columns:1fr;
    gap:9px
  }
  .faq summary {
    font-size:11px;
    padding:13px
  }
  .faq details p {
    font-size:12px
  }
  .closing-banner {
    padding:27px 0
  }
  .closing-banner h2 {
    font-size:23px
  }
  .closing-banner p {
    font-size:12px;
    line-height:1.7
  }
  .closing-banner .container>div {
    gap:9px
  }
  .closing-banner .large {
    font-size:10px;
    padding:12px 13px;
    min-height:46px;
    border-radius:12px;
    flex:1
  }
  .footer-grid {
    grid-template-columns:1fr 1fr;
    gap:24px
  }
  .footer-brand {
    grid-column:1/-1
  }
  .contact-info {
    display:block
  }
  .copyright {
    text-align:left;
    font-size:10px;
    margin-top:-5px
  }
  .results-bar {
    font-size:11px;
    align-items:flex-start
  }
  .results-bar .text-link {
    font-size:10px;
    text-align:right
  }
  dialog {
    padding:17px;
    max-height:calc(100dvh - 24px);
    max-width:calc(100% - 20px)
  }
  .modal-header h2 {
    font-size:20px
  }
  .dialog-form {
    grid-template-columns:1fr
  }
  .dialog-form .full {
    grid-column:auto
  }
  .detail-specs {
    gap:8px
  }
  .detail-specs div {
    padding:9px
  }
  .detail-specs dd {
    font-size:12px
  }
  .detail-image {
    aspect-ratio:1.4
  }
  .toast {
    font-size:12px;
    padding:13px 16px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    transition:none!important;
    animation:none!important
  }
}

.stars { display:inline-flex; gap:3px; }
.stars .icon { width:16px; height:20px; font-size:16px; }

/* Reference marketplace: compact filters, four cars and a separate right rail. */
.hero-highlights {
  position:absolute;
  left:38px;
  bottom:18px;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(4,auto);
  align-items:center;
  gap:14px;
  width:max-content;
  max-width:calc(100vw - 100px);
  list-style:none;
  padding:0;
  margin:0;
  font-size:9px;
  color:#26303a;
}
.hero-highlights li { display:flex; align-items:center; gap:9px; white-space:nowrap; }
.hero-highlights [data-icon] { display:grid; place-items:center; width:27px; height:27px; border-radius:8px; background:#ffe16b; color:#7e6300; flex-shrink:0; }
.hero-highlights .icon { width:17px; height:17px; font-size:17px; }
.marketplace-layout { display:grid; grid-template-columns:minmax(0,1fr) 250px; gap:20px; align-items:start; }
.marketplace-main { min-width:0; }
.marketplace-main .search-panel { grid-template-columns:1fr 1.15fr .85fr 1.3fr 1.45fr .8fr; gap:10px; padding:16px; min-height:91px; }
.marketplace-main .search-panel label,.marketplace-main .price-field legend { font-size:10px; }
.marketplace-main .field select { padding:8px; padding-right:20px; min-height:37px; font-size:11px; }
.marketplace-main .price-inputs { gap:4px; }
.price-box { display:flex; align-items:center; border:1px solid #e0e5ed; border-radius:8px; min-width:0; flex:1; background:white; }
.price-box input { width:100%; padding:7px 0 7px 6px; border:0; min-height:35px; font-size:11px; -moz-appearance:textfield; }
.price-box input::-webkit-inner-spin-button,.price-box input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.price-box>span { padding-right:7px; font-size:11px; }
.marketplace-main .switch-label { gap:8px; margin-top:18px; justify-content:center; }
.marketplace-main .search-submit { min-height:40px; margin-top:18px; padding:9px 14px; font-size:13px; }
.marketplace-main .listings { margin-top:20px; }
.marketplace-main .section-heading { align-items:center; gap:8px; }
.marketplace-main h2 { font-size:21px; }
.sort-control { display:flex; align-items:center; gap:7px; font-size:11px; white-space:nowrap; }
.sort-control select { max-width:150px; min-height:32px; padding:5px 23px 5px 8px; border:1px solid #e6e9ef; border-radius:7px; background:#ffffffb5; font-size:11px; }
.marketplace-sidebar { display:grid; gap:16px; }
.sidebar-card { background:linear-gradient(135deg,#fff,#f9f9fc); border:1px solid #e9ecf1; border-radius:16px; padding:17px; box-shadow:0 7px 22px #23375506; }
.sidebar-card h2 { font-size:18px; line-height:1.4; }
.sidebar-subtitle { font-size:11px; color:#596270; margin:2px 0 11px; }
.fleet-row { display:flex; align-items:center; gap:10px; width:100%; padding:12px 0; text-align:left; border-bottom:1px solid #e9ecf2; }
.fleet-row:last-child { border-bottom:0; }
.fleet-row:hover .fleet-copy strong { color:#8a6700; }
.fleet-mark { display:grid; place-items:center; flex-shrink:0; width:43px; height:43px; border-radius:10px; background:#151515; color:white; font-family:var(--font-heading); font-size:12px; font-weight:750; letter-spacing:-.5px; }
.fleet-mark.bolt { background:#00b863; font-size:20px; }
.fleet-mark.yandex { font-size:10px; }
.fleet-mark.city-taxi { color:#ffcc00; font-size:8px; letter-spacing:0; }
.fleet-copy { flex:1; min-width:0; }
.fleet-copy strong { display:block; font-size:11px; line-height:1.5; }
.fleet-copy small { display:block; margin-top:3px; font-size:11px; }
.fleet-chevron .icon { width:10px; height:12px; font-size:11px; transform:rotate(-90deg); color:#677083; }
.sidebar-button { width:100%; min-height:35px; border:1px solid #ffc629; border-radius:10px; font-size:11px; padding:7px 10px; margin-top:8px; background:#fff; }
.sidebar-button:hover { background:#fff6d4; }
.sidebar-button .icon { width:15px; height:15px; font-size:13px; }
.sidebar-demo { display:block; text-align:center; color:#7c8390; font-size:9px; margin-top:8px; }
.jobs-card h2 { font-size:16px; }
.jobs-intro { display:flex; align-items:center; gap:14px; margin:18px 0 11px; }
.jobs-intro>.icon,.jobs-intro [data-icon] .icon { width:38px; height:38px; font-size:35px; color:#ffbf00; }
.jobs-intro p { font-size:11px; line-height:1.7; color:#5b6370; }
@media(min-width:1051px) {
  .marketplace-main .car-grid { gap:12px; }
  .marketplace-main .car-body { padding:10px; }
  .marketplace-main .car-body h3 { font-size:17px; }
  .marketplace-main .car-meta { font-size:9px; }
  .marketplace-main .car-price { font-size:22px; margin-top:9px; }
  .marketplace-main .car-price small { font-size:14px; }
  .marketplace-main .car-tags { gap:4px; }
  .marketplace-main .car-tags span { font-size:8px; padding:3px 4px; }
  .marketplace-main .car-conditions { font-size:9px; gap:4px; margin:10px 0 12px; }
  .marketplace-main .car-actions { gap:7px; }
  .marketplace-main .car-actions .button { min-height:34px; font-size:9px; padding:7px 5px; gap:5px; }
  .marketplace-main .availability { top:9px; bottom:auto; background:#159e59; color:white; font-size:8px; }
  .marketplace-main .availability:before { background:white; }
}
@media(min-width:1051px) and (max-width:1250px) {
  .marketplace-layout { grid-template-columns:minmax(0,1fr) 220px; gap:16px; }
  .marketplace-main .search-panel { gap:7px; padding:13px; }
  .marketplace-main .switch-label { font-size:9px; gap:5px; }
  .marketplace-main .switch { width:31px; }
  .marketplace-main .switch-label input:checked+.switch:before { transform:translateX(9px); }
  .marketplace-main h2 { font-size:18px; }
  .sidebar-card { padding:14px; }
  .fleet-row { gap:8px; }
  .fleet-copy strong { font-size:10px; }
  .hero-highlights { left:16px; gap:10px; font-size:9px; }
  .hero-highlights li { gap:6px; }
}
@media(max-width:1050px) {
  .marketplace-layout { grid-template-columns:1fr; }
  .marketplace-sidebar { grid-template-columns:1fr 1fr; align-items:start; }
  .marketplace-main .search-panel { grid-template-columns:repeat(3,minmax(0,1fr)); gap:13px 18px; }
  .marketplace-main .search-submit,.marketplace-main .switch-label { margin-top:0; }
  .hero-highlights { left:10px; gap:12px; font-size:9px; margin:0; }
  .hero-highlights li { gap:6px; }
  .hero-highlights [data-icon] { width:24px; height:24px; }
}
@media(max-width:650px) {
  .hero-inner { height:660px; }
  .hero-highlights { top:310px; bottom:auto; left:8px; width:calc(100% - 16px); max-width:none; grid-template-columns:1fr 1fr; gap:12px 8px; margin:0; font-size:9px; }
  .hero-note { top:380px; }
  .hero-highlights li { white-space:normal; }
  .marketplace-main .search-panel { grid-template-columns:1fr 1fr; padding:15px; gap:15px 12px; }
  .marketplace-main .switch-label { justify-content:flex-start; gap:7px; }
  .marketplace-main .switch-label>span:first-child { font-size:9px; }
  .marketplace-main .section-heading { align-items:flex-start; flex-direction:column; gap:9px; }
  .marketplace-main h2 { font-size:19px; }
  .sort-control { align-self:flex-end; }
  .marketplace-sidebar { grid-template-columns:1fr; }
  .sidebar-card { padding:18px; }
  .fleet-copy strong { font-size:13px; }
  .fleet-copy small { font-size:12px; }
  .sidebar-demo { font-size:10px; }
}

@media(max-width:650px){.hero{background-image:linear-gradient(180deg,#f7f9fcfa 0%,#f7f9fce6 36%,#f7f9fc10 68%,#f5f6f8 100%),url("../images/hero-city-mobile.webp");}}

.hero-highlights [data-icon]{width:29px;height:29px;flex:0 0 29px;background:#fff0b3;color:#947100;opacity:1;display:grid;place-items:center}.hero-highlights .highlight-icon{display:block;width:19px;height:19px;opacity:1}

.header-actions .favorites-toggle{display:inline-flex;align-items:center;justify-content:center;padding:0;line-height:1;box-sizing:border-box}.favorites-toggle [data-icon]{display:flex;align-items:center;justify-content:center;width:24px;height:24px;line-height:1}.favorites-toggle .header-heart{display:block;width:22px;height:22px;flex:none;color:#263240}