/* ============================================================
   SM FOOTER — compartido en todas las páginas del sitio
   Colores fijos (no dependen de las variables de cada sub-app)
   para que se vea igual en index, smconver, smcompressor, etc.
   ============================================================ */

.sm-footer {
  position: relative;
  z-index: 1;
  width: 100%;
  margin-top: 48px;
  border-top: 1px solid #2a2050;
  background: #100c20;
  padding: 34px 20px 22px;
  font-family: 'Segoe UI', system-ui, sans-serif;
}

.sm-footer-inner {
  max-width: 520px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}

.sm-footer-brand { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.sm-footer-logo { font-size: 15px; font-weight: 700; color: #e8e0ff; letter-spacing: .03em; }
.sm-footer-logo span { color: #a87dff; }
.sm-footer-tagline { font-size: 11.5px; color: #5c4e7a; max-width: 320px; line-height: 1.5; }

.sm-footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 20px;
}
.sm-footer-links a {
  font-size: 12.5px;
  color: #9d8fc4;
  text-decoration: none;
  transition: color .15s;
}
.sm-footer-links a:hover { color: #a87dff; }

.sm-footer-social { display: flex; gap: 10px; }
.sm-footer-social a {
  width: 36px; height: 36px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(168,125,255,.08);
  border: 1px solid #3d2b6b;
  color: #a87dff;
  font-size: 16px;
  text-decoration: none;
  transition: background .15s, border-color .15s, transform .15s;
}
.sm-footer-social a:hover {
  background: rgba(168,125,255,.18);
  border-color: #7c55d4;
  transform: translateY(-2px);
}

.sm-footer-bottom {
  font-size: 10.5px;
  color: #4a3d68;
  margin-top: 4px;
}