/* ==========================================================================
   Salespuzzle shared site footer.
   One footer on every public page, replacing the four divergent versions.
   Self-contained: sp- prefixed classes, literal fallbacks on every custom
   property, because each page carries its own inline CSS and :root.
   ========================================================================== */

.sp-foot{
  background:var(--ink, #1B2A20); color:#fff;
  padding:56px 24px 22px; margin-top:0;
}
.sp-foot *{box-sizing:border-box}
.sp-foot-in{
  max-width:var(--wrap, 1180px); margin-inline:auto;
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1fr; gap:34px 26px;
}
.sp-foot-brand img{height:32px; width:auto; display:block; margin-bottom:14px}
.sp-foot-brand p{
  margin:0; font-size:13.5px; line-height:1.6;
  color:rgba(255,255,255,.62); max-width:34ch;
}
.sp-foot-col h4{
  margin:0 0 12px; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(255,255,255,.45); font-weight:700;
}
.sp-foot-col a{
  display:block; padding:4px 0; font-size:13.5px; line-height:1.45;
  color:rgba(255,255,255,.82); text-decoration:none; transition:color .15s;
}
.sp-foot-col a:hover{color:#fff}
.sp-foot-col a:focus-visible,
.sp-foot-brand a:focus-visible{
  outline:2px solid var(--brand-l, #7DBE3C); outline-offset:3px; border-radius:3px;
}
.sp-foot-btm{
  max-width:var(--wrap, 1180px); margin:38px auto 0; padding-top:18px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:space-between;
  font-size:12px; color:rgba(255,255,255,.5);
}

@media (max-width:980px){
  .sp-foot-in{grid-template-columns:1fr 1fr 1fr; gap:30px 22px}
  .sp-foot-brand{grid-column:1 / -1}
}
@media (max-width:620px){
  .sp-foot{padding:44px 20px 20px}
  .sp-foot-in{grid-template-columns:1fr 1fr; gap:26px 18px}
  .sp-foot-btm{margin-top:30px; font-size:11.5px}
}
@media (max-width:420px){
  .sp-foot-in{grid-template-columns:1fr}
}