/* ============================================================
   Handy Tradie 4 U — sticky mobile action bar
   Two actions (call + quote) so both conversion channels stay
   reachable. Revealed once the hero CTA scrolls out of view.
   ============================================================ */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:none;gap:10px;padding:9px 12px calc(9px + env(safe-area-inset-bottom,0px));
  background:var(--paper);border-top:2.5px solid var(--charcoal);
  box-shadow:0 -6px 18px rgba(14,36,48,.14);
  transform:translateY(102%);transition:transform .22s ease;
}
.sticky-cta.on{transform:translateY(0)}
.sticky-cta a{
  flex:1 1 0;min-height:52px;display:flex;align-items:center;justify-content:center;gap:9px;
  border-radius:999px;border:2.5px solid var(--charcoal);
  font-family:'Barlow',sans-serif;font-weight:800;font-size:15.5px;letter-spacing:.01em;
  text-decoration:none;padding:0 14px;
}
.sticky-cta .sc-call{background:var(--gold);color:var(--cta-text)}
.sticky-cta .sc-quote{background:var(--paper);color:var(--charcoal)}
.sticky-cta a:active{transform:translateY(1px)}
@media (max-width:860px){ .sticky-cta{display:flex} body{padding-bottom:0} }
@media (prefers-reduced-motion:reduce){ .sticky-cta{transition:none} }

/* ===== sticky CTA on desktop (added 21 Oct 2026) =====
   Same element as the mobile bar, shown as a floating pill bottom-right so a
   call and a quote button stay in view on every screen once the hero CTA has
   scrolled away. Hidden while the bottom quote form is on screen. */
.sc-num{display:none}
.sticky-cta a{transition:transform .15s ease, box-shadow .15s ease, filter .15s ease}
.sticky-cta a:hover{filter:brightness(.96)}
.sticky-cta a:focus-visible{outline:3px solid var(--charcoal);outline-offset:2px}
@media (min-width:861px){
  .sticky-cta{
    display:flex;left:auto;right:max(24px,env(safe-area-inset-right,0px));bottom:24px;
    padding:8px;gap:8px;border:2.5px solid var(--charcoal);border-radius:999px;
    box-shadow:0 12px 30px rgba(14,36,48,.24);
    transform:translateY(calc(100% + 48px));
  }
  .sticky-cta.on{transform:translateY(0)}
  .sticky-cta a{flex:0 0 auto;min-height:46px;font-size:15px;padding:0 20px}
  .sticky-cta a:hover{transform:translateY(-1px);box-shadow:0 3px 0 var(--charcoal);filter:none}
  .sc-num{display:inline}
}
