/* VeltrixHost CTA buttons — single source of truth.
   Two styles only: dark (black) and light (white).
   Applies to all customer-facing CTA classes across all 48 pages.
   Other controls, menu toggles and form inputs keep their functional styles. */
:root {
  --vh-button-black: #0c0f12;
  --vh-button-black-hover: #20262d;
  --vh-button-black-border: #0c0f12;
  --vh-button-black-hover-border: #20262d;
  --vh-button-white: #ffffff;
  --vh-button-white-hover: #f7f8f9;
  --vh-button-border: #d8dde3;
  --vh-button-border-hover: #cbd1d8;
  --vh-button-radius: 9px;
  --vh-link-ink: #0c0f12;
  --vh-link-hover: #20262d;
}
body.vh-page-body .vh-ui-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 11px 19px;
  border: 1px solid;
  border-radius: var(--vh-button-radius);
  font-family: var(--vh-font, "DM Sans", sans-serif);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.01em;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  box-shadow: none;
  transition: background-color .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
body.vh-page-body .vh-ui-button--black {
  background: var(--vh-button-black);
  border-color: var(--vh-button-black-border);
  color: #fff;
}
body.vh-page-body .vh-ui-button--black:is(:hover,:focus-visible) {
  background: var(--vh-button-black-hover);
  border-color: var(--vh-button-black-hover-border);
  color: #fff;
  transform: translateY(-1px);
}
body.vh-page-body .vh-ui-button--white {
  background: var(--vh-button-white);
  border-color: var(--vh-button-border);
  color: #1f2933;
}
body.vh-page-body .vh-ui-button--white:is(:hover,:focus-visible) {
  background: var(--vh-button-white-hover);
  border-color: var(--vh-button-border-hover);
  color: #1f2933;
  transform: translateY(-1px);
}
/* Footer contrast uses the same black button; only its border variable changes. */
/* Buttons in dark footer / department banners remain Style 1 black, but their
   visible border ensures they stand out from the dark panel beneath them. */
body.vh-page-body :is(.vh-footer-cta, .vh-contact-final) {
  --vh-button-black-border: #6f7a85;
  --vh-button-black-hover-border: #aab4bf;
}
body.vh-page-body .vh-ui-button:focus-visible {
  outline: 2px solid var(--brand-orange, #DA7826);
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  body.vh-page-body .vh-ui-button { transition: none; }
  body.vh-page-body .vh-ui-button:is(:hover,:focus-visible) { transform: none; }
}

/* Text links: a single source of truth alongside the two approved button styles.
   Decorative orange labels/icons are not links and remain in the original brand palette.
   Header/footer retain their existing contrast modes. */
body.vh-page-body main a.vh-ui-textlink {
  color: var(--vh-link-ink);
  text-decoration-color: currentColor;
  transition: color .18s ease, transform .18s ease, text-decoration-color .18s ease;
}
body.vh-page-body main a.vh-ui-textlink:is(:hover, :focus-visible) {
  color: var(--vh-link-hover);
  text-decoration-color: var(--vh-link-hover);
}
/* Lift standalone text actions just as black/white buttons lift. In-paragraph
   links remain inline so words and line breaks never jump unexpectedly. */
body.vh-page-body main a.vh-ui-textlink:is(.vh-text-link, .vh-department-card__mail, .vh-lic-view-all, .vh-lic-more-details, .vh-legal-back):is(:hover, :focus-visible) {
  transform: translateY(-1px);
}
/* The one inverse text link inside the black review panel needs white contrast. */
body.vh-page-body main .vh-review-submit-card a.vh-ui-textlink {
  color: #ffffff;
}
body.vh-page-body main .vh-review-submit-card a.vh-ui-textlink:is(:hover, :focus-visible) {
  color: #e3e8ed;
  text-decoration-color: #e3e8ed;
}
body.vh-page-body main a.vh-ui-textlink:focus-visible {
  outline: 2px solid #20262d;
  outline-offset: 3px;
}
@media (prefers-reduced-motion: reduce) {
  body.vh-page-body main a.vh-ui-textlink { transition: none; }
  body.vh-page-body main a.vh-ui-textlink:is(:hover, :focus-visible) { transform: none; }
}
