/* Project-data states layered over the donor visual system. */
#sntExpand,
#sntCompact { position: absolute; top: 0; width: 1px; height: 40px; pointer-events: none; }
#sntCompact { height: 180px; }

.wordmark-logo {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  color: var(--ink);
  line-height: 1;
  text-decoration: none;
}
.wordmark-logo strong {
  max-width: 300px;
  font-family: var(--display);
  font-size: clamp(20px, 2.2vw, 30px);
  font-stretch: 118%;
  font-weight: 860;
  letter-spacing: -.035em;
  text-transform: uppercase;
}
.wordmark-logo strong::after { content: "."; color: var(--red); }
.wordmark-logo small {
  max-width: 280px;
  margin-top: 7px;
  color: var(--ink-soft);
  font: 700 10px/1.15 var(--display);
  letter-spacing: .13em;
  text-transform: uppercase;
}
.wordmark-logo--dark,
.wordmark-logo--dark strong { color: #fff; }
.wordmark-logo--dark small { color: #a7aeb6; }
.wordmark-logo:not(.has-logo):not(.is-logo-pending) { min-width: 230px; min-height: 74px; }
.wordmark-logo.has-logo > strong,
.wordmark-logo.has-logo > small { display: none; }
.wordmark-logo.is-logo-pending > strong,
.wordmark-logo.is-logo-pending > small,
.js .wordmark-logo:not(.has-logo):not(.is-logo-fallback) > strong,
.js .wordmark-logo:not(.has-logo):not(.is-logo-fallback) > small { display: none; }
.wordmark-logo.is-logo-pending > img,
.js:not(.site-ready) [data-phone] { visibility: hidden; }
.js:not(.site-ready) .masthead [data-phone] {
  display: inline-block;
  font-size: 0;
}
.js:not(.site-ready) .masthead [data-phone]::before {
  content: "(000) 000-0000";
  visibility: hidden;
}
.js:not(.site-ready) .call-block [data-phone]::before { font-size: 27px; }
.js:not(.site-ready) .m-call [data-phone]::before { font-size: 15.5px; }

/* The CRM image is inserted after the JSON request. Reserve the donor's
   intrinsic logo footprint so the search field never jumps sideways. */
.masthead .wordmark-logo.has-logo,
.masthead .wordmark-logo.is-logo-pending,
.js .masthead .wordmark-logo {
  width: 135.2px;
  min-width: 135.2px;
  max-width: none;
  min-height: 0;
  flex: 0 0 135.2px;
}
.masthead .wordmark-logo.has-logo > img,
.masthead .wordmark-logo.is-logo-pending > img {
  display: block;
  width: 100%;
  max-width: none;
  height: 88px;
  max-height: none;
  margin: 8px 0 -28px;
  object-fit: contain;
}
.masthead .wordmark-logo.is-logo-fallback {
  height: 68px;
  overflow: hidden;
}
.masthead .wordmark-logo.is-logo-fallback strong {
  max-width: 100%;
  font-size: 16px;
  line-height: 1;
}
.masthead .wordmark-logo.is-logo-fallback small { display: none; }
.mm-top .wordmark-logo { min-height: 48px; min-width: 0; }
.mm-top .wordmark-logo.has-logo,
.mm-top .wordmark-logo.is-logo-pending,
.js .mm-top .wordmark-logo {
  width: 73.745px;
  min-width: 73.745px;
  max-width: none;
  min-height: 48px;
}
.mm-top .wordmark-logo.has-logo > img,
.mm-top .wordmark-logo.is-logo-pending > img {
  display: block;
  width: 100%;
  max-width: none;
  height: 48px;
  max-height: none;
  margin: 0;
  object-fit: contain;
}
.mm-top .wordmark-logo strong { font-size: 21px; }
.mm-top .wordmark-logo small { font-size: 8px; }
.mm-top .wordmark-logo.is-logo-fallback {
  height: 48px;
  overflow: hidden;
}
.mm-top .wordmark-logo.is-logo-fallback strong {
  max-width: 100%;
  font-size: 11px;
  line-height: 1;
}
.mm-top .wordmark-logo.is-logo-fallback small { display: none; }
.footer-brand .wordmark-logo.has-logo,
.footer-brand .wordmark-logo.is-logo-pending,
.js .footer-brand .wordmark-logo {
  display: block;
  width: 129.055px;
  min-width: 129.055px;
  max-width: none;
  height: 84px;
  min-height: 84px;
  margin-bottom: 16px;
  overflow: hidden;
}
.footer-brand .wordmark-logo.has-logo > img,
.footer-brand .wordmark-logo.is-logo-pending > img {
  display: block;
  width: 100%;
  max-width: none;
  height: 84px;
  max-height: none;
  margin: 0;
  object-fit: contain;
}
.footer-brand .wordmark-logo.is-logo-fallback {
  height: 84px;
  overflow: hidden;
}
.footer-brand .wordmark-logo.is-logo-fallback strong,
.footer-brand .wordmark-logo.is-logo-fallback small { display: block; }

.cc-no-photo {
  width: 100%; height: 100%; display: grid; place-items: center;
  color: var(--ink-soft); font-size: 15px; background:
    linear-gradient(135deg, rgba(255,255,255,.7), transparent), var(--paper-tint);
}
.cc-status {
  position: absolute; top: 10px; left: 10px; z-index: 3;
  color: #fff; background: #c62828;
  font: 900 18px/1 var(--display);
  letter-spacing: .12em; text-transform: uppercase;
  padding: 9px 15px;
}
.car-card.is-pending .cc-status { background: #c62828; }
.car-card.is-sold .cc-tag { z-index: 4; }
.cc-tag-sold {
  background: #c62828;
  font-size: 18px; font-weight: 900; line-height: 1;
  letter-spacing: .12em; text-transform: uppercase; padding: 9px 15px;
}
.car-card.is-sold .cc-actions,
.car-card.is-pending .cc-actions { opacity: .72; }

.data-empty,
.vx-loading,
.vx-error {
  padding: clamp(64px, 9vw, 112px) 0;
  text-align: center;
}
.data-empty {
  grid-column: 1 / -1;
  padding: clamp(38px, 6vw, 68px) clamp(20px, 4vw, 44px);
  border: 2px dashed #c9c5bb;
  border-radius: var(--r-card);
  background: rgba(255,255,255,.55);
}
.data-empty h3 { margin-bottom: 8px; }
.data-empty p { max-width: 42em; margin: 0 auto 20px; color: var(--ink-soft); }
.data-empty .btn { margin-top: 4px; }
.data-empty--dark { color: #c9ced4; border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.04); }
.data-empty--dark h3 { color: #fff; }
.data-empty--dark p { color: #a7aeb6; }

.car-grid:empty { min-height: 240px; }
.fs-cars:empty { width: 160px; min-height: 48px; }
.footer-sign .fs-left { min-height: 48px; }
.is-map-empty { min-height: 220px; border: 2px dashed #cbc7bd; border-radius: var(--r-card); background: var(--paper); }
.is-map-empty::after { content: "Map becomes available when the dealership address is added to CRM."; display: grid; place-items: center; min-height: 220px; padding: 24px; color: var(--ink-soft); text-align: center; }
.place-map > iframe[data-map-embed] {
  display: block; width: 100%; height: auto; min-height: 0; aspect-ratio: 9 / 5;
  border: 0; border-radius: var(--r-card); background: var(--paper-tint);
}
.place-map.is-map-pending::before {
  content: "";
  display: block;
  width: 100%;
  aspect-ratio: 9 / 5;
  border-radius: var(--r-card);
  background: var(--paper-tint);
}
.place-map.is-map-pending .d-map-cap { visibility: hidden; }
.place-map > iframe[data-map-embed][hidden],
.place-map > [data-map-fallback][hidden] { display: none !important; }

.pg__msg,
.vd__msg { margin: 14px 0 0; font-weight: 700; font-size: 15px; }
.pg__msg.is-ok,
.vd__msg.is-ok { color: #217a39; }
.pg__msg.is-error,
.vd__msg.is-error { color: var(--red); }
.field.is-error input,
.field.is-error textarea,
.field.is-error select,
.field input.is-invalid,
.field textarea.is-invalid,
.field select.is-invalid { border-color: var(--red); }
.field-error { display: block; margin-top: 4px; color: var(--red); font-size: 15px; }

.vx-loading,
.vx-error { min-height: 58vh; display: grid; place-items: center; }
.vx-error .wrap,
.vx-loading .wrap { max-width: 760px; }
.vx-error p:not(.sec-kicker),
.vx-loading p:not(.sec-kicker) { color: var(--ink-soft); }
.vx-error .btn { margin-top: 12px; }
.vx-stage .cc-no-photo { min-height: 420px; }
.vx-title-status { display: inline-flex; margin-bottom: 10px; padding: 7px 12px; border-radius: 999px; color: #fff; background: var(--red); font: 800 13px/1 var(--display); letter-spacing: .09em; text-transform: uppercase; }
.vx-title-status,
.vx-title-status.is-pending { border-radius: 0; background: #c62828; font-size: 18px; font-weight: 900; line-height: 1; letter-spacing: .12em; padding: 9px 15px; }
.prc-price.is-sold,
.vs-price.is-sold b { display: inline-flex; flex: 0 0 auto; background: #c62828; color: #fff; font-size: 18px; font-weight: 900; line-height: 1; letter-spacing: .12em; padding: 9px 15px; text-transform: uppercase; }
.vx-plate .vp-row b { overflow-wrap: anywhere; text-align: right; }
.vx-article > p:last-child { margin-bottom: 0; }
.vx-article .vx-chap .ch-body p { margin: 0 0 10px; }
.vx-map[hidden], .vx-row[hidden], .vx-dir[hidden] { display: none !important; }

.deal-card.is-disabled { position: relative; }
.deal-card.is-disabled > :not(.data-empty) { opacity: .18; pointer-events: none; }
.deal-card > .data-empty { grid-column: 1 / -1; }
button:disabled,
input:disabled,
select:disabled { cursor: not-allowed; opacity: .6; }

@media (max-width: 1119px) {
  .masthead .wordmark-logo { min-width: 0; min-height: 46px; max-width: min(46vw, 280px); }
  .masthead .wordmark-logo.has-logo,
  .masthead .wordmark-logo.is-logo-pending,
  .js .masthead .wordmark-logo {
    width: 70.673px;
    min-width: 70.673px;
    max-width: 70.673px;
    min-height: 46px;
    flex-basis: 70.673px;
  }
  .masthead .wordmark-logo.has-logo > img,
  .masthead .wordmark-logo.is-logo-pending > img {
    height: 46px;
    margin: 0;
    filter: none;
  }
  .masthead .wordmark-logo strong { font-size: clamp(16px, 4vw, 22px); }
  .masthead .wordmark-logo small { display: none; }
  .masthead .wordmark-logo.is-logo-fallback { height: 46px; }
  .masthead .wordmark-logo.is-logo-fallback strong { font-size: 11px; }
}
@media (max-width: 760px) {
  body[data-page="index"] .footer-brand .wordmark-logo.has-logo,
  body[data-page="index"] .footer-brand .wordmark-logo.is-logo-pending,
  .js body[data-page="index"] .footer-brand .wordmark-logo {
    width: 104.473px;
    min-width: 104.473px;
    height: 68px;
    min-height: 68px;
  }
  body[data-page="index"] .footer-brand .wordmark-logo.has-logo > img,
  body[data-page="index"] .footer-brand .wordmark-logo.is-logo-pending > img { height: 68px; }
  body[data-page="index"] .footer-brand .wordmark-logo.is-logo-fallback { height: 68px; }
}
@media (max-width: 520px) {
  .wordmark-logo.is-logo-fallback strong { overflow-wrap: anywhere; }
  .vx-stage .cc-no-photo { min-height: 260px; }
}
