.page {
  max-width: var(--layout-max);
  margin: auto;
  padding: 0 var(--layout-gutter);
}
.logo-a {
  color: var(--color-accent);
}

h1>span {
  display: block;
  white-space: nowrap;
}
.hero-copy>p {
  font-size: clamp(var(--size-21),2.3vw,var(--size-36));
  line-height: 1.28;
  letter-spacing: -.045em;
  margin: 0;
}
.home-field label {
  display: block;
  color: var(--color-muted);
  font-size: var(--text-sm);
}
.home-field input::placeholder {
  color: var(--color-placeholder);
  font-size: var(--text-xs);
}
.home-field input:focus {
  border-bottom-color: var(--color-ink);
}
.form-status:empty {
  display: none;
}
.step p {
  font-size: var(--text-body-small);
  color: var(--color-muted);
  line-height: 1.4;
  margin: 0;
}
html.has-dialog {
  overflow: hidden;
}
html {
  scrollbar-gutter: stable;
}
dialog::backdrop {
  backdrop-filter: blur(var(--dialog-blur));
  -webkit-backdrop-filter: blur(var(--dialog-blur));
  background: var(--color-backdrop);
}
.dialog-close {
  position: absolute;
  right: var(--space-3);
  top: var(--space-2);
  border: 0;
  background: none;
  font-size: var(--space-8);
  cursor: pointer;
  min-width: var(--size-44);
  min-height: var(--size-44);
}
.buyout-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
.buyout-note {
  color: var(--color-muted);
  font-size: var(--text-xs);
  line-height: 1.4;
}
.buyout-list {
  border-top: var(--size-1) solid var(--color-ink);
}
.buyout-item:hover {
  background: var(--color-surface-hover);
}
.buyout-item p {
  font-size: var(--text-sm);
  color: var(--color-muted);
  max-width: 34ch;
  margin: 0;
  line-height: 1.5;
}
.buyout-icon {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  color: var(--color-accent);
}
.buyout-icon svg {
  width: var(--space-8);
  height: var(--space-8);
  transition: color var(--motion-fast);
}
.buyout-item:hover .buyout-icon {
  color: var(--color-ink);
}

