/* Exact customer PNGs. Backgrounds preserve native form text/status updates. */
.button[data-button-art] {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: min(100%, 320px); max-width: 100%; min-width: 0; height: auto; min-height: 44px;
  aspect-ratio: var(--button-ratio); padding: 0; border: 0; border-radius: 8px;
  background: transparent var(--button-art) center / contain no-repeat; box-shadow: none;
  font-size: 0; line-height: 0; color: transparent; text-shadow: none; overflow: visible;
  transition: transform 180ms ease, filter 180ms ease;
}
.button[data-button-art] > * { font-size: 0; line-height: 0; color: transparent; }
.button[data-button-art]::before { content: none; }
.button[data-button-art]::after, .labeled-button--customer-art .labeled-button__art-frame::after { content: none; }
.button[data-button-art]:hover, .button[data-button-art]:focus-visible {
  background: transparent var(--button-art) center / contain no-repeat;
  transform: translateY(-3px); filter: brightness(1.14) drop-shadow(0 5px 10px rgb(255 111 24 / .55));
}
.button[data-button-art]:focus-visible { outline: 3px solid #ffb56a; outline-offset: 5px; }
.button[data-button-art]:active { transform: translateY(0); }
.button[data-button-art]:disabled { opacity: .6; cursor: default; transform: none; filter: none; }
.site-header .header-actions .button[data-button-art] { width: 190px; min-width: 0; min-height: 44px; }
.equipment-card .button[data-button-art] { width: min(100%, 290px); }
.labeled-button--customer-art .labeled-button__art-frame { position: relative; --button-art: url('/images/cta/explore-models-customer.png'); }
@media (max-width: 980px) { .site-header .header-actions .button[data-button-art] { width: 155px; } }
@media (prefers-reduced-motion: reduce) {
  .button[data-button-art] { transition: none; }
  .button[data-button-art]:is(:hover,:focus-visible) { transform: none; }
}

[data-button-art="ask-a-question"] { --button-art: url("/images/cta/customer-buttons-v1/ask-a-question.png"); --button-ratio: 623 / 122; }
[data-button-art="basecamp"] { --button-art: url("/images/cta/customer-buttons-v1/basecamp.png"); --button-ratio: 623 / 124; }
[data-button-art="build-your-rig"] { --button-art: url("/images/cta/customer-buttons-v1/build-your-rig.png"); --button-ratio: 624 / 123; }
[data-button-art="chat"] { --button-art: url("/images/cta/customer-buttons-v1/chat.png"); --button-ratio: 606 / 132; }
[data-button-art="compare-vans"] { --button-art: url("/images/cta/customer-buttons-v1/compare-vans.png"); --button-ratio: 601 / 129; }
[data-button-art="compare"] { --button-art: url("/images/cta/customer-buttons-v1/compare.png"); --button-ratio: 606 / 134; }
[data-button-art="contact-patrol-vans"] { --button-art: url("/images/cta/customer-buttons-v1/contact-patrol-vans.png"); --button-ratio: 601 / 129; }
[data-button-art="contact-us"] { --button-art: url("/images/cta/customer-buttons-v1/contact-us.png"); --button-ratio: 656 / 144; }
[data-button-art="explore-models"] { --button-art: url("/images/cta/customer-buttons-v1/explore-models.png"); --button-ratio: 601 / 129; }
[data-button-art="explore-the-vans"] { --button-art: url("/images/cta/customer-buttons-v1/explore-the-vans.png"); --button-ratio: 624 / 120; }
[data-button-art="exterior"] { --button-art: url("/images/cta/customer-buttons-v1/exterior.png"); --button-ratio: 656 / 135; }
[data-button-art="faq"] { --button-art: url("/images/cta/customer-buttons-v1/faq.png"); --button-ratio: 601 / 131; }
[data-button-art="interior"] { --button-art: url("/images/cta/customer-buttons-v1/interior.png"); --button-ratio: 656 / 135; }
[data-button-art="performance"] { --button-art: url("/images/cta/customer-buttons-v1/performance.png"); --button-ratio: 656 / 134; }
[data-button-art="plan-this-in-your-build"] { --button-art: url("/images/cta/customer-buttons-v1/plan-this-in-your-build.png"); --button-ratio: 623 / 123; }
[data-button-art="power"] { --button-art: url("/images/cta/customer-buttons-v1/power.png"); --button-ratio: 606 / 132; }
[data-button-art="request-a-quote"] { --button-art: url("/images/cta/customer-buttons-v1/request-a-quote.png"); --button-ratio: 656 / 137; }
[data-button-art="request-information"] { --button-art: url("/images/cta/customer-buttons-v1/request-information.png"); --button-ratio: 606 / 134; }
[data-button-art="see-the-process"] { --button-art: url("/images/cta/customer-buttons-v1/see-the-process.png"); --button-ratio: 601 / 129; }
[data-button-art="support"] { --button-art: url("/images/cta/customer-buttons-v1/support.png"); --button-ratio: 606 / 133; }
