/* ============================================================================
   DFG UNIFIED BUTTON SYSTEM — one source of truth for the whole site.
   Approved by Francisco (2026-06-26): one primary look (the "Show cars" red),
   secondaries share the same shape/height/weight in outline or dark variants.

   Loaded LAST on every page so it overrides the per-page inline button styles.
   Normalizes only the VISUAL identity (color, radius, weight, border, hover) —
   never display / width / margin / padding — so existing layouts are preserved.
   Text-link CTAs (.sx-*-card__cta, .sx-*-hero__cta, .sx-deal__cta …) are
   intentionally NOT touched: they are inline "Read more →" links, not buttons.
   ============================================================================ */
:root{
  --dfgb-red:#FD3049;
  --dfgb-red-dark:#D90E26;
  --dfgb-ink:#0a0a0a;
  --dfgb-radius:12px;
}

/* ---- PRIMARY — red filled (the approved "Show cars" identity) ---- */
.btn-primary,
.sx-reserve,
.sf__cta-btn,
.mnav__cta,
.sx-btn--red,
.sx-btn-red,
.btn--red,
.btn-red,
.dfgse__cta{
  background:var(--dfgb-red) !important;
  color:#fff !important;
  border:none !important;
  border-radius:var(--dfgb-radius) !important;
  font-weight:700 !important;
  transition:background .2s ease, transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s ease !important;
}
.btn-primary:hover,
.sx-reserve:hover,
.sf__cta-btn:hover,
.mnav__cta:hover,
.sx-btn--red:hover,
.sx-btn-red:hover,
.btn--red:hover,
.btn-red:hover,
.dfgse__cta:hover{
  background:var(--dfgb-red-dark) !important;
  transform:translateY(-1px);
}

/* ---- DARK filled — secondary action on a light surface ---- */
.btn-dark,
.sx-btn-dark,
.sx-btn--dark{
  background:var(--dfgb-ink) !important;
  color:#fff !important;
  border:none !important;
  border-radius:var(--dfgb-radius) !important;
  font-weight:700 !important;
  transition:background .2s ease, transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s ease !important;
}
.btn-dark:hover,
.sx-btn-dark:hover,
.sx-btn--dark:hover{ transform:translateY(-1px); }

/* ---- OUTLINE / GHOST — secondary, SAME shape & weight (border/colour kept as-is,
        so white-on-dark and ink-on-light variants both stay correct) ---- */
.btn-outline,
.sx-btn--outline,
.sx-btn-ghost,
.sx-btn--ghost,
.sx-btn--ghost-ink,
.sx-btn--ghost-dark,
.btn--ghost,
.btn-ghost{
  border-radius:var(--dfgb-radius) !important;
  font-weight:700 !important;
  transition:background .2s ease, transform .2s cubic-bezier(.16,1,.3,1), border-color .2s ease !important;
}
.btn-outline:hover,
.sx-btn--outline:hover,
.sx-btn-ghost:hover,
.sx-btn--ghost:hover,
.sx-btn--ghost-ink:hover,
.sx-btn--ghost-dark:hover,
.btn--ghost:hover,
.btn-ghost:hover{ transform:translateY(-1px); }