.hero-grid {
  display: grid;
  min-height: var(--size-475);
  border-bottom: var(--size-1) solid var(--color-line-strong);
  grid-template-columns: 30% 32% 38%;
}
.form-column {
  display: flex;
  align-items: center;
  padding: var(--space-8) 0 var(--space-8) var(--layout-gap);
}
.valuation-form {
  background: var(--color-surface);
  width: 100%;
  padding: var(--panel-inset);
  display: flex;
  flex-direction: column;
  gap: var(--form-gap);
}
.home-field {
  position: relative;
  margin-bottom: var(--space-4);
  margin: 0;
  display: grid;
  gap: var(--space-2);
}
.home-field input {
  display: block;
  width: 100%;
  border: 0;
  border-bottom: var(--size-1) solid var(--color-line-strong);
  border-radius: 0;
  font-size: var(--text-sm);
  background: transparent;
  padding: 0 0 var(--space-3);
  min-height: var(--size-36);
}
.valuation-form .button {
  margin-top: var(--space-2);
  justify-content: center;
  font-size: var(--text-base);
  margin: var(--space-2) 0 0;
  min-height: var(--control-height);
}
.photo-link {
  border: 0;
  background: none;
  color: var(--color-ink);
  display: block;
  text-decoration: underline;
  text-underline-offset: var(--space-1);
  font-size: var(--text-xs);
  cursor: pointer;
  margin: 0;
  min-height: var(--size-44);
  align-self: center;
  padding: var(--space-2) 0;
}
.form-status {
  font-size: var(--text-small-caption);
  color: var(--color-muted);
  margin: 0;
}
.steps {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  padding: var(--space-8) 0;
  gap: var(--layout-gap);
}
.step {
  position: relative;
  display: grid;
  grid-template-columns: var(--size-72) 1fr;
  gap: var(--space-6);
  align-items: start;
}
.step-number {
  color: var(--color-accent);
  font-size: clamp(var(--space-16),6.4vw,var(--space-24));
  font-weight: 400;
  line-height: 1;
  letter-spacing: -.06em;
}
.step h2 {
  font-size: var(--text-lg);
  line-height: 1.2;
  letter-spacing: -.045em;
  margin: var(--space-2) 0 var(--space-2);
}
.buyout {
  border-top: var(--size-1) solid var(--color-ink);
  scroll-margin-top: var(--space-6);
  margin-top: 0;
  padding: var(--section-inset) 0;
}
.buyout-heading {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: end;
  gap: var(--layout-gap);
  margin: var(--section-heading-gap) 0 var(--section-content-gap);
}
.buyout-heading>p {
  max-width: 31ch;
  color: var(--color-muted);
  font-size: var(--text-base);
  line-height: 1.5;
  margin: 0;
}
.buyout-item {
  display: grid;
  align-items: center;
  border-bottom: var(--size-1) solid var(--color-line);
  text-decoration: none;
  transition: background var(--motion-fast);
  grid-template-columns: var(--space-16) minmax(0,1.25fr) minmax(0,1fr) var(--space-10);
  gap: var(--layout-gap);
  padding: var(--row-inset) var(--row-inline-inset);
}
.buyout-index {
  color: var(--color-muted);
  font-size: var(--text-xs);
  padding-top: var(--space-3);
  align-self: center;
  padding: 0;
}
dialog {
  border: 0;
  background: var(--color-canvas);
  max-width: min(var(--size-510),calc(100% - var(--space-8)));
  color: var(--color-ink);
  padding: var(--space-12);
  max-height: calc(100dvh - var(--space-8));
  overflow: auto;
}
dialog .eyebrow {
  display: block;
  margin-bottom: var(--space-6);
}
dialog h2 {
  font-size: var(--size-36);
  line-height: 1.05;
  letter-spacing: -.05em;
  margin: 0 0 var(--space-6);
}
dialog p {
  color: var(--color-muted);
  font-size: var(--text-sm);
  margin: 0 0 var(--space-6);
}
.category {
  border-bottom: var(--size-1) solid var(--color-line);
}
.category summary {
  list-style: none;
  cursor: pointer;
  border-bottom: 0;
  grid-template-columns: var(--space-16) minmax(0,1.25fr) minmax(0,1fr) var(--space-10) var(--space-6);
}
.category summary::-webkit-details-marker {
  display: none;
}
.category-toggle {
  width: var(--space-5);
  height: var(--space-5);
  position: relative;
  justify-self: end;
}
.category-toggle:before {
  content: '';
  position: absolute;
  background: currentColor;
  top: var(--size-9);
  left: var(--size-2);
  width: var(--space-4);
  height: var(--size-1);
}
.category-toggle:after {
  content: '';
  position: absolute;
  background: currentColor;
  top: var(--size-9);
  left: var(--size-2);
  width: var(--space-4);
  height: var(--size-1);
  transform: rotate(90deg);
}
.category[open] .category-toggle:after {
  transform: rotate(0);
}
.category[open] summary {
  background: var(--color-surface);
}
.category-content {
  padding: 0 var(--row-inline-inset) var(--space-8);
  background: var(--color-surface);
}
.category-visual {
  aspect-ratio: 9/4;
  background-image: url('./assets/category-cars.webp');
  background-size: 200% 300%;
  background-repeat: no-repeat;
  background-color: var(--color-canvas);
}
.category-visual--1 {
  background-position: 0 0;
}
.category-visual--2 {
  background-position: 100% 0;
}
.category-visual--3 {
  background-position: 0 50%;
}
.category-visual--4 {
  background-position: 100% 50%;
}
.category-visual--5 {
  background-position: 0 100%;
}
.category-visual--6 {
  background-position: 100% 100%;
}
.category-caption {
  font-size: var(--text-xs);
  color: var(--color-muted);
  margin: var(--space-3) 0 var(--space-6);
}
.category-examples {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--layout-gap);
}
.category-examples h3 {
  font-size: var(--text-lg);
  letter-spacing: -.03em;
  line-height: 1.2;
  margin: 0 0 var(--space-3);
}
.category-examples p {
  font-size: var(--text-sm);
  color: var(--color-muted);
  margin: 0;
  max-width: 48ch;
}
.documents {
  border-top: var(--size-1) solid var(--color-ink);
  padding: var(--section-inset) 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-16);
}
.documents-intro>p {
  color: var(--color-muted);
  max-width: 40ch;
  margin: 0 0 var(--space-8);
}
.documents-cases article {
  display: grid;
  grid-template-columns: var(--space-8) 1fr;
  gap: var(--space-4);
  padding: var(--space-6) 0;
  border-bottom: var(--size-1) solid var(--color-line);
}
.documents-cases article:first-child {
  padding-top: 0;
}
.documents-cases article:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.documents-cases article>span {
  font-size: var(--text-sm);
  color: var(--color-muted);
  padding-top: var(--space-1);
}
.documents-cases h3 {
  font-size: var(--text-lg);
  line-height: 1.2;
  letter-spacing: -.03em;
  margin: 0 0 var(--space-2);
}
.documents-cases p {
  margin: 0;
  font-size: var(--text-sm);
  color: var(--color-muted);
  max-width: 45ch;
}
.brands {
  padding: var(--section-inset) 0;
  border-top: var(--size-1) solid var(--color-ink);
}
.brands-heading {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: end;
  gap: var(--layout-gap);
  margin-bottom: var(--section-content-gap);
}
.brands-heading>p {
  margin: 0;
  color: var(--color-muted);
  max-width: 31ch;
}
h1 {
  letter-spacing: -.074em;
  line-height: .98;
  font-weight: 900;
  margin: 0;
  font-size: var(--text-hero);
  font-family: var(--font-display);
}
.wordmark {
  font-size: clamp(var(--size-26),2.8vw,var(--size-44));
  font-weight: 900;
  letter-spacing: -.075em;
  font-style: italic;
  text-decoration: none;
  line-height: 1;
  white-space: nowrap;
  font-family: var(--font-display);
}
.buyout-heading h2 {
  line-height: 1.02;
  letter-spacing: -.065em;
  margin: 0;
  font-family: var(--font-display);
  font-size: var(--text-section);
}
.documents-intro h2 {
  letter-spacing: -.06em;
  line-height: 1.05;
  margin: var(--section-heading-gap) 0 var(--space-6);
  font-family: var(--font-display);
  font-size: var(--text-section-compact);
}
.buyout-title {
  font-weight: 700;
  letter-spacing: -.055em;
  line-height: 1.1;
  font-size: var(--text-row);
}
.valuation-form h2 {
  font-weight: 800;
  letter-spacing: -.045em;
  line-height: 1.1;
  margin: 0 0 var(--space-2);
  white-space: normal;
  font-size: var(--text-form-title);
}
.brands-heading h2 {
  font-family: var(--font-display);
  line-height: 1.02;
  letter-spacing: -.065em;
  margin: var(--section-heading-gap) 0 0;
  font-size: var(--text-section-compact);
}
.brands-heading h2 .accent {
  white-space: nowrap;
}
.brands-logos {
  display: grid;
  grid-template-columns: repeat(6,minmax(0,1fr));
  column-gap: var(--brand-logo-column-gap);
  row-gap: var(--brand-logo-row-gap);
  padding: var(--space-6) 0;
  list-style: none;
  margin: 0;
}
.brands-logos li {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
}
.journey {
  padding: var(--section-inset) var(--layout-gutter);
  margin: 0 calc(-1 * var(--layout-gutter));
  background: var(--color-ink);
  color: var(--color-on-dark);
}
.journey-heading {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: end;
  gap: var(--layout-gap);
  margin-bottom: var(--section-content-gap);
}
.journey-heading .eyebrow {
  color: var(--color-on-dark-muted);
}
.journey-heading h2 {
  font-family: var(--font-display);
  font-size: var(--text-section-compact);
  letter-spacing: -.06em;
  line-height: 1.05;
  margin: var(--section-heading-gap) 0 0;
}
.journey-heading h2 span {
  color: var(--color-accent);
}
.journey-heading>p {
  color: var(--color-on-dark-muted);
  margin: 0;
  font-size: var(--text-base);
}
.journey-stages {
  border-top: var(--size-1) solid var(--color-on-dark-line);
}
.journey-number {
  font-size: var(--journey-number-size);
  letter-spacing: -.07em;
  line-height: 1;
}
.journey-stage strong {
  display: block;
  font-size: var(--text-lg);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.035em;
}
.journey-stage small {
  display: block;
  font-size: var(--text-sm);
  margin-top: var(--space-2);
}
.journey-stage-mark {
  width: var(--space-3);
  height: var(--space-3);
  border: var(--size-1) solid currentColor;
  border-radius: 50%;
}
.journey-stage[aria-selected='true'] {
  color: var(--color-on-dark);
}
.journey-stage[aria-selected='true'] .journey-number {
  color: var(--color-accent);
}
.journey-stage[aria-selected='true'] .journey-stage-mark {
  background: var(--color-accent);
  border-color: var(--color-accent);
}
.journey-stage:hover {
  color: var(--color-on-dark);
}
.ticket-meta {
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
  border-bottom: var(--size-1) solid var(--color-line);
  padding-bottom: var(--space-4);
  font-size: var(--text-micro);
  letter-spacing: .12em;
}
.ticket-title>span {
  font-size: var(--ticket-number-size);
  letter-spacing: -.08em;
  line-height: 1;
  color: var(--color-accent);
}
.ticket-roles .eyebrow {
  color: var(--color-muted);
}
.ticket-roles p {
  font-size: var(--text-sm);
  margin: var(--space-3) 0 0;
}
.ticket-check {
  display: flex;
  justify-content: center;
  align-items: center;
  width: var(--space-8);
  height: var(--space-8);
  background: var(--color-accent);
  font-weight: 700;
}
.ticket-benefit h4 {
  font-size: var(--text-lg);
  line-height: 1.2;
  letter-spacing: -.03em;
  margin: var(--space-3) 0 var(--space-2);
}
.ticket-benefit p {
  font-size: var(--text-sm);
  color: var(--color-muted);
  margin: 0;
}
.journey-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-6);
  margin-top: var(--space-12);
  padding-top: var(--space-8);
  border-top: var(--size-1) solid var(--color-on-dark-line);
}
.journey-bottom p {
  margin: 0;
  font-size: var(--text-lg);
  line-height: 1.3;
  letter-spacing: -.03em;
}
.journey-bottom p span {
  color: var(--color-on-dark-muted);
}
.journey-layout {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1.15fr);
  gap: var(--space-12);
  align-items: stretch;
}
.journey-stage {
  width: 100%;
  display: grid;
  grid-template-columns: var(--size-80) 1fr var(--space-4);
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-8) 0;
  border: 0;
  border-bottom: var(--size-1) solid var(--color-on-dark-line);
  background: transparent;
  color: var(--color-on-dark-muted);
  cursor: pointer;
  text-align: left;
  min-height: var(--journey-stage-height);
}
.journey-ticket {
  background: var(--color-canvas);
  color: var(--color-ink);
  padding: var(--ticket-inset);
  position: relative;
  display: grid;
  grid-template-rows: auto var(--ticket-title-height) var(--ticket-roles-height) var(--ticket-benefit-height);
  align-content: start;
}
.ticket-title {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: var(--space-6);
  margin: 0;
  min-width: 0;
}
.ticket-title h3 {
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -.055em;
  margin: 0;
  font-size: var(--ticket-title-size);
  max-width: 14ch;
}
.ticket-roles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-6);
  padding-bottom: var(--space-8);
  padding: 0;
  align-content: start;
}
.ticket-benefit {
  border-top: var(--size-1) dashed var(--color-line-strong);
  display: grid;
  grid-template-columns: var(--space-8) 1fr;
  gap: var(--space-4);
  padding-top: var(--space-6);
  align-content: start;
}
.car-panel img {
  display: block;
  position: static;
  inset: auto;
  width: 100%;
  height: 100%;
  max-height: var(--car-image-max-height);
  object-fit: contain;
  mix-blend-mode: normal;
}
.content-section {
  padding: var(--section-inset) 0;
  border-top: var(--size-1) solid var(--color-ink);
  scroll-margin-top: var(--space-6);
}
.section-heading h2 {
  font-family: var(--font-display);
  font-size: var(--text-section-compact);
  line-height: 1.05;
  letter-spacing: -.06em;
  margin: var(--section-heading-gap) 0 0;
}
.registration h2 {
  font-family: var(--font-display);
  font-size: var(--text-section-compact);
  line-height: 1.05;
  letter-spacing: -.06em;
  margin: var(--section-heading-gap) 0 0;
}
.section-heading>p {
  max-width: 35ch;
  color: var(--color-muted);
  margin: 0;
}
.deals {
  border-top: 0;
}
.deals-grid {
  --carousel-visible: 6;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc((100% - 5 * var(--layout-gap)) / 6);
  gap: var(--layout-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}
.deals-grid::-webkit-scrollbar {
  display: none;
}
.deal-card {
  min-width: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.deal-photo {
  position: relative;
  background: var(--color-line);
  aspect-ratio: var(--deal-image-ratio);
  overflow: hidden;
}
.deal-photo>span {
  position: absolute;
  bottom: var(--space-3);
  left: var(--space-3);
  background: var(--color-canvas);
  padding: var(--space-1) var(--space-3);
  font-size: var(--text-xs);
}
.deal-info p {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
  border-top: var(--size-1) solid var(--color-line);
  padding-top: var(--space-3);
}
.deal-info p>span {
  font-size: var(--text-xs);
  color: var(--color-muted);
}
.deal-info strong {
  font-size: var(--text-base);
  white-space: nowrap;
}
.registration {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-16);
}
.registration-main>p {
  color: var(--color-muted);
  margin: var(--space-6) 0 var(--space-8);
  max-width: 40ch;
}
.registration-services article {
  display: grid;
  grid-template-columns: var(--space-8) 1fr;
  gap: var(--space-6);
  padding: var(--space-6) var(--row-inline-inset);
  border-bottom: var(--size-1) solid var(--color-line);
}
.registration-services article:first-child {
  border-top: var(--size-1) solid var(--color-line);
}
.registration-services article>span {
  color: var(--color-muted);
  font-size: var(--text-sm);
}
.registration-services h3 {
  margin: 0;
  font-size: var(--text-lg);
  line-height: 1.2;
  letter-spacing: -.03em;
}
.registration-services>p {
  color: var(--color-muted);
  font-size: var(--text-xs);
  margin: var(--space-6) var(--row-inline-inset) 0;
}
.faq-list {
  border-top: var(--size-1) solid var(--color-line);
}
.faq-item {
  border-bottom: var(--size-1) solid var(--color-line);
}
.faq-item summary {
  display: grid;
  grid-template-columns: var(--space-8) 1fr var(--space-6);
  align-items: center;
  gap: var(--space-6);
  padding: var(--space-6) var(--row-inline-inset);
  cursor: pointer;
  list-style: none;
}
.faq-item summary::-webkit-details-marker {
  display: none;
}
.faq-number {
  font-size: var(--text-sm);
  color: var(--color-muted);
}
.faq-item h3 {
  font-size: var(--text-lg);
  line-height: 1.25;
  letter-spacing: -.03em;
  margin: 0;
}
.faq-item[open] {
  background: var(--color-surface);
}
.faq-item[open] .category-toggle:after {
  transform: rotate(0);
}
.faq-item>p {
  max-width: 75ch;
  margin: 0;
  padding: 0 var(--row-inline-inset) var(--space-6);
  padding-left: calc(var(--row-inline-inset) + var(--space-8) + var(--space-6));
  color: var(--color-muted);
}
.contact {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: var(--space-12);
  align-items: end;
}
.contact h2 {
  font-family: var(--font-display);
  font-size: var(--text-section-compact);
  line-height: 1.05;
  letter-spacing: -.06em;
  margin: var(--section-heading-gap) 0 0;
  max-width: 18ch;
}
.contact>div>p {
  margin: var(--space-6) 0 0;
  color: var(--color-muted);
}
.contact-links {
  display: grid;
  justify-items: start;
  gap: var(--space-6);
}


.finish-footer {
  margin: 0;
  padding: var(--section-inset) var(--layout-gutter) var(--space-6);
  background: var(--color-ink);
  color: var(--color-on-dark);
  overflow: hidden;
}

.footer-statement {
  font-family: var(--font-display);
  font-size: var(--footer-display-size);
  letter-spacing: -.065em;
  line-height: 1.03;
  margin-top: var(--space-16);
}
.footer-statement>span {
  color: var(--color-accent);
}
.footer-road {
  height: var(--footer-road-height);
  position: relative;
  margin: var(--space-8) calc(-1 * var(--layout-gutter)) 0;
  overflow: hidden;
}
.road-line {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--space-6);
  border-top: var(--size-1) solid var(--color-on-dark-line);
}
.finish-footer.is-visible:not(.motion-paused) .road-car {
  animation-play-state: running;
}
.footer-bottom {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-4) var(--space-6);
  border-top: var(--size-1) solid var(--color-on-dark-line);
  padding-top: var(--space-6);
  font-size: var(--text-xs);
  color: var(--color-on-dark-muted);
}

