/* ==========================================================
   PIE
   ========================================================== */
.pie{
  background:#000;
  border-top:1px solid var(--borde);
  padding:0 0 0;
}

.base-pie{
  max-width:900px;              /* ← limita el ancho para que no se estire */
  margin:0 auto;                /* ← lo centra */
  padding:20px 0;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  font-size:.82rem;
  color:#6C6C74;
  padding-bottom:calc(20px + env(safe-area-inset-bottom,0px));
}

/* Redes sociales */
.redes-pie{
  display:flex;
  align-items:center;
  gap:10px;
  flex:none;                    /* ← evita que crezca y empuje el copyright */
}
.redes-pie a{
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  border:1px solid var(--borde);
  display:grid;
  place-items:center;
  transition:background .2s ease, border-color .2s ease, transform .2s ease;
}
.redes-pie a:hover{
  background:var(--rojo);
  border-color:var(--rojo);
  transform:translateY(-2px);
}
.redes-pie svg{
  width:16px;
  height:16px;
  fill:var(--gris-claro);
  transition:fill .2s ease;
}
.redes-pie a:hover svg{
  fill:#fff;
}