:root {
  font-family: "Segoe UI", Arial, sans-serif;
  color: #1b2a24;
  background: #faf9f5;
  scroll-behavior: smooth;
}
* { box-sizing: border-box; }
body { margin: 0; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
.wrap { width: min(1220px, calc(100% - 64px)); margin-inline: auto; }
.site-header { display: flex; align-items: center; gap: 42px; min-height: 86px; }
.brand { display: inline-flex; align-items: center; gap: 11px; flex: none; color: #193429; font-size: 26px; font-weight: 800; letter-spacing: -.065em; text-decoration: none; }
.mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 11px 11px 11px 3px; background: #255b47; color: #e8ff9a; font-size: 21px; font-weight: 800; letter-spacing: -.11em; padding-right: 3px; }
.brand-name { display: block; font-size: 23px; line-height: 1.05; letter-spacing: -.035em; }
.brand-prefix { display: block; font-size: 12px; font-weight: 600; line-height: 1.4; letter-spacing: .01em; }
.header-nav { display: flex; gap: 30px; margin-left: auto; }
.header-nav a { text-decoration: none; font-size: 14px; font-weight: 600; color: #4c5b52; }
.header-nav a:hover, .secondary-link:hover { color: #22704e; }
.header-cta { border: 1px solid #d4ddd2; border-radius: 100px; padding: 12px 17px; text-decoration: none; color: #1f523e; font-size: 13px; font-weight: 700; white-space: nowrap; }
.header-cta span { margin-left: 12px; }
.header-cta:hover { border-color: #2a714f; background: #f1f7ec; }
.hero-shell { background: #f1f3ec; border-top: 1px solid #e9ebe3; border-bottom: 1px solid #e0e7dc; }
.hero { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 6%; align-items: center; min-height: 566px; padding-block: 58px; }
.eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; margin: 0 0 22px; color: #2c684e; font-size: 12px; font-weight: 800; letter-spacing: .095em; line-height: 1.4; text-transform: uppercase; }
.eyebrow-dot { width: 8px; height: 8px; border-radius: 50%; background: #73a54a; box-shadow: 0 0 0 4px #dcebcf; }
.eyebrow-separator { color: #a8b8a8; }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 720px; font-size: clamp(49px, 5.1vw, 73px); line-height: 1.04; letter-spacing: -.065em; margin-bottom: 25px; font-weight: 790; }
h1 em { color: #33744d; font-style: normal; }
.intro { max-width: 620px; color: #53645a; font-size: 18px; line-height: 1.57; margin-bottom: 30px; }
.hero-actions { display: flex; align-items: center; gap: 25px; flex-wrap: wrap; }
.primary-link, button { display: inline-flex; justify-content: center; align-items: center; gap: 25px; padding: 15px 21px; border: 0; border-radius: 11px; background: #265e45; color: white; font-size: 14px; font-weight: 700; text-decoration: none; cursor: pointer; transition: background .15s, transform .15s; }
.primary-link:hover, button:hover:not(:disabled) { background: #174834; transform: translateY(-1px); }
.secondary-link { font-size: 14px; font-weight: 700; text-decoration: underline; text-decoration-color: #aab7aa; text-underline-offset: 5px; }
.hero-small { max-width: 500px; color: #758078; font-size: 12px; line-height: 1.5; margin: 24px 0 0; }
.hero-notice { padding: 14px 16px; margin: 0 0 21px; border-radius: 8px; background: #f9e9bd; color: #5c4819; line-height: 1.5; }
.hero-card, .vehicle-hero { overflow: hidden; border-radius: 19px; background: white; box-shadow: 0 24px 50px #142d1d1c; }
.hero-card { display: flex; flex-direction: column; align-self: center; width: 100%; }
.featured-loading { display: grid; place-items: center; min-height: 360px; color: #56665d; }
.featured-image { order: 1; display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #e8ebe6; }
.featured-top { order: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 15px 20px; }
.featured-tag, .featured-location { color: #42644c; font-size: 11px; font-weight: 750; line-height: 1.2; text-transform: uppercase; letter-spacing: .06em; }
.featured-location { color: #7a897d; }
.featured-bottom { order: 2; padding: 20px 24px 23px; color: #1c2e23; }
.featured-bottom h2 { margin: 0 0 8px; font-size: clamp(24px, 2.5vw, 32px); letter-spacing: -.035em; line-height: 1.12; }
.featured-meta { margin: 0 0 15px; color: #6a7a6e; font-size: 13px; }
.featured-price-row { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.featured-price { font-size: 28px; font-weight: 800; letter-spacing: -.035em; }
.featured-link { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: #d7f29e; color: #244a34; font-size: 20px; text-decoration: none; }
.featured-link:hover { background: #bfeb78; }
.vehicle-page .hero-card { display: none; }
.vehicle-hero { align-self: center; width: 100%; display: flex; flex-direction: column; }
.vehicle-hero img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #e8ebe6; }
.vehicle-hero p { padding: 21px 24px; margin: 0; font-size: 18px; font-weight: 750; }
.value-bar { background: #1b3227; color: #e9efe9; }
.value-grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.value-grid span { display: flex; align-items: center; gap: 14px; min-height: 69px; padding: 14px 22px 14px 0; border-right: 1px solid #ffffff2a; font-size: 13px; font-weight: 600; }
.value-grid span + span { padding-left: 25px; }
.value-grid span:last-child { border: 0; }
.value-grid b { color: #aad87e; font-size: 11px; letter-spacing: .08em; }
.catalog-section { padding-block: 91px 106px; scroll-margin-top: 25px; }
.catalog-heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 30px; }
.section-eyebrow { color: #367853; }
.catalog-heading .eyebrow { margin-bottom: 13px; }
.catalog-heading h2, .steps-heading h2, .section-copy h2 { font-size: clamp(35px, 3.8vw, 52px); line-height: 1.09; letter-spacing: -.055em; margin-bottom: 13px; }
.catalog-heading p:last-child { margin-bottom: 0; color: #607168; font-size: 15px; line-height: 1.5; }
.catalog-count { margin-bottom: 6px; padding: 9px 13px; border-radius: 100px; background: #eaf2e6; color: #315b3c; font-size: 13px; font-weight: 750; white-space: nowrap; }
.catalog-controls { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, .85fr) minmax(0, .95fr); gap: 16px; align-items: end; margin-bottom: 25px; padding: 20px; border: 1px solid #e3e8de; border-radius: 15px; background: white; box-shadow: 0 10px 25px #243d2b08; }
label { display: block; color: #3d4e43; font-size: 12px; font-weight: 700; }
input:not([type=checkbox]), select, textarea { display: block; width: 100%; min-height: 47px; margin-top: 8px; padding: 12px 13px; border: 1px solid #d8e2d8; border-radius: 8px; outline: none; background: #fbfcf9; color: #243b2d; font-size: 14px; }
input:focus, select:focus, textarea:focus { border-color: #3a8a59; box-shadow: 0 0 0 3px #3a8a5926; }
.catalog-status { min-height: 21px; margin: 0; color: #607168; font-size: 13px; }
.car-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 23px; }
.car-card { overflow: hidden; display: flex; flex-direction: column; border: 1px solid #e1e7df; border-radius: 15px; background: white; box-shadow: 0 8px 22px #233b2a0a; transition: transform .16s, box-shadow .16s; }
.car-card:hover { transform: translateY(-3px); box-shadow: 0 17px 35px #233b2a18; }
.car-card.selected { border-color: #5b9565; box-shadow: 0 0 0 2px #7fb36b47; }
.car-photo-link { display: block; position: relative; overflow: hidden; background: #e6e8e2; }
.car-photo-link img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: contain; background: #e8ebe6; }
.car-photo-link::after { content: "В наличии"; position: absolute; top: 14px; left: 14px; padding: 7px 9px; border-radius: 6px; background: #f8faf4ed; color: #315638; font-size: 11px; font-weight: 750; }
.car-body { display: flex; flex: 1; flex-direction: column; padding: 20px; }
.car-body h3 { min-height: 46px; margin: 0 0 10px; font-size: 19px; line-height: 1.23; letter-spacing: -.025em; }
.car-body h3 a { text-decoration: none; }
.car-body h3 a:hover { color: #27734b; }
.car-specs { display: flex; gap: 9px; color: #68776b; font-size: 13px; margin: 0 0 15px; }
.car-specs span + span::before { content: "·"; margin-right: 9px; }
.car-price { display: block; margin-top: auto; padding-top: 4px; color: #1c2d23; font-size: 24px; letter-spacing: -.04em; }
.car-actions { display: flex; align-items: center; gap: 12px; margin-top: 17px; }
.car-button { flex: 1; padding: 11px 12px; border-radius: 8px; font-size: 13px; }
.car-details { flex: none; color: #316e4d; font-size: 13px; font-weight: 700; text-decoration: none; }
.car-details:hover { text-decoration: underline; }
.catalog-more { display: flex; margin: 32px auto 0; padding: 13px 28px; background: white; color: #275d43; border: 1px solid #bacfc0; }
.catalog-more:hover:not(:disabled) { background: #eef5e9; color: #1d5238; }
.steps-band { padding-block: 77px 86px; background: #eaf0e7; scroll-margin-top: 25px; }
.steps-heading { margin-bottom: 32px; }
.steps-heading .eyebrow { margin-bottom: 11px; }
.steps-heading h2 { margin: 0; }
.three-col { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.three-col > div { padding: 26px; border: 1px solid #dce7d9; border-radius: 13px; background: #f8faf5; }
.three-col span { display: block; margin-bottom: 39px; color: #568b61; font-size: 13px; font-weight: 800; }
.three-col h3 { margin-bottom: 9px; font-size: 19px; letter-spacing: -.025em; }
.three-col p { margin: 0; color: #5d6d61; font-size: 14px; line-height: 1.5; }
.form-section { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 8%; padding-block: 104px 112px; scroll-margin-top: 25px; }
.section-copy { padding-top: 15px; }
.section-copy .eyebrow { margin-bottom: 16px; }
.section-copy h2 { max-width: 445px; margin-bottom: 22px; }
.section-copy > p:not(.eyebrow) { max-width: 455px; color: #617067; font-size: 16px; line-height: 1.62; }
.section-copy #interestHint { color: #2d6a48; font-weight: 650; }
.demo-banner { margin-top: 30px; padding: 15px 17px; border: 1px solid #e4d19a; border-radius: 9px; background: #f9efcf; color: #695225; font-size: 13px; line-height: 1.5; }
.form-assurance { margin-top: 29px; padding-left: 18px; border-left: 2px solid #78a765; color: #586b5e; font-size: 13px; line-height: 1.5; }
form { padding: 33px; border: 1px solid #e3e9e1; border-radius: 17px; background: white; box-shadow: 0 15px 38px #233b2a0d; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.finance-details { margin: 24px 0 20px; padding-top: 19px; border-top: 1px solid #e2e9e1; }
.finance-details summary { color: #2e6d4c; font-size: 13px; font-weight: 750; cursor: pointer; }
.finance-details .form-grid { margin-top: 20px; }
textarea { resize: vertical; min-height: 87px; }
.consent { display: flex; gap: 11px; align-items: flex-start; margin-block: 20px 24px; font-weight: 400; line-height: 1.5; }
.consent input { flex: none; margin-top: 3px; accent-color: #286d4a; }
.consent a { color: #276d49; text-underline-offset: 2px; }
.trap { position: absolute; left: -9999px; }
button:disabled { background: #aeb9ad; cursor: not-allowed; transform: none; }
.form-status { min-height: 19px; margin: 14px 0 0; color: #2e694a; font-size: 13px; }
.footer { display: flex; justify-content: space-between; gap: 20px; padding-block: 25px 35px; border-top: 1px solid #e4e8e2; color: #758075; font-size: 12px; }
@media (max-width: 980px) {
  .site-header { gap: 22px; }
  .header-nav { gap: 16px; }
  .hero { gap: 4%; }
  h1 { font-size: clamp(45px, 5.6vw, 60px); }
  .form-section { gap: 5%; }
}
@media (max-width: 760px) {
  .wrap { width: min(100% - 36px, 1220px); }
  .site-header { min-height: 72px; }
  .header-nav { display: none; }
  .header-cta { margin-left: auto; }
  .hero { grid-template-columns: 1fr; gap: 35px; padding-block: 47px 48px; }
  h1 { font-size: clamp(44px, 7vw, 60px); }
  .featured-loading { min-height: 300px; }
  .value-grid { grid-template-columns: 1fr 1fr; }
  .value-grid span:last-child { display: none; }
  .catalog-section { padding-block: 70px 75px; }
  .catalog-controls { grid-template-columns: 1fr 1fr; }
  .catalog-controls label:first-child { grid-column: 1 / -1; }
  .car-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .form-section { grid-template-columns: 1fr; gap: 26px; padding-block: 73px 85px; }
}
@media (max-width: 540px) {
  .site-header { gap: 12px; }
  .brand-name { font-size: 19px; }
  .brand .mark { display: none; }
  .header-cta { padding: 10px 12px; font-size: 12px; }
  .header-cta span { display: none; }
  .hero { gap: 30px; }
  .eyebrow { font-size: 11px; }
  h1 { font-size: clamp(40px, 10vw, 50px); }
  .intro { font-size: 16px; }
  .hero-actions { gap: 17px; }
  .primary-link { padding: 14px 16px; }
  .featured-loading { min-height: 260px; }
  .featured-bottom h2 { font-size: 23px; }
  .featured-price { font-size: 23px; }
  .value-grid { grid-template-columns: 1fr; }
  .value-grid span { min-height: 51px; border-right: 0; padding: 11px 0; }
  .value-grid span + span { display: none; }
  .catalog-heading { align-items: start; flex-direction: column; gap: 12px; }
  .catalog-heading h2, .steps-heading h2, .section-copy h2 { font-size: 37px; }
  .catalog-controls { gap: 12px; padding: 15px; }
  .catalog-controls label { font-size: 11px; }
  .catalog-controls select { font-size: 12px; padding: 11px 9px; }
  .car-grid { grid-template-columns: 1fr; }
  .car-body h3 { min-height: 0; }
  .steps-band { padding-block: 64px; }
  .three-col { grid-template-columns: 1fr; gap: 12px; }
  .three-col > div { padding: 22px; }
  .three-col span { margin-bottom: 18px; }
  form { padding: 21px; }
  .form-grid { grid-template-columns: 1fr; }
  .footer { flex-direction: column; gap: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