.footer-motion {
  border: 0;
  background: transparent;
  padding: var(--space-2) 0;
  color: inherit;
  text-decoration: underline;
  text-underline-offset: var(--space-1);
  cursor: pointer;
  font-size: inherit;
}
.hero-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--section-inset) var(--space-6) var(--space-8) 0;
  padding-top: var(--space-10);
  padding-bottom: var(--space-8);
}
.hero-recent {
  margin-top: var(--space-8);
  width: 100%;
  max-width: var(--hero-case-max-width);
}
.hero-recent-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}
.hero-recent-heading .eyebrow {
  font-size: var(--text-micro);
}
.hero-recent-heading>a {
  font-size: var(--text-micro);
  white-space: nowrap;
}
.hero-recent-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: var(--space-3);
}
.hero-recent-car {
  text-decoration: none;
  min-width: 0;
}
.hero-recent-car img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: var(--hero-mini-image-ratio);
  object-fit: cover;
}
.hero-recent-car>span {
  display: flex;
  justify-content: space-between;
  gap: var(--space-1);
  font-size: var(--text-micro);
  line-height: 1.4;
  margin-top: var(--space-2);
  flex-wrap: wrap;
}
.hero-recent-car small {
  font-size: inherit;
  color: var(--color-muted);
}
.car-panel {
  min-width: 0;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--car-frame-inset);
  background: var(--car-frame-color);
  position: relative;
  min-height: var(--hero-portrait-height);
}

