/* ============================================================
   buttons.css — arrow & hover fixes for all CTA buttons.
   Loaded after main.css / inner.css / custom.css so these
   rules win on specificity.
   ============================================================ */

/* ── btn-navy: dark bg by default, white bg on hover ────────────────────── */
/* Default state: white arrow is correct (dark bg) */
/* Hover state: bg flips to white → arrow must flip to dark (navy/blue) */
.btn-navy:hover .svg-arrow.is-white {
    background-image: url(../img/arrow-up-blue.svg);
}

/* ── btn (outline / navy border on white bg sections) ───────────────────── */
/* Some .btn instances sit on white/cream bg — arrow.is-white is invisible */
/* Switch those to the dark arrow; keep white arrow where bg is dark */
.btn.btn-outline .svg-arrow.is-white,
.btn-outline .svg-arrow.is-white {
    background-image: url(../img/arrow-up-blue.svg);
}

/* ── Generic: any button whose hover turns bg light ─────────────────────── */
/* .btn-light hover keeps dark bg so white arrow stays fine — no override   */

/* ── Ensure arrow colour tracks text colour on all navy-hover buttons ────── */
.btn-navy:hover .svg-arrow,
.btn-navy:focus .svg-arrow {
    background-image: url(../img/arrow-up-blue.svg);
}

/* ── ct-submit (contact / service forms) — dark bg, white arrow OK ──────── */
/* No override needed for default; on hover bg stays dark so arrow stays white */

/* ── Transition on arrow colour change ──────────────────────────────────── */
.svg-arrow {
    transition: background-image 0s, transform .22s ease;
}