/* ============ FOOTER ============ */
.site-footer{ background: var(--ink-950); color: var(--dusk-100); padding-block: var(--sp-6) var(--sp-4); }
.footer-grid{ display:grid; gap: var(--sp-5); grid-template-columns: 1fr; }
@media (min-width: 860px){ .footer-grid{ grid-template-columns: 1.3fr 1fr 1fr 1fr; } }
.footer-brand p{ margin-top: var(--sp-2); color: var(--slate-400); font-size: var(--step--1); max-width: 34ch; }
.footer-col h5{ font-family: var(--font-mono); font-size: 0.72rem; letter-spacing:0.1em; text-transform:uppercase; color: var(--merit-gold-500); margin-bottom: var(--sp-2); }
.footer-col ul{ display:flex; flex-direction:column; gap: 0.5rem; }
.footer-col a, .footer-col address{ font-size: var(--step--1); color: var(--dusk-100); opacity:.85; font-style:normal; }
.footer-col a:hover{ opacity:1; text-decoration:underline; }
.footer-bottom{
  margin-top: var(--sp-6); padding-top: var(--sp-4); border-top: 1px solid rgba(255,255,255,0.1);
  display:flex; flex-wrap:wrap; gap: var(--sp-2); align-items:center; justify-content:space-between;
  font-size: 0.78rem; color: var(--slate-400);
}

/* ============ PWA INSTALL BANNER ============ */
.install-banner{
  position: fixed; left: var(--sp-3); right: var(--sp-3); bottom: var(--sp-3); z-index: 200;
  background: var(--paper-50); border-radius: var(--radius-md); box-shadow: var(--shadow-pop);
  padding: var(--sp-3) var(--sp-3); display:flex; align-items:center; gap: var(--sp-3);
  transform: translateY(140%); transition: transform var(--dur-2) var(--ease-out);
  max-width: 460px; margin-inline:auto; border:1px solid var(--slate-100);
}
.install-banner.show{ transform: translateY(0); }
.install-banner .brand-mark{ flex-shrink:0; }
.install-banner .txt{ flex:1; }
.install-banner .txt strong{ display:block; font-size: var(--step--1); }
.install-banner .txt span{ display:block; font-size: 0.75rem; color: var(--slate-600); }
.install-banner .close-x{ background:none; border:none; color: var(--slate-400); font-size:1.1rem; line-height:1; padding:0.3rem; }

/* ============ TOAST (offline / OTP) ============ */
.toast{
  position: fixed; top: var(--sp-3); left:50%; transform: translate(-50%,-140%);
  z-index: 300; background: var(--ridge-900); color:#fff; padding: 0.7em 1.2em; border-radius: var(--radius-pill);
  font-size: var(--step--1); box-shadow: var(--shadow-pop); transition: transform var(--dur-2) var(--ease-out);
}
.toast.show{ transform: translate(-50%,0); }

/* scroll reveal */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity 600ms var(--ease-out), transform 600ms var(--ease-out); }
.reveal.in{ opacity:1; transform:none; }

/* whatsapp float */
.float-actions{ position: fixed; right: var(--sp-3); bottom: var(--sp-3); z-index: 190; display:flex; flex-direction:column; gap:0.6rem; }
.float-btn{
  width:52px; height:52px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  box-shadow: var(--shadow-pop); color:#fff;
}
.float-btn.call{ background: var(--ridge-900); }
.float-btn.whatsapp{ background: #2FAF62; }

@media (min-width: 720px){
  .install-banner{ left:auto; right: var(--sp-4); bottom: var(--sp-4); }
}