.hero-heading {
  border-bottom: var(--size-1) solid var(--color-line-strong);
  padding: var(--space-6) 0 var(--space-8);
  position: relative;
}
.deal-photo:before {
  content: '';
  position: absolute;
  width: var(--space-5);
  height: var(--space-5);
  z-index: 1;
  pointer-events: none;
  border-color: var(--color-canvas);
  border-style: solid;
  left: var(--space-3);
  top: var(--space-3);
  border-width: var(--size-1) 0 0 var(--size-1);
}
.deal-photo:after {
  content: '';
  position: absolute;
  width: var(--space-5);
  height: var(--space-5);
  z-index: 1;
  pointer-events: none;
  border-color: var(--color-canvas);
  border-style: solid;
  right: var(--space-3);
  bottom: var(--space-3);
  border-width: 0 var(--size-1) var(--size-1) 0;
}
.deal-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform var(--motion-photo) ease-out;
}
.deal-card:hover .deal-photo img {
  transform: scale(var(--photo-hover-scale));
}
.deal-info {
  padding-top: var(--space-4);
  position: relative;
}
.deal-info h3 {
  font-size: var(--text-lg);
  letter-spacing: -.035em;
  line-height: 1.2;
  margin: 0 0 var(--space-4);
  padding-left: var(--space-4);
}
.deal-info h3:before {
  content: '';
  position: absolute;
  left: 0;
  top: var(--space-5);
  width: var(--space-2);
  height: var(--space-2);
  background: var(--color-accent);
}
.section-heading {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: end;
  gap: var(--layout-gap);
  margin-bottom: var(--section-content-gap);
  position: relative;
}
.brands-logos img {
  display: block;
  width: var(--brand-logo-width);
  height: var(--brand-logo-height);
  max-width: 100%;
  object-fit: contain;
  filter: none;
}
.registration-emblem {
  display: flex;
  align-items: center;
  gap: var(--space-6);
  margin-bottom: var(--space-8);
}
.registration-emblem img {
  width: var(--registration-emblem-width);
  height: auto;
  object-fit: contain;
}
.registration-emblem .eyebrow {
  line-height: 1.6;
  color: var(--color-muted);
}
.road-car img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.road-car {
  position: absolute;
  width: var(--footer-car-width);
  left: 0;
  color: var(--color-accent);
  animation: footer-drive var(--footer-drive-duration) linear infinite;
  animation-play-state: paused;
  bottom: var(--space-2);
}
.car-wheel--rear {
  left: 15.7%;
  background-position: 17.66% 80.8%;
}
.car-wheel--front {
  left: 76.9%;
  background-position: 86.43% 80.8%;
}
.finish-footer.is-visible:not(.motion-paused) .car-wheel {
  animation-play-state: running;
}
.car-wheel {
  position: absolute;
  width: var(--footer-wheel-size);
  aspect-ratio: 1;
  border-radius: 50%;
  background-image: url('./assets/footer-car-real.webp');
  background-size: 900.9% auto;
  top: 58.5%;
  animation: footer-wheel-spin var(--footer-drive-duration) linear infinite;
  animation-play-state: paused;
}
@media(max-width:1100px) {

  .form-column {
    padding-left: var(--space-6);
  }
  .hero-grid {
    min-height: var(--size-440);
  }
  .step {
    gap: var(--space-4);
  }
  .step h2 {
    font-size: var(--text-base);
  }
}
@media(max-width:1000px) {
  .wordmark {
    font-size: var(--size-28);
  }

  h1 {
    font-size: var(--text-hero);
    letter-spacing: -.067em;
    line-height: 1.03;
  }
  .hero-copy>p {
    font-size: clamp(var(--size-19),3.9vw,var(--size-28));
  }
  .valuation-form h2 {
    font-size: var(--size-28);
    white-space: normal;
  }
  .step:last-child {
    border-bottom: 0;
  }
  .step p {
    font-size: var(--text-sm);
  }
  .step p br {
    display: none;
  }
  dialog h2 {
    font-size: var(--size-30);
  }
  .buyout-note {
    display: none;
  }
  .buyout-heading h2 {
    font-size: clamp(var(--size-31),7.5vw,var(--size-56));
  }
  .buyout-heading>p {
    font-size: var(--size-15);
    max-width: 40ch;
  }
  .buyout-item p {
    grid-column: 2;
    grid-row: 2;
    font-size: var(--text-body-small);
    max-width: 35ch;
  }
  .buyout-icon {
    grid-column: 3;
    grid-row: 1;
  }
  .buyout-icon svg {
    width: var(--size-26);
    height: var(--size-26);
  }

  .hero-heading {
    padding: var(--space-6) 0;
  }
  .hero-grid {
    min-height: 0;
    grid-template-columns: 1fr 1fr;
  }
  .form-column {
    grid-column: 1/-1;
    padding: var(--space-6) 0;
  }
  .valuation-form {
    padding: var(--panel-inset);
  }
  .steps {
    grid-template-columns: 1fr;
    padding: 0;
    gap: 0;
  }
  .step {
    border-bottom: var(--size-1) solid var(--color-line);
    grid-template-columns: var(--space-16) 1fr;
    gap: var(--space-6);
    padding: var(--space-6) 0;
    align-items: center;
  }
  .step-number {
    font-size: var(--size-68);
    min-width: 0;
  }
  .step h2 {
    font-size: var(--space-5);
    margin-top: 0;
    margin: 0 0 var(--space-2);
  }
  .buyout {
    margin-top: var(--space-6);
    margin: 0;
    padding: var(--section-inset) 0;
  }
  .buyout-heading {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .buyout-item {
    grid-template-columns: var(--space-6) minmax(0,1fr) var(--size-28);
    gap: var(--space-2) var(--space-4);
  }
  .buyout-index {
    font-size: var(--text-micro);
    align-self: start;
    padding-top: var(--space-1);
  }
  dialog {
    padding: var(--space-12) var(--space-6) var(--space-6);
  }
  .desktop-break {
    display: none;
  }
  .category summary {
    grid-template-columns: var(--space-6) minmax(0,1fr) var(--size-28) var(--space-5);
    column-gap: var(--space-3);
  }
  .buyout-title {
    font-size: clamp(var(--size-22),3.5vw,var(--space-8));
  }
  .category summary p {
    grid-column: 2/4;
  }
  .category summary .category-toggle {
    grid-column: 4;
    grid-row: 1;
  }
  .category-content {
    padding-bottom: var(--space-6);
  }
  .category-examples {
    gap: var(--space-6);
  }
  .documents {
    grid-template-columns: 1fr;
    gap: var(--section-content-gap);
  }
  .brands-heading {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .brands-heading>p {
    max-width: 40ch;
  }
  .brands-logos {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }
  .journey-heading {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .journey-layout {
    gap: var(--space-6);
  }
  .journey-stage strong {
    font-size: var(--text-base);
  }
  .journey-stage small {
    font-size: var(--text-xs);
  }
  .ticket-title {
    gap: var(--space-4);
  }
  .ticket-roles {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .journey-ticket {
    grid-template-rows: auto var(--ticket-title-height) var(--ticket-roles-height) var(--ticket-benefit-height);
  }
  .journey-stage {
    grid-template-columns: var(--space-12) 1fr var(--space-3);
    gap: var(--space-4);
    min-height: var(--journey-stage-height);
  }
  .car-panel img {
    height: auto;
    max-height: var(--car-image-max-height);
  }
  .section-heading {
    grid-template-columns: 1fr;
    gap: var(--space-6);
  }
  .section-heading>p {
    max-width: 48ch;
  }

  .registration {
    gap: var(--layout-gap);
  }
  .contact {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }

  .hero-copy {
    padding: var(--space-8) var(--space-4) var(--space-8) 0;
    padding-top: var(--space-8);
  }
  .car-panel {
    min-height: var(--car-frame-min-height);
  }
  .hero-recent {
    margin-top: var(--space-6);
  }
  .home-field input {
    font-size: var(--text-base);
    min-height: var(--touch-target);
  }

  .hero-recent-heading>a {
    display: inline-flex;
    align-items: center;
    min-height: var(--touch-target);
  }

  
  .footer-motion {
    display: inline-flex;
    align-items: center;
    min-height: var(--touch-target);
  }
  .registration-emblem {
    flex-wrap: wrap;
  }
}
@media(max-width:390px) {

  .car-panel {
    min-height: var(--size-260);
  }
  .hero-copy>p {
    font-size: var(--text-lg);
  }

  .valuation-form {
    padding: var(--panel-inset);
  }
}
@media(max-width:1100px) and (min-width:1001px) {
  .step {
    grid-template-columns: var(--size-56) 1fr;
    gap: var(--space-4);
  }
}
@media(max-width:360px) {
  .ticket-roles {
    grid-template-columns: 1fr;
  }
  .ticket-title>span {
    font-size: var(--ticket-number-size);
  }
  .journey-ticket {
    grid-template-rows: auto var(--ticket-title-height) var(--ticket-roles-height) var(--ticket-benefit-height);
  }
  .ticket-title {
    grid-template-columns: 1fr;
    gap: var(--space-4);
    align-content: center;
  }
}
@media(max-width:520px) {
  .category-examples {
    grid-template-columns: 1fr;
  }
  .category-visual {
    aspect-ratio: 9/4;
  }
  .category summary {
    column-gap: var(--space-2);
  }
  .brands-logos {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }

  .deal-info h3 {
    font-size: var(--text-lg);
  }
  .hero-grid {
    grid-template-columns: minmax(0,1fr);
  }
  .hero-copy {
    padding-right: 0;
    padding-bottom: var(--space-6);
  }
  .hero-copy>p:first-child {
    font-size: var(--text-lg);
    max-width: 30ch;
  }
  .hero-recent {
    max-width: none;
  }
  .hero-recent-grid {
    gap: var(--space-4);
  }
  .hero-recent-car img {
    aspect-ratio: 16/9;
  }
  .car-panel {
    min-height: 0;
    height: var(--hero-mobile-portrait-height);
  }
  .car-panel>img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
  .form-column {
    grid-column: 1;
  }
}
@media(max-width:700px) {
  .journey-layout {
    grid-template-columns: 1fr;
  }
  .journey-number {
    grid-column: 1/-1;
    font-size: var(--journey-number-size);
  }
  .journey-stage>span:nth-child(2) {
    grid-column: 1;
  }
  .journey-stage strong {
    font-size: var(--text-sm);
  }
  .journey-stage small {
    font-size: var(--text-micro);
  }
  .journey-bottom {
    flex-direction: column;
    align-items: stretch;
    margin-top: var(--space-8);
  }
  .journey-stage {
    padding: var(--space-5) 0;
    grid-template-columns: 1fr var(--space-3);
    gap: var(--space-3);
    min-height: var(--journey-stage-height);
  }
  .journey-ticket {
    grid-template-rows: auto var(--ticket-title-height) var(--ticket-roles-height) var(--ticket-benefit-height);
  }
  .journey-stages {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: var(--space-6);
  }
  .ticket-title h3 {
    font-size: var(--text-lg);
  }
  .ticket-roles {
    grid-template-columns: 1fr;
    align-content: start;
  }
  .registration {
    grid-template-columns: 1fr;
    gap: var(--space-8);
  }
  .faq-item summary {
    grid-template-columns: var(--space-6) 1fr var(--space-5);
    gap: var(--space-3);
  }
  .faq-item>p {
    padding-left: var(--row-inline-inset);
  }
  .footer-statement {
    margin-top: var(--space-12);
  }
  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: var(--space-3);
  }
  
  .contact>div>p br {
    display: none;
  }
}
@media(prefers-reduced-motion:reduce) {
  .road-car {
    animation: none;
    left: 60%;
    transform: translateX(-50%);
  }
  .footer-motion {
    display: none;
  }
  
  .deal-photo img {
    transition: none;
  }
  .deal-card:hover .deal-photo img {
    transform: none;
  }
  .car-wheel {
    animation: none;
  }
}
@keyframes footer-drive {
  0% {
    left: calc(-1 * var(--footer-car-width));
    transform: translateX(0);
    animation-timing-function: cubic-bezier(.12,.65,.25,1);
  }
  16% {
    left: 12%;
    transform: translateX(0);
    animation-timing-function: linear;
  }
  76% {
    left: 56%;
    transform: translateX(0);
    animation-timing-function: cubic-bezier(.65,0,.9,.4);
  }
  94%,100% {
    left: 100%;
    transform: translateX(0);
  }
}
@keyframes footer-wheel-spin {
  0% {
    transform: rotate(0deg);
    animation-timing-function: cubic-bezier(.12,.65,.25,1);
  }
  16% {
    transform: rotate(720deg);
    animation-timing-function: linear;
  }
  76% {
    transform: rotate(1440deg);
    animation-timing-function: cubic-bezier(.65,0,.9,.4);
  }
  94%,100% {
    transform: rotate(2520deg);
  }
}
.reviews-carousel {
  min-width: 0;
}
.reviews-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 100%;
  gap: var(--layout-gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  border-top: var(--size-1) solid var(--color-line);
}
.reviews-track::-webkit-scrollbar {
  display: none;
}
.reviews-track article {
  scroll-snap-align: start;
  scroll-snap-stop: always;
  min-width: 0;
  display: grid;
  grid-template-columns: var(--review-mark-size) minmax(0,1fr);
  column-gap: var(--space-8);
  padding: var(--space-6) var(--space-2);
  align-content: start;
}
.review-mark {
  color: var(--color-accent);
  font-family: Georgia,serif;
  font-size: var(--review-mark-size);
  line-height: 1;
  grid-row: 1 / 3;
}
.reviews-track article>p {
  font-size: var(--review-text-size);
  letter-spacing: -.01em;
  line-height: 1.5;
  margin: 0;
  max-width: var(--review-text-width);
}
.reviews-track article>div {
  display: grid;
  gap: var(--space-1);
  margin-top: var(--space-8);
  font-size: var(--text-base);
}
.reviews-track article>div>span {
  font-size: var(--text-sm);
  color: var(--color-muted);
}
.reviews-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
  padding-top: var(--space-6);
  border-top: var(--size-1) solid var(--color-line);
}
.reviews-counter {
  font-size: var(--text-sm);
  color: var(--color-muted);
  font-variant-numeric: tabular-nums;
}
.reviews-buttons {
  display: flex;
  gap: var(--space-3);
}
.reviews-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target);
  height: var(--touch-target);
  padding: var(--space-3);
  border: var(--size-1) solid var(--color-ink);
  border-radius: var(--radius);
  color: var(--color-ink);
  background: transparent;
  cursor: pointer;
  transition: background var(--motion-fast),color var(--motion-fast);
}
.reviews-arrow svg {
  display: block;
  width: 100%;
  height: 100%;
}
.reviews-arrow:hover:not(:disabled) {
  background: var(--color-ink);
  color: var(--color-canvas);
}
.reviews-arrow:disabled {
  color: var(--color-line-strong);
  border-color: var(--color-line);
  cursor: default;
}
@media(max-width:700px) {
  .reviews-track article {
    grid-template-columns: minmax(0,1fr);
    gap: var(--space-3);
    padding-block: var(--space-6);
  }
  .review-mark {
    grid-row: auto;
    line-height: .75;
  }
  .reviews-track article>div {
    margin-top: var(--space-4);
  }
}

/* Floating back-to-top control, revealed after scrolling. */
.top-button {
  position: fixed;
  right: max(var(--layout-gutter), env(safe-area-inset-right));
  bottom: calc(var(--space-6) + env(safe-area-inset-bottom));
  z-index: var(--top-button-layer);
  width: var(--top-button-size);
  height: var(--top-button-size);
  padding: var(--space-2);
  border: var(--size-1) solid var(--color-ink);
  border-radius: var(--radius);
  background: var(--color-accent);
  color: var(--color-ink);
  font-size: var(--text-sm);
  font-weight: 700;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(var(--space-3));
  transition: opacity var(--motion-fast), transform var(--motion-fast), visibility var(--motion-fast), background var(--motion-fast);
}
.top-button.is-visible { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.top-button:hover { background: var(--color-accent-hover); }
@media(prefers-reduced-motion:reduce) { .top-button { transition: none; transform: none; } }

.top-button svg { display: block; width: var(--space-6); height: var(--space-6); margin: auto; }

/* Public contact channels verified against maxauto78.ru. */
.header-contacts { display:flex; align-items:center; }
.messengers { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2); }
.messenger-link { display:inline-flex; align-items:center; gap:var(--space-2); min-width:var(--touch-target); min-height:var(--touch-target); text-decoration:none; color:var(--color-ink); }
.messenger-link svg { display:block; flex-shrink:0; width:var(--touch-target); height:var(--touch-target); }
.messenger-link:hover { color:var(--color-accent); }
.footer-bottom .messengers { margin-left:auto; margin-right:calc(var(--top-button-size) + var(--space-4)); }
.footer-bottom .messenger-link { color:var(--color-on-dark); }
.footer-bottom .messenger-link:hover { color:var(--color-accent); }
@media(max-width:700px) { .footer-bottom .messengers { margin-left:0; margin-right:0; } }


/* Contact channels share one visual pattern, without duplicate call actions. */
.messengers--header { gap:var(--space-2); }
.contact-details { display:grid; gap:var(--space-2); }
.contact-details a { display:inline-flex; align-items:center; min-height:var(--touch-target); font-size:var(--contact-text-size); font-weight:600; line-height:1.3; letter-spacing:-.03em; text-decoration:none; }
.contact-details a:hover { color:var(--color-accent); }
.reviews .section-heading { grid-template-columns:minmax(0,1fr); }
@media(max-width:1100px) {
  .messengers--header { gap:var(--space-2); }
}

.valuation-dialog {
  width: var(--size-510);
  padding: 0;
  background: var(--color-surface);
}
.valuation-dialog .valuation-form {
  padding: var(--space-12) var(--panel-inset) var(--panel-inset);
}
.valuation-dialog h2 {
  margin: 0;
  padding-right: var(--space-6);
}
.valuation-dialog .form-status {
  margin: 0;
}

.deal-info .deal-price--note {
  white-space: normal;
  text-align: right;
  max-width: 50%;
  font-size: var(--text-sm);
}

.deals-controls {
  display: flex;
  margin-top: var(--space-6);
}
@media(min-width:1101px) {
  .deal-info h3 {
    font-size: var(--deal-title-size);
    line-height: 1.3;
  }
  .deal-info p {
    display: grid;
    gap: var(--space-2);
  }
  .deal-info strong {
    font-size: var(--text-sm);
  }
  .deal-info .deal-price--note {
    max-width: none;
    text-align: left;
  }
}
@media(max-width:1100px) and (min-width:701px) {
  .deals-grid {
    --carousel-visible: 3;
    grid-auto-columns: calc((100% - 2 * var(--layout-gap)) / 3);
  }
}
@media(max-width:700px) {
  .deals-grid {
    --carousel-visible: 1;
    grid-auto-columns: 100%;
  }
}

.hero-benefits {
  display: grid;
  gap: var(--space-3);
  padding: 0;
  margin: var(--space-6) 0 0;
  list-style: none;
  font-size: var(--text-sm);
  line-height: 1.5;
}
.hero-benefits li {
  display: grid;
  grid-template-columns: var(--space-4) minmax(0,1fr);
  gap: var(--space-2);
}
.hero-benefits li::before {
  content: '✓';
  color: var(--color-accent);
  font-weight: 700;
}
@media(max-width:700px) {
  h1 {
    font-size: var(--text-mobile-hero);
    line-height: 1.08;
    letter-spacing: -.055em;
  }
  h1>span {
    white-space: normal;
    text-wrap: balance;
  }
  .buyout-heading h2,
  .documents h2,
  .brands-heading h2,
  .journey-heading h2,
  .section-heading h2,
  .registration h2,
  .contact h2 {
    font-size: var(--text-mobile-heading);
    line-height: 1.12;
    letter-spacing: -.045em;
    text-wrap: balance;
  }
  .valuation-form h2 {
    font-size: var(--text-form-title);
  }
  .hero-copy>p:first-child {
    font-size: var(--text-mobile-body);
    line-height: 1.5;
  }
  .hero-benefits,
  .buyout-heading>p,
  .documents-intro>p,
  .brands-heading>p,
  .section-heading>p,
  .registration-main>p,
  .contact>div>p,
  .faq-item>p {
    font-size: var(--text-mobile-body);
    line-height: 1.5;
  }
  .buyout-item p,
  .category summary p,
  .documents-cases p,
  .step p,
  .ticket-roles p,
  .ticket-benefit p {
    font-size: var(--text-mobile-support);
    line-height: 1.5;
  }
  .journey-stage small {
    font-size: var(--text-mobile-label);
    line-height: 1.4;
  }
  .reviews-track article>p {
    letter-spacing: -.01em;
    line-height: 1.5;
  }
}
@media(max-width:520px) {
  .hero-recent {
    display: none;
  }
  .form-column {
    order: 2;
    padding-top: 0;
  }
  .car-panel {
    order: 3;
    height: var(--car-frame-min-height);
  }
}

/* Entry to the unified question library. */
.faq-hub-link { margin: var(--space-6) 0 0; font-size: var(--text-sm); }
.faq-hub-link a { display: inline-flex; align-items: center; min-height: var(--touch-target); }

/* Category detail links use the shared spacing scale. */
.category-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3) var(--layout-gap);
  margin-top: var(--space-6);
}
.category-links a {
  display: inline-flex;
  align-items: center;
  min-height: var(--size-44);
  padding-block: var(--space-2);
  font-size: var(--text-sm);
  text-underline-offset: .2em;
}
.category-links a:hover { color: var(--color-accent); }